/* Secret mode: every unslop tell, on purpose. Only active under html.vibe.
   Styling and chrome only: notice data is rendered by the same markup in both modes. */
@font-face { font-family: "InterV"; src: url("/static/vendor/inter-latin-wght.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

html.vibe .vibe-only { display: revert !important; }
html.vibe span.vibe-only, html.vibe i.vibe-only, html.vibe kbd.vibe-only { display: inline-block !important; }
html.vibe .calm-only { display: none !important; }

html.vibe {
  --v-bg: #0a0514; --v-card: rgba(255,255,255,.06); --v-line: rgba(168,85,247,.45);
  --v-grad: linear-gradient(90deg, #a855f7 0%, #6366f1 45%, #22d3ee 100%);
  --v-grad2: linear-gradient(135deg, #ec4899 0%, #a855f7 50%, #3b82f6 100%);
  --v-glow: 0 0 24px rgba(168,85,247,.55), 0 0 64px rgba(99,102,241,.35);
  background: var(--v-bg); color-scheme: dark; overflow-x: clip;
}
html.vibe body {
  overflow-x: clip;
  max-width: 1180px; color: #ede9fe; background:
    radial-gradient(600px 420px at 85% -5%, rgba(236,72,153,.35), transparent 70%),
    radial-gradient(700px 520px at 0% 10%, rgba(99,102,241,.40), transparent 70%),
    radial-gradient(800px 600px at 50% 110%, rgba(34,211,238,.18), transparent 70%),
    var(--v-bg);
  font-family: "InterV", "Inter", system-ui, sans-serif; letter-spacing: -0.01em;
}
html.vibe body::before { /* dot grid with a radial fade */
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(196,181,253,.22) 1px, transparent 1px); background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 0%, #000 20%, transparent 70%); mask-image: radial-gradient(ellipse at 50% 0%, #000 20%, transparent 70%);
}
html.vibe a:hover { color: #f0abfc; }

/* announcement bar */
html.vibe .vbar { display: flex !important; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 14px;
  margin: -56px -48px 28px; padding: 10px 16px; background: var(--v-grad2); color: #fff; font-weight: 700; font-size: 13px;
  text-align: center; box-shadow: 0 8px 30px rgba(168,85,247,.5); }
.vexit { font: inherit; font-size: 12px; font-weight: 800; color: #fff; background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.5); border-radius: 999px; padding: 5px 12px; cursor: pointer; backdrop-filter: blur(8px); }
.vexit:hover { background: rgba(255,255,255,.3); transform: scale(1.05); }

/* header: glass pill, gradient logo tile, glowing badge */
html.vibe .top { position: sticky; top: 10px; z-index: 30; align-items: center; padding: 10px 12px 10px 10px; margin-bottom: 40px;
  background: rgba(20,10,40,.55); border: 1px solid rgba(255,255,255,.14); border-radius: 999px;
  -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 10px 40px rgba(124,58,237,.35); }
html.vibe .mark { display: inline-flex; align-items: center; gap: 8px; font-weight: 900; font-size: 18px;
  background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
html.vibe span.vlogo { display: inline-grid !important; }
.vlogo { width: 30px; height: 30px; border-radius: 10px; background: var(--v-grad2); color: #fff; -webkit-text-fill-color: #fff;
  place-items: center; font-size: 16px; box-shadow: var(--v-glow); }
.vpro { font-size: 10px; font-weight: 800; letter-spacing: .08em; padding: 3px 7px; border-radius: 999px; color: #fff;
  -webkit-text-fill-color: #fff; background: linear-gradient(90deg, #f59e0b, #ec4899); box-shadow: 0 0 14px rgba(236,72,153,.7); }
html.vibe .tools { align-items: center; gap: 10px; }
html.vibe .how { color: #c4b5fd; font-weight: 600; font-size: 13px; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.06); }
html.vibe .count { display: inline-flex; align-items: center; gap: 4px; color: #fff; font-weight: 800; font-size: 13px; padding: 7px 12px;
  border-radius: 999px; background: var(--v-grad2); box-shadow: var(--v-glow); }
html.vibe .count:hover { transform: scale(1.06); color: #fff; }
.vdot { width: 8px; height: 8px; border-radius: 50%; background: #4ade80; margin-right: 4px; box-shadow: 0 0 0 0 rgba(74,222,128,.8);
  animation: vping 1.4s infinite; }
@keyframes vping { 0% { box-shadow: 0 0 0 0 rgba(74,222,128,.8); } 100% { box-shadow: 0 0 0 10px rgba(74,222,128,0); } }

/* gradient text, eyebrows, pills */
.vgrad { background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.veyebrow { display: block; font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #c084fc; }
.vcenter { text-align: center; }
html.vibe .vpill { display: inline-flex !important; }
.vpill { align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #e9d5ff; padding: 6px 8px 6px 14px;
  border-radius: 999px; background: rgba(168,85,247,.15); border: 1px solid var(--v-line); box-shadow: 0 0 20px rgba(168,85,247,.35); }
.vpill b { font-size: 10px; letter-spacing: .1em; padding: 3px 8px; border-radius: 999px; background: var(--v-grad2); color: #fff; }

/* hero */
html.vibe .vhero { display: block !important; text-align: center; padding: 24px 0 36px; position: relative; }
html.vibe .vhero::before { content: ""; position: absolute; left: 50%; top: 10%; width: 340px; height: 340px; transform: translateX(-50%); z-index: -1;
  border-radius: 50%; background: radial-gradient(circle at 35% 35%, #f0abfc, #a855f7 40%, #4f46e5 70%, transparent 72%); filter: blur(60px); opacity: .55;
  animation: vfloat 6s ease-in-out infinite alternate; }
@keyframes vfloat { to { transform: translate(-42%, 24px) scale(1.12); } }
.vhero h1 { font-size: clamp(36px, 6vw, 68px); line-height: 1.02; font-weight: 900; letter-spacing: -0.045em; margin: 22px auto 16px; max-width: 14ch; }
.vhero-q h1 { font-size: clamp(28px, 5vw, 48px); max-width: none; margin-top: 0; }
.vsub { color: #a5b4fc; font-size: 18px; max-width: 34em; margin: 0 auto 26px; }
.vctas { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.vbtn { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 15px; padding: 14px 24px; border-radius: 999px;
  transition: all .3s cubic-bezier(.34,1.56,.64,1); }
.vbtn-1 { background: var(--v-grad2); color: #fff; box-shadow: 0 10px 30px rgba(168,85,247,.6), 0 0 0 1px rgba(255,255,255,.2) inset; }
.vbtn-2 { background: rgba(255,255,255,.06); color: #e9d5ff; border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(10px); }
.vbtn:hover { transform: translateY(-3px) scale(1.04); color: #fff; }
html.vibe .vproof { display: flex !important; }
.vproof { align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; margin: 24px 0 0; font-size: 13px; color: #c4b5fd; }
html.vibe .vavatars { display: inline-flex !important; }
.vavatars i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 15px;
  background: var(--v-grad2); border: 2px solid var(--v-bg); margin-left: -8px; }

/* search: glass pill with glow */
html.vibe .search { padding: 18px; border-radius: 28px; background: var(--v-card); border: 1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 20px 60px rgba(76,29,149,.45); }
.qwrap { position: relative; display: flex; align-items: center; }
html.vibe .qwrap { background: rgba(10,5,20,.6); border-radius: 999px; border: 1.5px solid transparent;
  background-image: linear-gradient(rgba(16,8,34,.95), rgba(16,8,34,.95)), var(--v-grad); background-origin: border-box; background-clip: padding-box, border-box;
  box-shadow: 0 0 30px rgba(168,85,247,.35); padding: 0 12px 0 18px; }
.vq-ic { font-size: 20px; margin-right: 8px; }
html.vibe .q { border: 0; font-size: 20px; font-weight: 600; color: #fff; padding: 14px 0; }
html.vibe .q::placeholder { color: #8b7fb8; }
.vkbd { font: 700 12px "InterV", system-ui; color: #c4b5fd; padding: 4px 8px; border-radius: 8px; border: 1px solid var(--v-line); background: rgba(168,85,247,.12); }
html.vibe .filters label { color: #a78bfa; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
html.vibe .filters input, html.vibe .filters select { color: #ede9fe; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; padding: 8px 12px;
  background-color: rgba(255,255,255,.05); }
html.vibe .filters select { background: rgba(255,255,255,.05); }
html.vibe .filters input::-webkit-calendar-picker-indicator { filter: invert(1) hue-rotate(200deg); }
html.vibe .filters button { border-radius: 999px; font-weight: 800; padding: 11px 22px; background: var(--v-grad2); box-shadow: 0 8px 24px rgba(168,85,247,.55); }
html.vibe .filters button:hover { transform: scale(1.05); background: var(--v-grad2); }
html.vibe .clear { color: #f0abfc; font-weight: 700; }

/* stats band, logo strip */
html.vibe .vstats { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 28px 0; }
.vcard { position: relative; border-radius: 24px; padding: 18px; background: linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 18px 50px rgba(30,10,60,.6), 0 0 30px rgba(168,85,247,.18);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); overflow: hidden; transition: all .3s cubic-bezier(.34,1.56,.64,1); }
.vcard:hover { transform: translateY(-4px) scale(1.02); }
.vstats .vwide { grid-column: 1 / -1; }
.vnum { display: block; font-size: 34px; font-weight: 900; letter-spacing: -0.04em; margin: 8px 0 4px; font-feature-settings: "tnum" 0; }
.vdelta { font-size: 12px; font-weight: 700; color: #4ade80; }
.vspark { position: absolute; right: 0; bottom: 0; width: 55%; height: 34px; opacity: .8; }
.vspark path { fill: none; stroke: #22d3ee; stroke-width: 2; filter: drop-shadow(0 0 4px #22d3ee); vector-effect: non-scaling-stroke; }
html.vibe .vtrust { display: block !important; margin: 10px 0 34px; text-align: center; }
.vmarq { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.vmarq-in { display: flex; gap: 40px; width: max-content; padding: 14px 0; animation: vmarq 18s linear infinite; }
.vmarq-in span { font-weight: 800; font-size: 18px; color: rgba(237,233,254,.55); white-space: nowrap; }
@keyframes vmarq { to { transform: translateX(-50%); } }

/* results meta + view tabs */
html.vibe .meta { flex-wrap: wrap; row-gap: 12px; align-items: center; color: #c4b5fd; font-size: 14px; font-weight: 600; margin-bottom: 14px; }
html.vibe .meta .veyebrow { display: inline-block !important; margin-right: 6px; }
html.vibe .views { gap: 6px; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
html.vibe .views a { display: inline-flex; align-items: center; white-space: nowrap; color: #c4b5fd; font-weight: 700; padding: 7px 14px; border-radius: 999px; border: 0; }
html.vibe .views a[aria-current] { background: var(--v-grad2); color: #fff; box-shadow: 0 0 18px rgba(168,85,247,.6); }
.vnew { font-size: 10px; margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: #facc15; color: #1e1b4b; font-weight: 800; }

/* results: every row a glowing glass card (data inside unchanged) */
html.vibe .results { border-collapse: separate; border-spacing: 0 10px; }
html.vibe .results th { color: #a78bfa; border: 0; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
html.vibe .results td { border: 0; background: rgba(255,255,255,.05); }
html.vibe .results tr td:first-child { border-radius: 18px 0 0 18px; padding-left: 16px; }
html.vibe .results tr td:last-child { border-radius: 0 18px 18px 0; padding-right: 16px !important; }
html.vibe .results tbody tr:hover td { background: rgba(168,85,247,.16); }
html.vibe .c-date { color: #a5b4fc; }
html.vibe .c-date::before { content: "\1F4C5  "; }
html.vibe .c-name { font-weight: 800; }
html.vibe .c-name a { color: #fff; }
html.vibe .c-off { color: #c4b5fd; }
html.vibe .c-amt { font-weight: 900; }
html.vibe .c-amt:not(:empty) { color: #fde047; text-shadow: 0 0 14px rgba(250,204,21,.65), 0 0 2px rgba(244,114,182,.9); }
html.vibe .c-sub::before { content: "\1F4CD  "; }
html.vibe .pager { color: #c4b5fd; font-weight: 700; }
html.vibe .pager a { padding: 10px 16px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); justify-self: start; }
html.vibe .pager a:last-child { justify-self: end; }

/* bento, steps, testimonials, pricing, cta, footer */
html.vibe .vbento, html.vibe .vsteps, html.vibe .vquotes, html.vibe .vprice, html.vibe .vcta { display: block !important; margin-top: 72px; }
.vh2 { font-size: clamp(28px, 4.5vw, 44px); font-weight: 900; letter-spacing: -0.04em; line-height: 1.05; text-align: center; margin: 10px auto 28px; max-width: 18ch; }
.vgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.vchart { grid-column: span 2; grid-row: span 2; }
.vbars { display: flex; align-items: flex-end; gap: 5px; height: 200px; margin-top: 16px; }
.vbar-c { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; }
.vbar-c i { width: 100%; height: var(--h); border-radius: 999px 999px 6px 6px; background: linear-gradient(180deg, #f0abfc, #a855f7 50%, #6366f1);
  box-shadow: 0 0 14px rgba(168,85,247,.7); animation: vgrow 1.2s cubic-bezier(.34,1.56,.64,1) both; animation-delay: calc(var(--k) * 50ms); transform-origin: bottom; }
@keyframes vgrow { from { transform: scaleY(0); } }
.vbar-c span { font-size: 9px; font-weight: 800; color: #a78bfa; letter-spacing: .06em; }
.vfeat { display: flex; flex-direction: column; gap: 6px; }
.vfeat b { font-size: 16px; font-weight: 800; color: #fff; }
.vfeat span { color: #a5b4fc; font-size: 13px; }
.vic { font-size: 28px; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; background: var(--v-grad2); box-shadow: var(--v-glow); margin-bottom: 6px; }
.vsteps ol { list-style: none; display: flex; justify-content: center; gap: 0; padding: 0; margin: 0; position: relative; }
.vsteps li { flex: 1; max-width: 220px; display: flex; flex-direction: column; align-items: center; gap: 10px; position: relative; font-weight: 700; color: #e9d5ff; }
.vsteps li:not(:last-child)::after { content: ""; position: absolute; top: 24px; left: calc(50% + 30px); right: calc(-50% + 30px); height: 2px; background: var(--v-grad); box-shadow: 0 0 10px #a855f7; }
.vsteps li b { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; font-size: 20px; font-weight: 900; color: #fff; background: var(--v-grad2); box-shadow: var(--v-glow); }
html.vibe .vquotes { display: grid !important; grid-template-columns: 1fr 1fr; gap: 14px; }
.vquotes > .veyebrow, .vquotes > .vh2 { grid-column: 1 / -1; }
.vquotes figure { margin: 0; }
.vstars { font-size: 14px; }
.vquotes blockquote { margin: 12px 0 16px; font-size: 16px; font-weight: 500; color: #ede9fe; line-height: 1.5; }
.vquotes figcaption { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; }
.vquotes figcaption b { color: #fff; font-weight: 800; }
.vquotes figcaption span { grid-column: 2; font-size: 12px; color: #a78bfa; }
.vorb { grid-row: span 2; width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, #fff, #f0abfc 20%, #a855f7 55%, #312e81); box-shadow: 0 0 20px #a855f7; }
.vtiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; align-items: center; }
.vtiers .vcard { display: flex; flex-direction: column; gap: 8px; text-align: center; align-items: center; padding: 26px 18px; }
.vtiers b { font-size: 18px; font-weight: 800; color: #fff; }
.vamt { font-size: 44px; font-weight: 900; letter-spacing: -0.04em; background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vtiers span:not(.vamt):not(.vpill) { font-size: 13px; color: #c4b5fd; }
.vpop { transform: scale(1.06); border: 1.5px solid #a855f7 !important; box-shadow: 0 0 50px rgba(168,85,247,.55) !important; }
html.vibe .vcta { text-align: center; padding: 48px 20px; border-radius: 32px; background: var(--v-grad2); box-shadow: 0 30px 80px rgba(168,85,247,.5); }
.vcta .vh2 { color: #fff; margin-bottom: 20px; }
.vcta .vbtn-1 { background: #fff; color: #7c3aed; }
html.vibe .vfoot { display: block !important; margin-top: 64px; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.1); color: #a78bfa; font-size: 13px; }
.vcols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 26px; }
.vcols div { display: flex; flex-direction: column; gap: 8px; }
.vcols b { font-size: 11px; letter-spacing: .14em; color: #e9d5ff; font-weight: 800; }
.vfoot p { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.vchip { font-weight: 800; color: #fff; padding: 5px 12px; border-radius: 999px; background: var(--v-grad2); box-shadow: 0 0 16px rgba(168,85,247,.6); }

/* map in secret mode */
html.vibe .map { border-radius: 28px; overflow: hidden; border: 1px solid rgba(168,85,247,.5); box-shadow: 0 0 60px rgba(168,85,247,.45), inset 0 0 0 1px rgba(255,255,255,.08); background: #0d0620; }
html.vibe .maplegend, html.vibe .mapnote { color: #a78bfa; }
html.vibe .dot { background: #22d3ee; box-shadow: 0 0 10px #22d3ee; }
html.vibe .dot.ap { background: rgba(240,171,252,.35); box-shadow: inset 0 0 0 1.25px #f0abfc, 0 0 8px #f0abfc; }
html.vibe .ring { box-shadow: inset 0 0 0 1.25px #c084fc, 0 0 6px #c084fc; }
html.vibe .ramp i:nth-child(1) { background: #3b1d6e; } html.vibe .ramp i:nth-child(2) { background: #6d28d9; }
html.vibe .ramp i:nth-child(3) { background: #a21caf; } html.vibe .ramp i:nth-child(4) { background: #ec4899; }
html.vibe .ramp i:nth-child(5) { background: #fde047; }
html.vibe .msum, html.vibe .msum b { color: #ede9fe; }
html.vibe .mapbar .veyebrow { display: inline !important; }
html.vibe .medit { color: #f0abfc; font-weight: 700; }
html.vibe .maplegend { height: 34px; }
html.vibe .place { background: rgba(20,10,40,.78); color: #ede9fe; border: 1px solid rgba(255,255,255,.16); border-radius: 24px;
  -webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5); box-shadow: 0 20px 60px rgba(76,29,149,.6), 0 0 30px rgba(168,85,247,.3); }
html.vibe .place h2 { font-weight: 900; background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
html.vibe .pl-prec, html.vibe .pl-addr, html.vibe .pl-meta { color: #a78bfa; }
html.vibe .pl-n { border-bottom-color: rgba(168,85,247,.5); color: #c4b5fd; font-weight: 700; }
html.vibe .pl-list li { border-bottom-color: rgba(255,255,255,.08); }
html.vibe .pl-list b { color: #fff; font-weight: 800; }
html.vibe .pl-off { color: #c4b5fd; }
html.vibe .pl-amt { color: #facc15; font-weight: 800; }
html.vibe .pl-x { color: #f0abfc; font-weight: 700; }
html.vibe .maplibregl-ctrl-group { border-radius: 14px !important; background: rgba(20,10,40,.8) !important; border-color: rgba(168,85,247,.5); overflow: hidden; }
html.vibe .maplibregl-ctrl-group button .maplibregl-ctrl-icon { filter: invert(1) hue-rotate(200deg); }
html.vibe .maplibregl-ctrl-attrib { background: rgba(20,10,40,.8) !important; color: #a78bfa; }
html.vibe .maplibregl-ctrl-attrib a { color: #c4b5fd; }
html.vibe .maplibregl-ctrl-attrib-button { filter: invert(1); }

/* detail page */
html.vibe .notice h1 { font-weight: 900; letter-spacing: -0.04em; background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
html.vibe .notice .sub { color: #a5b4fc; }
html.vibe .notice dl { border-top-color: #a855f7; background: rgba(255,255,255,.04); border-radius: 0 0 24px 24px; padding: 0 18px; }
html.vibe .notice dt { color: #a78bfa; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
html.vibe .notice dt, html.vibe .notice dd { border-bottom-color: rgba(255,255,255,.08); }
html.vibe .links a { border: 1px solid var(--v-line); border-radius: 999px; padding: 4px 12px; display: inline-block; margin: 0 8px 8px 0; }
html.vibe dialog#how { background: #140a28; color: #ede9fe; border-radius: 28px; border: 1px solid rgba(168,85,247,.5); box-shadow: 0 0 80px rgba(168,85,247,.5); }
html.vibe .how-body h2 { font-weight: 900; background: var(--v-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
html.vibe .how-close { border: 0; border-radius: 999px; background: var(--v-grad2); color: #fff; font-weight: 800; }

@media (max-width: 900px) {
  html.vibe .vstats, .vgrid { grid-template-columns: 1fr 1fr; }
  .vchart { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-width: 640px) {
  html.vibe .vbar { margin: -28px -20px 20px; font-size: 12px; }
  html.vibe .top { padding: 8px 8px 8px 8px; margin-bottom: 24px; top: 8px; }
  html.vibe .mark { font-size: 16px; gap: 6px; }
  .vlogo { width: 26px; height: 26px; font-size: 14px; border-radius: 8px; }
  html.vibe .how { padding: 6px 8px; font-size: 12px; }
  html.vibe .count { padding: 6px 10px; font-size: 12px; }
  html.vibe .tools { gap: 6px; }
  .vhero h1 { font-size: 40px; }
  .vsub { font-size: 16px; }
  .vbtn { padding: 12px 18px; font-size: 14px; }
  html.vibe .search { padding: 12px; border-radius: 22px; }
  html.vibe .q { font-size: 17px; padding: 12px 0; }
  .vkbd { display: none !important; }
  html.vibe .filters label { flex: 1 1 40%; }
  .vnum { font-size: 26px; }
  html.vibe .results { border-spacing: 0; }
  html.vibe .results tr { margin-bottom: 10px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 20px;
    background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); box-shadow: 0 0 24px rgba(168,85,247,.15); }
  html.vibe .results td, html.vibe .results tr td:first-child, html.vibe .results tr td:last-child { background: transparent; border-radius: 0; padding: 0 !important; }
  html.vibe .results .c-sub { color: #c4b5fd; }
  .vgrid { grid-template-columns: 1fr; }
  .vbars { height: 150px; gap: 3px; }
  .vbar-c span { font-size: 0; }
  .vbar-c:nth-child(4n+1) span { font-size: 8px; }
  html.vibe .vquotes { grid-template-columns: 1fr; }
  .vtiers { grid-template-columns: 1fr; }
  .vpop { transform: none; }
  .vcols { grid-template-columns: 1fr 1fr; }
  .vsteps li { font-size: 13px; text-align: center; }
  html.vibe .map { margin: 0; border-radius: 22px; }
  html.vibe .place { border-radius: 24px 24px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .vdot, .vmarq-in, .vbar-c i, html.vibe .vhero::before { animation: none; }
}

/* snapshots for the mode transition: backdrop filters have no backdrop inside a view transition */
html[data-vt] .top, html[data-vt] .search, html[data-vt] .vcard, html[data-vt] .place, html[data-vt] .vbtn-2, html[data-vt] .vexit {
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html[data-vt].vibe .top { background: rgba(28,14,54,.92); }
html[data-vt].vibe .search { background: rgba(28,14,54,.75); }