:root {
    --v: #060607;
    --c: #121214;
    --g: #f59e0b;
    --db: #3b82f6;
    --b: #27272a;
    --z8: #27272a;
    --z9: #18181b;
    --z7: #3f3f46;
}

/* Global & Reset */
body { 
    margin: 0;
    font-family: 'Inter', sans-serif; 
    background-color: var(--v); 
    color: #a1a1aa; 
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
}
.bd-s::selection { background: rgba(245, 158, 11, 0.3); }

/* Navigation */
.nv {
    position: fixed;
    width: 100%;
    z-index: 50;
    border-bottom: 1px solid var(--z8);
    background: rgba(6, 6, 7, 0.8);
    backdrop-filter: blur(12px);
}
.cn-nv {
    max-width: 80rem;
    margin: 0 auto;
    padding: 0 1.5rem;
    height: 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Brand & Icon */
.fl-c { display: flex; align-items: center; gap: 0.75rem; }
.ic-b { width: 1.5rem; height: 1.5rem; display: flex; flex-direction: column; gap: 0.125rem; }
.ic-1 { height: 0.375rem; width: 100%; background: var(--g); }
.ic-2 { height: 0.375rem; width: 100%; background: rgba(245, 158, 11, 0.6); }
.ic-3 { height: 0.375rem; width: 100%; background: rgba(245, 158, 11, 0.3); }

.bn { 
    font-family: 'JetBrains Mono', monospace; 
    font-weight: 700; 
    color: #fff; 
    letter-spacing: -0.05em; 
    text-transform: uppercase; 
    font-size: 1.25rem; 
    text-decoration: none;
}

/* Nav Links */
.nv-l { display: none; gap: 2rem; font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; }
@media (min-width: 768px) { .nv-l { display: flex; } }

.lk { color: inherit; text-decoration: none; transition: color 0.2s; }
.lk:hover { color: var(--g); }

/* Footer */
.ft { padding: 3rem 0; text-align: center; border-top: 1px solid var(--z9); }
.ft-t { 
    font-family: 'JetBrains Mono', monospace; 
    font-size: 10px; 
    text-transform: uppercase; 
    letter-spacing: 0.1em; 
    color: var(--z7); 
}

/* --- INDEX PAGE STYLES --- */
:root {
    --z95: #09090b;
    --z5: #71717a;
    --em: #10b981;
}

/* Layout Utilities */
.rel { position: relative; }
.z10 { z-index: 10; }
.cn-m { max-width: 80rem; margin: 0 auto; }
.sc-p { padding-top: 8rem; padding-bottom: 8rem; padding-left: 1.5rem; padding-right: 1.5rem; }
.fl-w { display: flex; flex-wrap: wrap; }
.gr-2, .gr-3, .gr-4 { display: grid; gap: 1rem; }
@media (min-width: 768px) {
    .gr-2 { grid-template-columns: repeat(2, 1fr); }
    .gr-3 { grid-template-columns: repeat(3, 1fr); }
    .gr-4 { grid-template-columns: repeat(4, 1fr); }
}
.gap1 { gap: 0.25rem; } .gap3 { gap: 0.75rem; } .gap4 { gap: 1rem; } .gap6 { gap: 1.5rem; } .gap8 { gap: 2rem; } .gap12 { gap: 3rem; } .gap16 { gap: 4rem; }
.ai-c { align-items: center; }
.tx-ct { text-align: center; }
.mb1 { margin-bottom: 0.25rem; } .mb2 { margin-bottom: 0.5rem; } .mb3 { margin-bottom: 0.75rem; } .mb4 { margin-bottom: 1rem; } .mb6 { margin-bottom: 1.5rem; } .mb8 { margin-bottom: 2rem; } .mb10 { margin-bottom: 2.5rem; } .mb16 { margin-bottom: 4rem; } .mb20 { margin-bottom: 5rem; }
.w-f { width: 100%; } .p2 { padding: 0.5rem; } .p6 { padding: 1.5rem; } .p8 { padding: 2rem; } .p10 { padding: 2.5rem; } .py2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .py24 { padding-top: 6rem; padding-bottom: 6rem; }
.px6 { padding-left: 1.5rem; padding-right: 1.5rem; }

/* Header Component */
.hd { position: relative; pt: 10rem; pb: 8rem; px: 1.5rem; border-bottom: 1px solid var(--z9); overflow: hidden; padding-top: 10rem; padding-bottom: 8rem; }
.hd-bg { position: absolute; inset: 0; opacity: 0.1; pointer-events: none; background-image: radial-gradient(var(--b) 1px, transparent 1px); background-size: 40px 40px; }
.st-b { display: inline-block; padding: 0.25rem 0.75rem; margin-bottom: 1.5rem; border: 1px solid rgba(245, 158, 11, 0.3); background: rgba(245, 158, 11, 0.05); color: var(--g); font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; }

/* Typography */
.h1 { font-size: 3rem; font-weight: 700; color: #fff; letter-spacing: -0.05em; margin-bottom: 1.5rem; max-width: 56rem; line-height: 1; }
@media (min-width: 768px) { .h1 { font-size: 4.5rem; } }
.h2 { font-size: 1.875rem; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: -0.05em; }
.h3 { font-size: 2.25rem; font-weight: 700; color: #fff; letter-spacing: -0.05em; }
.h4 { color: #fff; font-weight: 700; margin-bottom: 1rem; text-transform: uppercase; }
.p-lg { font-size: 1.25rem; color: #a1a1aa; max-width: 42rem; margin-bottom: 2.5rem; line-height: 1.625; font-weight: 300; }
.p-md { color: #a1a1aa; line-height: 1.625; }
.p-sm { font-size: 0.875rem; line-height: 1.625; }
.p-xs { font-size: 11px; color: var(--z5); line-height: 1.625; }
.tx-g { color: var(--g); } .tx-d { color: var(--db); } .tx-w { color: #fff; } .tx-w6 { color: #e4e4e7; font-weight: 600; } .tx-w2 { color: #e4e4e7; } .tx-z4 { color: #a1a1aa; } .tx-em { color: var(--em); }
.ita { font-style: italic; }
.lh-r { line-height: 1.625; }

/* UI Elements */
.lp { background: var(--c); border: 1px solid var(--b); }
.bl-z7 { border-left: 4px solid var(--z7); }
.bl-z5 { border-left: 4px solid var(--z5); }
.bl-g { border-left: 4px solid var(--g); }
.lb-d { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; font-bold: 700; color: var(--db); text-transform: uppercase; letter-spacing: 0.3em; }
.lb-g { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; font-bold: 700; color: var(--g); text-transform: uppercase; letter-spacing: 0.3em; }
.lb-z { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; color: var(--z5); display: block; }
.lb-z-xs { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: #52525b; text-transform: uppercase; }
.lb-g-xs { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--g); text-transform: uppercase; font-weight: 700; }
.lb-z-ls { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--z5); text-transform: uppercase; letter-spacing: 0.1em; }
.lb-g-ls { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--g); text-transform: uppercase; letter-spacing: 0.1em; }
.ls-u { list-style: none; padding: 0; margin: 0; font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--z5); text-transform: uppercase; display: flex; flex-direction: column; gap: 1rem; }
.ls-p { list-style: none; padding: 0; font-size: 10px; color: var(--z5); text-transform: uppercase; font-weight: 700; display: flex; flex-direction: column; gap: 0.5rem; }
.ls-p-act { list-style: none; padding: 0; font-size: 10px; color: #a1a1aa; text-transform: uppercase; font-weight: 700; display: flex; flex-direction: column; gap: 0.5rem; }
.dot-d { width: 0.375rem; height: 0.375rem; background: var(--db); }
.bg-k { background: #000; } .bg-z95 { background: rgba(9, 9, 11, 0.5); } .bt-z9 { border-top: 1px solid var(--z9); }
.rd { border-radius: 0.25rem; } .shadow { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); }

/* Buttons */
.btn-p { 
    background: var(--g); 
    color: #000; 
    font-weight: 700; 
    border: none; 
    cursor: pointer; 
    transition: all 0.2s;
    display: flex;       /* Added to ensure centering */
    align-items: center;
    justify-content: center;
}
.btn-p:hover { filter: brightness(1.1); box-shadow: 0 0 15px rgba(245, 158, 11, 0.3); }
.btn-o { background: transparent; border: 1px solid var(--b); color: #fff; cursor: pointer; transition: all 0.2s; }
.btn-o:hover { background: #fff; color: #000; }
.btn-p-lg, .btn-o-lg { padding: 1rem 2rem; font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.2em; }
.ts-xs { font-size: 10px; }

/* --- PRICING PAGE STYLES --- */
.cn-5 { max-width: 64rem; margin: 0 auto; }
.pt20 { padding-top: 5rem; } .pb16 { padding-bottom: 4rem; }
.mx-a { margin-left: auto; margin-right: auto; }
.fl-cl { display: flex; flex-direction: column; }
.mt-a { margin-top: auto; }

/* Pricing Typography */
.lb-d-ls { font-family: 'JetBrains Mono', monospace; font-size: 10px; font-weight: 700; color: var(--db); text-transform: uppercase; letter-spacing: 0.5em; }
.h2-uc { font-size: 2.25rem; font-weight: 700; color: #fff; letter-spacing: -0.05em; text-transform: uppercase; }
@media (min-width: 768px) { .h2-uc { font-size: 3rem; } }
.h4-lg { font-size: 1.25rem; font-weight: 700; color: #fff; text-transform: uppercase; }
.h3-m { font-family: 'JetBrains Mono', monospace; font-size: 1.5rem; color: #fff; }
.tx-z6 { color: #52525b; }
.ts-10 { font-size: 10px; } .ts-11 { font-size: 11px; }
.ts-tight { letter-spacing: -0.025em; }
.ls-widest { letter-spacing: 0.1em; }

/* Pricing Cards */
.pc { background: var(--charcoal); border: 1px solid var(--border); transition: all 0.2s; }
.pc-pop { border-color: var(--g); }
.bg-z94 { background: rgba(24, 24, 27, 0.4); }
.bd-pop { position: absolute; top: -0.75rem; left: 50%; transform: translateX(-50%); background: var(--g); color: #000; font-size: 9px; font-weight: 900; text-transform: uppercase; padding: 0.25rem 1rem; letter-spacing: 0.1em; white-space: nowrap; }

/* Card Components */
.ls-v, .ls-v-w { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1rem; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: -0.025em; margin-bottom: 2.5rem; }
.ls-v { color: #a1a1aa; }
.ls-v-w { color: #fff; }

.l-bl { width: 0.75rem; display: flex; flex-direction: column; gap: 2px; }
.l-bl div { height: 2px; width: 100%; background: var(--border); }
.pc-pop .l-bl div { background: var(--g); opacity: 0.5; }

.btn-z { width: 100%; padding: 0.75rem 0; background: #27272a; color: #fff; border: none; font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; cursor: pointer; transition: background 0.2s; }
.btn-z:hover { background: #3f3f46; }

/* Sections */
.by-z8 { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.bb-z8 { border-bottom: 1px solid var(--border); }
.dot-g { width: 0.375rem; height: 0.375rem; background: var(--g); flex-shrink: 0; }

.pc-pop .btn-p {
    margin-top: auto;      /* Pushes button to bottom */
    width: 100%;
    height: 2.75rem;       /* Fixed height for perfect alignment across all cards */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 0; /* Matches .btn-z exactly */
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* Re-applying hover for the gold button specifically in pricing */
.pc-pop .btn-p:hover {
    filter: brightness(1.1);
    box-shadow: 0 0 15px rgba(245, 158, 11, 0.3);
}

/* Ensure the standard buttons also share the same height for a clean grid line */
.btn-z {
    height: 2.75rem; 
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Restoring Package Borders --- */

/* Default Border for Standard Cards (matches original border-zinc-800) */
.pc { 
    border: 1px solid #27272a; 
}

/* Specific Border for the Popular/Gold Card */
.pc-pop { 
    border: 1px solid var(--g); 
}

/* Optional: If you want the hover effect to highlight the border too */
.pc:hover {
    border-color: #3f3f46;
}

.pc-pop:hover {
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.1);
}

/* --- DASHBOARD EXTENSIONS --- */

/* Ensures grid containers wrap properly on mobile */
@media (max-width: 767px) {
    .gr-2, .gr-3, .gr-4 {
        grid-template-columns: 1fr;
    }
}

/* Custom spacing for dashboard elements */
.mt20 { margin-top: 5rem; }
.pt10 { padding-top: 2.5rem; }

/* Font weight utility */
.font-bold { font-weight: 700; }
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* Flex alignment helper for manual overrides */
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }

/* Card specific hover states */
article.lp:hover {
    border-color: var(--g);
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

/* Scrollable container for tables or lists if needed */
.ov-h { overflow: hidden; }

/* Status color overrides if not previously defined */
.tx-em { color: #10b981; }

/* --- LORE INGESTION SPECIFIC --- */

/* Input & Select Reset */
input[type="text"], select, textarea {
    outline: none;
    font-family: 'Inter', sans-serif;
}

input[type="text"]:focus, select:focus, textarea:focus {
    border-color: var(--g) !important;
}

/* Margin Utility */
.mt4 { margin-top: 1rem; }
.pt4 { padding-top: 1rem; }

/* Ingestion Area Typography override */
textarea.font-mono {
    font-family: 'JetBrains Mono', monospace;
}

/* Compute Cycle Animation Placeholder */
.shredding-active {
    animation: pulse-gold 2s infinite;
}

@keyframes pulse-gold {
    0% { border-color: var(--z8); }
    50% { border-color: var(--g); }
    100% { border-color: var(--z8); }
}

/* Selection opacity for the grid background */
.opacity-50 { opacity: 0.5; }

/* Layout adjustments */
.overflow-hidden { overflow: hidden; }

/* --- ATOMIC FACT EDITOR EXTENSIONS --- */

/* Fact Card specific transitions */
article.lp.bl-z7 {
    transition: all 0.2s ease-in-out;
}

article.lp.bl-z7:hover {
    border-left-color: var(--g);
    background-color: var(--z9);
}

/* Editable Textarea in Cards */
textarea.tx-w2:focus {
    border-color: var(--g) !important;
    background-color: #000 !important;
    outline: none;
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.1);
}

/* Tag Styles leveraging st-b base */
.st-b {
    cursor: default;
    user-select: none;
}

/* Scroll shadow for the main fact list */
.fl-cl {
    max-height: 70vh;
    overflow-y: auto;
    padding-right: 0.5rem;
}

/* Custom Scrollbar for the Fact List (Zinc Style) */
.fl-cl::-webkit-scrollbar {
    width: 4px;
}
.fl-cl::-webkit-scrollbar-track {
    background: var(--v);
}
.fl-cl::-webkit-scrollbar-thumb {
    background: var(--z8);
    border-radius: 10px;
}
.fl-cl::-webkit-scrollbar-thumb:hover {
    background: var(--z7);
}

/* Tag hover for removal/edit */
.lk:hover {
    text-decoration: underline;
}