/* Aryavrut brand tokens (https://www.aryavrut.com/brand). Dark is the brand default; light mirrors the
   site's alternating cream sections. Values are "H S% L%" so Tailwind can apply alpha. */
:root, .dark {
  --background: 220 16% 12%;
  --foreground: 40 14% 88%;
  --card: 220 15% 15%;
  --card-foreground: 40 14% 88%;
  --popover: 220 15% 17%;
  --primary: 38 92% 55%;            /* amber */
  --primary-foreground: 220 16% 10%;
  --secondary: 44 80% 45%;          /* gold */
  --secondary-foreground: 220 16% 10%;
  --accent: 38 92% 55%;             /* highlight text, active nav, key numbers */
  --muted: 220 12% 19%;
  --muted-foreground: 40 10% 72%;
  --border: 40 10% 26%;
  --ring: 38 92% 55%;
  --sidebar: 220 18% 9%;
  --success: 152 55% 48%;
  --warning: 38 92% 55%;
  --danger: 0 70% 58%;
  --info: 199 75% 60%;
  --neutral: 40 9% 66%;
  --radius: 0.75rem;
  color-scheme: dark;
}
.light {
  --background: 40 26% 93%;
  --foreground: 28 12% 20%;
  --card: 40 24% 96%;
  --card-foreground: 28 12% 20%;
  --popover: 40 24% 97%;
  --primary: 30 14% 10%;            /* ink */
  --primary-foreground: 40 26% 96%;
  --secondary: 30 90% 40%;
  --secondary-foreground: 40 26% 96%;
  --accent: 30 95% 40%;             /* accent amber */
  --muted: 38 18% 87%;
  --muted-foreground: 28 10% 34%;
  --border: 34 14% 80%;
  --ring: 30 95% 40%;
  --sidebar: 30 14% 10%;
  --success: 152 60% 30%;
  --warning: 30 95% 40%;
  --danger: 0 70% 45%;
  --info: 205 80% 38%;
  --neutral: 28 8% 42%;
  color-scheme: light;
}

html { font-feature-settings: "cv02", "cv03", "cv04", "cv11", "ss01"; -webkit-font-smoothing: antialiased; }
body { background: hsl(var(--background)); color: hsl(var(--foreground)); }
[x-cloak] { display: none !important; }

.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: hsl(var(--accent)); }
.h-page { font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.1; }
.h-card { font-size: 16px; font-weight: 700; letter-spacing: -0.01em; }
.lede { color: hsl(var(--muted-foreground)); }

.card { background: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border));
        border-radius: var(--radius); box-shadow: 0 1px 2px rgb(0 0 0 / .04), 0 4px 16px -8px rgb(0 0 0 / .10); }
.light .card, .light .tile { background: hsl(0 0% 100% / .72); }
.card-pad { padding: 1.25rem; }
.tile { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); padding: 1rem 1.25rem;
        box-shadow: 0 1px 2px rgb(0 0 0 / .04), 0 4px 16px -8px rgb(0 0 0 / .10); border-top: 3px solid hsl(var(--accent) / .55); }
.tile-num { font-size: 28px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; height: 36px; padding: 0 1rem;
       border-radius: 9999px; font-size: 14px; font-weight: 600; transition: background-color .2s, color .2s, border-color .2s;
       white-space: nowrap; border: 1px solid transparent; cursor: pointer; }
.btn-lg { height: 44px; padding: 0 1.25rem; }
.btn-sm { height: 30px; padding: 0 .75rem; font-size: 13px; }
.btn-primary { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-primary:hover { filter: brightness(1.06); }
.btn-secondary { background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground)); }
.btn-outline { border-color: hsl(var(--border)); color: hsl(var(--foreground)); background: transparent; }
.btn-outline:hover { border-color: hsl(var(--accent)); color: hsl(var(--accent)); }
.btn-ghost { color: hsl(var(--muted-foreground)); background: transparent; }
.btn-ghost:hover { color: hsl(var(--foreground)); background: hsl(var(--muted)); }
.btn-danger { border-color: hsl(var(--danger) / .5); color: hsl(var(--danger)); background: transparent; }
.btn-danger:hover { background: hsl(var(--danger) / .12); }

.input, .select, .textarea { width: 100%; background: hsl(var(--background)); color: hsl(var(--foreground));
       border: 1px solid hsl(var(--border)); border-radius: calc(var(--radius) - 2px); padding: .5rem .75rem; font-size: 14px; }
.input:focus, .select:focus, .textarea:focus { outline: 2px solid hsl(var(--ring) / .5); outline-offset: 0; border-color: hsl(var(--ring)); }

.badge { display: inline-flex; align-items: center; gap: .25rem; border-radius: 9999px; padding: .1rem .55rem;
         font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.badge-success { background: hsl(var(--success) / .15); color: hsl(var(--success)); }
.badge-warning { background: hsl(var(--warning) / .16); color: hsl(var(--warning)); }
.badge-danger  { background: hsl(var(--danger) / .15); color: hsl(var(--danger)); }
.badge-info    { background: hsl(var(--info) / .15); color: hsl(var(--info)); }
.badge-accent  { background: hsl(var(--accent) / .16); color: hsl(var(--accent)); }
.badge-neutral { background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); }

.table { width: 100%; font-size: 14px; }
.table thead th { text-align: left; font-weight: 600; font-size: 12px; letter-spacing: .06em; text-transform: uppercase;
                  color: hsl(var(--muted-foreground)); padding: .65rem .85rem; background: hsl(var(--muted) / .5); }
.table tbody td { padding: .6rem .85rem; border-top: 1px solid hsl(var(--border)); vertical-align: top; }
.table tbody tr:hover { background: hsl(var(--muted) / .45); }

