/* BotForVU experience: quieter hierarchy, readable information, honest states. */
:root { color-scheme: dark; --background: 240 8% 7%; --foreground: 40 12% 95%; --card: 240 7% 10%; --popover: 240 7% 12%; --primary: 341 72% 61%; --muted-foreground: 240 5% 69%; --sidebar-background: 240 8% 8%; }
html { scroll-padding-top: 96px; }
body { background: #111114; color: #f1efed; font-family: Inter, system-ui, sans-serif; }
.bg-void { background-color: #111114; }
.bg-abyss { background-color: #17171c; }
.bg-panel { background-color: #1d1d24; }
.bg-raise { background-color: #24242d; }
.bg-grid-landing { background-image: none !important; }
.font-display { font-family: Inter, system-ui, sans-serif; }
.mono-label { font-family: Inter, system-ui, sans-serif; letter-spacing: .045em; font-size: 11px; line-height: 1.65; }
.text-inkdim { color: #bbb8c2; }
.text-inkmute { color: #95909f; }
.text-pink { color: #ef8ca8; }
.text-g-pink { color: #f092ad; background: none; -webkit-text-fill-color: currentColor; }
.bg-g-pink { background: #d44d76; }
.bg-g-panel { background-image: none; }
.chamfer, .chamfer-wrap { clip-path: none; border-radius: 16px; }
.panel-depth { box-shadow: none; }
.shadow-pink-glow, .shadow-pink-glow-lg { box-shadow: none; }
.glow-blob, .scanline, .mesh-hint { display: none !important; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: 2px solid #f3a0b8; outline-offset: 4px; }
input::placeholder, textarea::placeholder { letter-spacing: .025em !important; text-transform: none !important; font-family: Inter, system-ui, sans-serif; }
input, textarea { font-family: Inter, system-ui, sans-serif !important; }
[code-path^="src/components/dashboard/DashboardShell.tsx"] .mono-label { font-size: 11px; }
[code-path^="src/pages/dashboard/"] h1 { letter-spacing: -.035em; }
[code-path^="src/pages/home/"] .font-mono { font-family: Inter, system-ui, sans-serif; }
[code-path^="src/pages/home/"] .text-outline-pink { -webkit-text-stroke: 0; color: #c9849b; }
[code-path^="src/pages/home/"] h2 { letter-spacing: -.035em; }
[code-path^="src/pages/home/Arsenal"] { background: #141418; }
[code-path^="src/components/Footer"] { background: #101013; }
.bf-home { overflow: clip; background: #111114; }
.bf-home-hero { padding: 74px 32px 0; position: relative; }
.bf-hero-inner { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: 1.05fr 1fr; gap: 72px; align-items: center; padding: 50px 0 76px; }
.bf-eyebrow { font-size: 12px; font-weight: 600; color: #e397ac; letter-spacing: .08em; margin: 0 0 24px; }
.bf-hero-copy h1 { font-size: clamp(44px, 4.8vw, 68px); line-height: 1.08; letter-spacing: -.055em; font-weight: 600; margin: 0; }
.bf-hero-copy h1 span { color: #e895ad; }
.bf-hero-description { margin: 27px 0 0; font-size: 17px; line-height: 1.8; color: #b7b4bf; max-width: 450px; }
.bf-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 31px 0 0; }
.bf-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 23px; border-radius: 10px; font-size: 14px; font-weight: 600; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.bf-button:hover { transform: translateY(-1px); }
.bf-button-primary { color: #fff; background: #d24c74; border: 1px solid #df6386; }
.bf-button-primary:hover { background: #df6386; }
.bf-button-secondary { color: #ddd9e2; background: transparent; border: 1px solid #3a363f; }
.bf-button-secondary:hover { border-color: #8d6977; background: #242026; }
.bf-hero-note { margin: 20px 0 0; font-size: 12px; line-height: 1.7; color: #8e8898; }
.bf-example { border: 1px solid #39323b; border-radius: 22px; padding: 24px; background: #1a181e; box-shadow: 0 24px 70px #0003; transform: rotate(-1deg); }
.bf-example-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; font-weight: 600; margin-bottom: 20px; }
.bf-example-label { color: #aaa2ae; font-size: 10px; font-weight: 500; border: 1px solid #49404b; border-radius: 20px; padding: 4px 8px; }
.bf-example-query { display: flex; gap: 10px; align-items: center; background: #111015; border: 1px solid #38313c; border-radius: 10px; padding: 12px 14px; color: #d8d2dd; font-size: 13px; }
.bf-example-query > :first-child { font-size: 22px; line-height: 1; color: #aaa0b0; }
.bf-example-query-type { margin-left: auto; color: #8c8295; font-size: 10px; }
.bf-catalog-example { margin-top: 17px; background: #ece6e0; color: #28242a; border-radius: 14px; overflow: hidden; display: grid; grid-template-columns: 44% 56%; }
.bf-product-image { background: #e4dfd9; min-height: 215px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; }
.bf-product-image img { display: block; width: 150px; height: 120px; object-fit: contain; image-rendering: auto; filter: drop-shadow(0 12px 10px #8e858733); }
.bf-product-image span { font-size: 9px; color: #777078; }
.bf-product-details { padding: 25px 18px 20px; }
.bf-detail-label { font-size: 10px; color: #84646e; font-weight: 600; letter-spacing: .06em; }
.bf-product-details h2 { font-size: 22px; line-height: 1.2; letter-spacing: -.045em; font-weight: 600; margin: 10px 0 9px; }
.bf-product-details > p:not(.bf-detail-label) { font-size: 11px; color: #756773; }
.bf-product-details strong { font-weight: 600; color: #51414b; }
.bf-product-id { display: flex; justify-content: space-between; border-top: 1px solid #d3c9cd; margin-top: 23px; padding-top: 10px; font-size: 10px; color: #7f717b; }
.bf-catalog-source { display: inline-block; margin-top: 14px; font-size: 10px; text-decoration: underline; text-underline-offset: 3px; color: #79505f; }
.bf-example-next { padding: 19px 0 0; }
.bf-example-next > span { display: block; font-size: 11px; color: #aaa1b0; margin-bottom: 10px; }
.bf-example-links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bf-example-links a { border: 1px solid #3b333f; padding: 11px 12px; border-radius: 9px; font-size: 11px; color: #e6dce8; background: #232029; transition: background .2s; }
.bf-example-links a:hover { background: #332632; }
.bf-example-disclaimer { font-size: 9px; line-height: 1.6; color: #8e8398; margin-top: 15px; }
.bf-starting-points { max-width: 1240px; margin: 0 auto; padding: 26px 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #302a33; border-bottom: 1px solid #302a33; gap: 30px; }
.bf-starting-points > a { display: flex; gap: 15px; align-items: center; padding: 6px 0; }
.bf-starting-points > a > span:last-child { margin-left: auto; color: #bc8b9a; }
.bf-start-icon { height: 38px; width: 38px; min-width: 38px; background: #252027; color: #d59aae; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 11px; }
.bf-starting-points h2 { font-size: 13px; font-weight: 600; margin: 0 0 6px; color: #e6e0e7; }
.bf-starting-points p { font-size: 11px; line-height: 1.7; color: #958c9e; margin: 0; max-width: 240px; }
.bf-starting-points > a:hover h2 { color: #ed9ab6; }
.bf-recorded-stats { max-width: 1240px; margin: 0 auto; padding: 48px 32px; text-align: center; }
.bf-recorded-stats > p { color: #9e96a7; font-size: 12px; }
.bf-recorded-stats > div { display: flex; justify-content: center; gap: 70px; margin-top: 22px; }
.bf-recorded-stats > div > div { display: flex; flex-direction: column; gap: 8px; }
.bf-recorded-stats strong { font-size: 27px; font-weight: 500; letter-spacing: -.04em; }
.bf-recorded-stats span { font-size: 11px; color: #aaa0b1; }
.bf-recorded-stats small { display: block; font-size: 10px; color: #817688; margin-top: 22px; }
.bf-how-it-works { max-width: 1240px; margin: 0 auto; padding: 80px 32px; }
.bf-how-it-works > h2 { font-size: clamp(28px, 3vw, 39px); font-weight: 500; letter-spacing: -.045em; margin: 0; }
.bf-how-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 45px; margin-top: 44px; }
.bf-how-grid article > span { display: inline-block; padding-bottom: 13px; font-size: 12px; color: #ca8ca2; border-bottom: 1px solid #735263; min-width: 35px; }
.bf-how-grid h3 { font-size: 17px; font-weight: 500; letter-spacing: -.02em; margin: 20px 0 13px; }
.bf-how-grid p { font-size: 13px; line-height: 1.9; color: #a49ba9; margin: 0; }
.bf-final-cta { max-width: 1176px; margin: 25px auto 80px; padding: 60px 32px; text-align: center; border: 1px solid #42303a; border-radius: 22px; background: #21191e; }
.bf-final-cta h2 { font-size: clamp(30px, 3.5vw, 44px); font-weight: 500; letter-spacing: -.05em; }
.bf-final-cta > p:not(.bf-eyebrow) { color: #b6a7b4; font-size: 14px; line-height: 1.8; max-width: 480px; margin: 20px auto 28px; }
.bf-final-cta .bf-eyebrow { margin-bottom: 14px; }
.bf-plans { max-width: 1240px; margin: 0 auto; padding: 65px 32px; }
.bf-plans > h2 { font-size: clamp(28px,3vw,39px); font-weight: 500; letter-spacing: -.045em; }
.bf-plan-intro { color: #a69cae; font-size: 14px; line-height: 1.8; max-width: 600px; margin-top: 17px; }
.bf-plan-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 35px; }
.bf-plan-grid article { display: flex; flex-direction: column; border: 1px solid #3b303c; background: #1a171e; border-radius: 17px; padding: 28px; }
.bf-plan-grid h3 { font-size: 20px; font-weight: 500; letter-spacing: -.02em; }
.bf-plan-price { margin: 25px 0; display: flex; flex-direction: column; gap: 7px; }
.bf-plan-price strong { font-size: 42px; letter-spacing: -.055em; font-weight: 500; }
.bf-plan-price span { color: #c49aac; font-size: 12px; }
.bf-plan-grid article > p:not(.bf-plan-price) { font-size: 14px; line-height: 1.8; color: #c4b8c8; }
.bf-plan-grid small { color: #8e8399; font-size: 11px; line-height: 1.8; margin: 17px 0 25px; }
.bf-plan-grid a { margin-top: auto; }
.bf-service-directory { max-width:1240px; margin:0 auto; padding:70px 32px; scroll-margin-top:90px; }
.bf-service-directory > h2, .bf-faq > h2 { font-size:clamp(28px,3vw,39px); font-weight:500; letter-spacing:-.045em; }
.bf-service-intro { color:#a69dac; font-size:14px; line-height:1.85; max-width:620px; margin-top:18px; }
.bf-directory-controls { display:flex; flex-wrap:wrap; gap:18px; margin-top:30px; align-items:center; }
.bf-directory-categories { display:flex; gap:7px; flex-wrap:wrap; }
.bf-directory-categories button { border:1px solid #39323f; border-radius:30px; padding:9px 12px; color:#a89caf; font-size:11px; }
.bf-directory-categories button[aria-pressed="true"] { background:#382632; color:#efb5c6; border-color:#765062; }
.bf-directory-controls > input { min-height:40px; border:1px solid #413547; border-radius:9px; font-size:12px; color:#e1d9e6; background:#1a171e; padding:9px 12px; min-width:230px; margin-left:auto; }
.bf-directory-count { color:#877b91; font-size:11px; margin-top:22px; }
.bf-service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:17px; }
.bf-service-card { display:flex; flex-direction:column; border:1px solid #352e3c; background:#19161d; border-radius:14px; padding:23px; transition:background .2s,border-color .2s; }
.bf-service-card:hover { border-color:#80576c; background:#211a24; }
.bf-service-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.bf-service-icon { background:#30212c; color:#db94ad; border-radius:10px; padding:9px; }
.bf-service-icon svg { width:18px; height:18px; }
.bf-service-price { font-size:10px; color:#bb9ba9; }
.bf-service-card h3 { font-size:17px; letter-spacing:-.025em; font-weight:500; margin-top:19px; }
.bf-service-card p { font-size:12px; line-height:1.9; color:#a398ae; margin:10px 0 20px; }
.bf-service-open { margin-top:auto; font-size:11px; color:#d9a3b7; }
.bf-show-all { margin-top:25px; }
.bf-no-services { margin-top:30px; color:#b7a8bd; font-size:14px; }
.bf-faq { max-width:960px; margin:0 auto; padding:60px 32px 80px; scroll-margin-top:90px; }
.bf-faq > div { margin-top:30px; }
.bf-faq details { border-bottom:1px solid #352c3a; padding:20px 0; }
.bf-faq summary { cursor:pointer; color:#ded2e3; font-size:14px; font-weight:500; padding-right:20px; }
.bf-faq details p { color:#a99aaf; font-size:13px; line-height:1.9; padding-top:15px; max-width:740px; }
.bf-signin { max-width:1160px; min-height:calc(100dvh - 180px); display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; margin:auto; padding:65px 32px; }
.bf-signin-story h2 { font-size:clamp(32px,3.4vw,47px); font-weight:500; line-height:1.2; letter-spacing:-.045em; }
.bf-signin-story > p:not(.bf-eyebrow) { margin-top:24px; max-width:400px; color:#b0a1b8; font-size:15px; line-height:1.9; }
.bf-signin-story ul { display:grid; gap:15px; margin-top:30px; padding-left:18px; list-style:disc; color:#ba9faf; font-size:13px; }
.bf-signin-card { background:#1b171e; border:1px solid #443146; border-radius:20px; padding:38px; }
.bf-signin-card > img { margin-bottom:25px; }
.bf-signin-card h1 { font-size:27px; font-weight:500; letter-spacing:-.04em; }
.bf-signin-card > p { margin-top:17px; color:#b5a4bb; font-size:13px; line-height:1.8; }
.bf-discord-button { width:100%; min-height:49px; margin-top:27px; padding:10px; background:#6263d9; color:#fff; font-size:14px; font-weight:600; border-radius:10px; }
.bf-discord-button:hover { background:#7777eb; }
.bf-discord-button:disabled { opacity:.65; cursor:wait; }
.bf-signin-card .bf-signin-policies { font-size:11px; color:#98849f; }
.bf-signin-policies a { color:#ddadca; text-decoration:underline; text-underline-offset:3px; }
.bf-signin-card .bf-signin-note { font-size:10px; color:#8a7793; margin-top:25px; }
.bf-signin-card .bf-signin-error { color:#f3a8b4; border:1px solid #80394c; border-radius:8px; padding:10px; }
.bf-signin-loading { min-height:55vh; display:grid; place-items:center; color:#b6a3c0; }
@media (max-width: 1000px) {
  .bf-hero-inner { gap: 35px; }
  .bf-hero-copy h1 { font-size: 51px; }
  .bf-example { padding: 18px; }
  .bf-catalog-example { grid-template-columns: 40% 60%; }
  .bf-product-image img { width: 125px; height: 100px; }
  .bf-starting-points { gap: 20px; }
}
@media (max-width: 760px) {
  .bf-home-hero { padding: 30px 22px 0; }
  .bf-hero-inner { grid-template-columns: 1fr; padding: 20px 0 38px; gap: 36px; }
  .bf-hero-copy h1 { font-size: clamp(40px, 9vw, 59px); line-height: 1.08; }
  .bf-eyebrow { font-size: 11px; margin-bottom: 18px; }
  .bf-hero-description { font-size: 15px; line-height: 1.8; margin-top: 21px; }
  .bf-hero-actions { gap: 10px; margin-top: 25px; }
  .bf-button { min-height: 48px; padding: 0 18px; font-size: 12px; }
  .bf-hero-note { font-size: 11px; }
  .bf-example { transform: none; max-width: 480px; width: 100%; margin: auto; border-radius: 17px; padding: 17px; }
  .bf-example-heading { font-size: 13px; margin-bottom: 16px; }
  .bf-example-label { font-size: 9px; }
  .bf-product-image { min-height: 190px; }
  .bf-product-details { padding: 20px 14px 16px; }
  .bf-product-details h2 { font-size: 20px; }
  .bf-example-links a { font-size: 10px; padding: 10px; }
  .bf-starting-points { grid-template-columns: 1fr; gap: 0; padding: 12px 0; }
  .bf-starting-points > a { padding: 15px 0; }
  .bf-starting-points > a + a { border-top: 1px solid #28232d; }
  .bf-starting-points h2 { font-size: 14px; }
  .bf-starting-points p { font-size: 12px; max-width: 270px; }
  .bf-recorded-stats { padding: 32px 20px; }
  .bf-recorded-stats > div { gap: 26px; }
  .bf-recorded-stats strong { font-size: 23px; }
  .bf-recorded-stats span { font-size: 10px; }
  .bf-how-it-works { padding: 50px 22px; }
  .bf-how-grid { grid-template-columns: 1fr; gap: 28px; margin-top: 30px; }
  .bf-how-grid h3 { margin-top: 13px; }
  .bf-final-cta { margin: 15px 20px 50px; padding: 40px 22px; }
  .bf-plans { padding: 45px 22px; }
  .bf-plan-grid { grid-template-columns: 1fr; }
  .bf-service-directory { padding:45px 22px; }
  .bf-directory-controls > input { width:100%; margin:0; }
  .bf-service-grid { grid-template-columns:1fr; }
  .bf-service-card { padding:22px; }
  .bf-faq { padding:45px 22px; }
  .bf-signin { grid-template-columns:1fr; gap:35px; padding:40px 22px; }
  .bf-signin-story h2 { font-size:34px; }
  .bf-signin-story ul { display:none; }
  .bf-signin-story > p:not(.bf-eyebrow) { font-size:13px; margin-top:18px; }
  .bf-signin-card { padding:27px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