.link { color: hsl(var(--accent)); }
.link:hover { text-decoration: underline; }
.bar { height: 8px; border-radius: 9999px; background: hsl(var(--accent)); }
.bar-track { height: 8px; border-radius: 9999px; background: hsl(var(--muted)); overflow: hidden; }

.nav-link { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .5rem .75rem;
            border-radius: .6rem; font-size: 14px; font-weight: 500; color: hsl(40 9% 70%); }
.nav-link:hover { background: hsl(0 0% 100% / .06); color: hsl(40 14% 92%); }
.nav-link.active { background: hsl(38 92% 55% / .14); color: hsl(38 92% 60%); }
.nav-count { font-size: 11px; font-weight: 700; border-radius: 9999px; padding: 0 .45rem; background: hsl(38 92% 55%); color: hsl(220 16% 10%); }
.nav-group { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: hsl(40 9% 50%);
             padding: .9rem .75rem .35rem; }

.step { position: relative; }
.step-dot { width: 28px; height: 28px; border-radius: 9999px; display: grid; place-items: center; font-size: 13px; font-weight: 700;
            background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); border: 1px solid hsl(var(--border)); }
.step-dot.done { background: hsl(var(--success) / .18); color: hsl(var(--success)); border-color: hsl(var(--success) / .4); }
.step-dot.now { background: hsl(var(--accent)); color: hsl(var(--primary-foreground)); border-color: transparent;
                box-shadow: 0 0 0 4px hsl(var(--accent) / .18); }
.light .step-dot.now { color: hsl(40 26% 96%); }
.human-gate { border: 1px dashed hsl(var(--accent) / .6); background: hsl(var(--accent) / .06); }

@media print { aside, .no-print { display: none !important; } }

.tile-num { font-variant-numeric: tabular-nums; }
.table td, .table th { white-space: nowrap; }
.funnel-row { display: grid; grid-template-columns: 7.5rem 1fr 3.5rem; align-items: center; gap: .75rem; font-size: 13px; }
.funnel-bar { height: 22px; border-radius: 6px; background: linear-gradient(90deg, hsl(var(--accent)), hsl(var(--secondary))); min-width: 4px; }

mark.bracket { background: hsl(var(--danger) / .18); color: hsl(var(--danger)); border-radius: 4px; padding: 0 2px; }
.rail-item { display: flex; align-items: center; gap: .6rem; padding: .55rem .7rem; border-radius: .6rem; font-size: 14px; }
.rail-item:hover { background: hsl(var(--muted)); }
.rail-item.active { background: hsl(var(--accent) / .12); color: hsl(var(--accent)); font-weight: 600; }
.phase { flex: 1; text-align: center; font-size: 12px; font-weight: 600; padding: .45rem; border-radius: 9999px;
         background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); }
.phase.done { background: hsl(var(--success) / .15); color: hsl(var(--success)); }
.phase.next { background: hsl(var(--accent) / .16); color: hsl(var(--accent)); }
.email-preview { background: hsl(var(--background)); border: 1px solid hsl(var(--border)); border-radius: var(--radius);
                 padding: 1rem; font-size: 14px; white-space: pre-wrap; line-height: 1.55; }

/* Readable text blocks (chat answers, notes): Tailwind's reset removes list markers and spacing. */
.prose-lite { line-height: 1.6; }
.prose-lite > * + * { margin-top: .55rem; }
.prose-lite ul { list-style: disc; padding-left: 1.2rem; }
.prose-lite ol { list-style: decimal; padding-left: 1.35rem; }
.prose-lite li { margin: .2rem 0; padding-left: .15rem; }
.prose-lite li::marker { color: hsl(var(--accent)); }
.prose-lite b, .prose-lite strong { font-weight: 700; }
.prose-lite code { font-size: .86em; background: hsl(var(--muted)); padding: .05rem .35rem; border-radius: .35rem; }

/* Keyboard focus is always visible. */
a:focus-visible, button:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid hsl(var(--ring)); outline-offset: 2px; border-radius: .5rem; }

/* Chat */
.chat-avatar { width: 30px; height: 30px; border-radius: 9999px; display: grid; place-items: center; flex-shrink: 0;
               background: hsl(var(--accent) / .16); color: hsl(var(--accent)); }
.chat-user { background: hsl(var(--accent) / .13); border: 1px solid hsl(var(--accent) / .28);
             border-radius: 1.1rem 1.1rem .3rem 1.1rem; }
.chat-dots span { display: inline-block; width: 6px; height: 6px; margin-right: 3px; border-radius: 9999px;
                  background: hsl(var(--muted-foreground)); animation: chat-dot 1.2s infinite ease-in-out; }
.chat-dots span:nth-child(2) { animation-delay: .15s; } .chat-dots span:nth-child(3) { animation-delay: .3s; }
@keyframes chat-dot { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .chat-dots span { animation: none; opacity: .6; } }
.chip { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid hsl(var(--border)); border-radius: 9999px;
        padding: .3rem .75rem; font-size: 13px; color: hsl(var(--foreground)); background: hsl(var(--card)); text-align: left; }
.chip:hover { border-color: hsl(var(--accent)); color: hsl(var(--accent)); }

/* "Needs you" rows on the home page */
.need-row { display: flex; align-items: center; gap: .75rem; padding: .6rem .75rem; border-radius: .7rem; }
.need-row:hover { background: hsl(var(--muted) / .6); }
.need-num { min-width: 2.1rem; height: 2.1rem; padding: 0 .4rem; border-radius: .6rem; display: grid; place-items: center;
            font-weight: 800; font-variant-numeric: tabular-nums; font-size: 15px; }
.btn:disabled, .btn[disabled] { opacity: .45; cursor: not-allowed; filter: none; }