/* === SELF-CONTAINED PRODUCTION RESET & UTILITY ENGINE (NO EXTERNAL CDN REQUIRED) === */
    *, ::before, ::after {
      box-sizing: border-box;
      border-width: 0;
      border-style: solid;
      border-color: #D9CEB8;
    }
    html {
      line-height: 1.5;
      -webkit-text-size-adjust: 100%;
      tab-size: 4;
      font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums;
    }
    body {
      margin: 0;
      font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums;
      background-color: var(--bg-porcelain, #F8F5EE);
      color: var(--ink-plum, #18131E);
      line-height: 1.68;
      overflow-x: hidden;
    }
    h1, h2, h3, h4, p, pre, table, figure, blockquote, dl, dd {
      margin: 0;
    }
    button, input, optgroup, select, textarea {
      font-family: inherit;
      font-size: 100%;
      font-weight: inherit;
      line-height: inherit;
      color: inherit;
      margin: 0;
      padding: 0;
      background-color: transparent;
    }
    button, [role="button"] {
      cursor: pointer;
    }
    a {
      color: inherit;
      text-decoration: inherit;
    }
    table {
      text-indent: 0;
      border-color: inherit;
      border-collapse: collapse;
    }
    img, svg, video, canvas, audio, iframe, embed, object {
      display: block;
      vertical-align: middle;
      max-width: 100%;
    }
    svg {
      flex-shrink: 0;
    }


    /* Form Control & Grid Child Safety Rules */
    select, input[type="text"], input[type="number"] {
      background-color: #FFFFFF;
      color: #18131E;
      font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif;
      line-height: 1.45;
    }
    select { cursor: pointer; }
    progress {
      appearance: none;
      -webkit-appearance: none;
      width: 100%;
      height: 0.625rem;
      border-radius: 9999px;
      overflow: hidden;
      background-color: #EDE6D8;
    }
    progress::-webkit-progress-bar { background-color: #EDE6D8; border-radius: 9999px; }
    progress::-webkit-progress-value { background-color: #0D636E; border-radius: 9999px; }
    progress::-moz-progress-bar { background-color: #0D636E; border-radius: 9999px; }
    .grid > *, .flex > * { min-width: 0; }
    .line-through { text-decoration: line-through; }
    .text-porcelain-800\/50 { color: rgba(74, 67, 54, 0.5); }
    .hover\:bg-copper-100:hover { background-color: #F5E8D8; }
    .border-peacock-900 { border-color: #052D33; }
    .bg-aubergine-800 { background-color: #2A2035; }


    /* Always-Visible 5-Mode Navigation Dock (Never hidden at any viewport width!) */
    .main-nav-dock {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.625rem;
      background-color: rgba(237, 230, 216, 0.9);
      padding: 0.625rem;
      border-radius: 1rem;
      border: 1.5px solid rgba(181, 123, 69, 0.55);
      width: 100%;
    }
    @media (min-width: 640px) {
      .main-nav-dock {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }
    @media (min-width: 768px) {
      .main-nav-dock {
        grid-template-columns: repeat(5, minmax(0, 1fr));
      }
    }

    /* Custom Dropdown (<select>) Styling - Arrow sits 14px inside right border, never touching edges! */
    select {
      -webkit-appearance: none !important;
      -moz-appearance: none !important;
      appearance: none !important;
      background-color: #FFFFFF !important;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2318131E' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
      background-repeat: no-repeat !important;
      background-position: right 14px center !important;
      background-size: 15px 15px !important;
      padding: 10px 42px 10px 14px !important;
      border-radius: 12px !important;
      border: 1.5px solid #B57B45 !important;
      color: #18131E !important;
      font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif !important;
      line-height: 1.4 !important;
      cursor: pointer !important;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
    }
    select:focus {
      border-color: #0D636E !important;
      box-shadow: 0 0 0 3px rgba(13, 99, 110, 0.15) !important;
    }

    /* Display & Visibility */
    .hidden { display: none; }
    .block { display: block; }
    .inline-block { display: inline-block; }
    .flex { display: flex; }
    .inline-flex { display: inline-flex; }
    .grid { display: grid; }

    /* Positioning */
    .relative { position: relative; }
    .absolute { position: absolute; }
    .fixed { position: fixed; }
    .inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
    .bottom-0 { bottom: 0; }
    .bottom-20 { bottom: 5rem; }
    .left-0 { left: 0; }
    .left-3 { left: 0.75rem; }
    .left-4 { left: 1rem; }
    .right-0 { right: 0; }
    .right-2 { right: 0.5rem; }
    .right-2\.5 { right: 0.625rem; }
    .right-4 { right: 1rem; }
    .top-2\.5 { top: 0.625rem; }
    .top-3 { top: 0.75rem; }
    .z-50 { z-index: 50; }

    /* Flexbox & Grid */
    .flex-1 { flex: 1 1 0%; }
    .flex-col { flex-direction: column; }
    .flex-wrap { flex-wrap: wrap; }
    .shrink-0 { flex-shrink: 0; }
    .min-w-0 { min-width: 0px; }
    .min-h-screen { min-height: 100vh; }
    .items-start { align-items: flex-start; }
    .items-end { align-items: flex-end; }
    .items-center { align-items: center; }
    .items-baseline { align-items: baseline; }
    .items-stretch { align-items: stretch; }
    .justify-center { justify-content: center; }
    .justify-between { justify-content: space-between; }
    .self-start { align-self: flex-start; }
    .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .col-span-full { grid-column: 1 / -1; }

    /* Gaps & Space-Y */
    .gap-0\.5 { gap: 0.125rem; }
    .gap-1 { gap: 0.25rem; }
    .gap-1\.5 { gap: 0.375rem; }
    .gap-2 { gap: 0.5rem; }
    .gap-2\.5 { gap: 0.625rem; }
    .gap-3 { gap: 0.75rem; }
    .gap-3\.5 { gap: 0.875rem; }
    .gap-4 { gap: 1rem; }
    .gap-5 { gap: 1.25rem; }
    .gap-6 { gap: 1.5rem; }

    .space-y-0\.5 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.125rem; }
    .space-y-1 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; }
    .space-y-1\.5 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.375rem; }
    .space-y-2 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.5rem; }
    .space-y-2\.5 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.625rem; }
    .space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
    .space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
    .space-y-5 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.25rem; }
    .space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
    .space-y-8 > :not([hidden]) ~ :not([hidden]) { margin-top: 2rem; }
    .space-y-10 > :not([hidden]) ~ :not([hidden]) { margin-top: 2.5rem; }

    .divide-y > :not([hidden]) ~ :not([hidden]) { border-top-width: 1px; }
    .divide-porcelain-200 > :not([hidden]) ~ :not([hidden]) { border-color: #EDE6D8; }

    /* Sizing (Width & Height) */
    .w-2 { width: 0.5rem; }
    .w-3\.5 { width: 0.875rem; }
    .w-4 { width: 1rem; }
    .w-5 { width: 1.25rem; }
    .w-6 { width: 1.5rem; }
    .w-9 { width: 2.25rem; }
    .w-10 { width: 2.5rem; }
    .w-12 { width: 3rem; }
    .w-full { width: 100%; }
    .max-w-lg { max-width: 32rem; }
    .max-w-2xl { max-width: 42rem; }
    .max-w-\[260px\] { max-width: 260px; }

    .h-2 { height: 0.5rem; }
    .h-2\.5 { height: 0.625rem; }
    .h-3\.5 { height: 0.875rem; }
    .h-4 { height: 1rem; }
    .h-5 { height: 1.25rem; }
    .h-6 { height: 1.5rem; }
    .h-9 { height: 2.25rem; }
    .h-10 { height: 2.5rem; }
    .h-12 { height: 3rem; }
    .h-full { height: 100%; }
    .max-h-80 { max-height: 20rem; }
    .max-h-96 { max-height: 24rem; }
    .max-h-\[85vh\] { max-height: 85vh; }

    /* Padding & Margin */
    .p-0\.5 { padding: 0.125rem; }
    .p-1 { padding: 0.25rem; }
    .p-2 { padding: 0.5rem; }
    .p-2\.5 { padding: 0.625rem; }
    .p-3 { padding: 0.75rem; }
    .p-3\.5 { padding: 0.875rem; }
    .p-4 { padding: 1rem; }
    .p-5 { padding: 1.25rem; }
    .p-6 { padding: 1.5rem; }
    .p-8 { padding: 2rem; }

    .px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
    .px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
    .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
    .px-2\.5 { padding-left: 0.625rem; padding-right: 0.625rem; }
    .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
    .px-3\.5 { padding-left: 0.875rem; padding-right: 0.875rem; }
    .px-4 { padding-left: 1rem; padding-right: 1rem; }
    .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }

    .py-0\.2 { padding-top: 0.05rem; padding-bottom: 0.05rem; }
    .py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
    .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
    .py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
    .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
    .py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
    .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
    .py-3\.5 { padding-top: 0.875rem; padding-bottom: 0.875rem; }
    .py-4 { padding-top: 1rem; padding-bottom: 1rem; }
    .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
    .py-8 { padding-top: 2rem; padding-bottom: 2rem; }
    .py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }

    .pt-1 { padding-top: 0.25rem; }
    .pt-2 { padding-top: 0.5rem; }
    .pt-4 { padding-top: 1rem; }
    .pt-6 { padding-top: 1.5rem; }
    .pb-3 { padding-bottom: 0.75rem; }
    .pb-4 { padding-bottom: 1rem; }
    .pb-5 { padding-bottom: 1.25rem; }
    .pb-24 { padding-bottom: 6rem; }
    .pl-9 { padding-left: 2.25rem; }
    .pl-11 { padding-left: 2.75rem; }
    .pr-8 { padding-right: 2rem; }
    .pr-28 { padding-right: 7rem; }

    .mt-0\.5 { margin-top: 0.125rem; }
    .mt-1 { margin-top: 0.25rem; }
    .mt-2 { margin-top: 0.5rem; }
    .mt-12 { margin-top: 3rem; }
    .mb-1 { margin-bottom: 0.25rem; }
    .mb-1\.5 { margin-bottom: 0.375rem; }
    .mb-2 { margin-bottom: 0.5rem; }

    /* Borders & Radius */
    .border { border-width: 1px; }
    .border-2 { border-width: 2px; }
    .border-t { border-top-width: 1px; }
    .border-t-2 { border-top-width: 2px; }
    .border-b { border-bottom-width: 1px; }
    .border-dashed { border-style: dashed; }
    .border-collapse { border-collapse: collapse; }

    .border-aubergine-800 { border-color: #2A2035; }
    .border-aubergine-950 { border-color: #120D18; }
    .border-porcelain-200 { border-color: #EDE6D8; }
    .border-copper-500 { border-color: #B57B45; }
    .border-copper-500\/30 { border-color: rgba(181, 123, 69, 0.3); }
    .border-copper-500\/40 { border-color: rgba(181, 123, 69, 0.4); }
    .border-copper-500\/50 { border-color: rgba(181, 123, 69, 0.5); }
    .border-copper-600\/40 { border-color: rgba(154, 99, 48, 0.4); }
    .border-peacock-600\/50 { border-color: rgba(13, 99, 110, 0.5); }

    .rounded-md { border-radius: 0.375rem; }
    .rounded-lg { border-radius: 0.5rem; }
    .rounded-xl { border-radius: 0.75rem; }
    .rounded-2xl { border-radius: 1rem; }
    .rounded-3xl { border-radius: 1.5rem; }
    .rounded-full { border-radius: 9999px; }

    /* Background Colors */
    .bg-white { background-color: #FFFFFF; }
    .bg-aubergine-900 { background-color: #1D1526; }
    .bg-aubergine-950 { background-color: #120D18; }
    .bg-aubergine-950\/70 { background-color: rgba(18, 13, 24, 0.72); }
    .bg-porcelain-50 { background-color: #FDFCFA; }
    .bg-porcelain-100 { background-color: #F8F5EE; }
    .bg-porcelain-100\/80 { background-color: rgba(248, 245, 238, 0.82); }
    .bg-porcelain-100\/90 { background-color: rgba(248, 245, 238, 0.92); }
    .bg-porcelain-200 { background-color: #EDE6D8; }
    .bg-porcelain-200\/70 { background-color: rgba(237, 230, 216, 0.72); }
    .bg-porcelain-200\/85 { background-color: rgba(237, 230, 216, 0.85); }
    .bg-copper-100 { background-color: #F5E8D8; }
    .bg-copper-500 { background-color: #B57B45; }
    .bg-copper-600 { background-color: #9A6330; }
    .bg-peacock-50 { background-color: #EFF9FA; }
    .bg-peacock-600 { background-color: #0D636E; }
    .bg-peacock-700 { background-color: #094B54; }

    /* Text Colors */
    .text-white { color: #FFFFFF; }
    .text-aubergine-900 { color: #1D1526; }
    .text-aubergine-950 { color: #120D18; }
    .text-porcelain-50 { color: #FDFCFA; }
    .text-porcelain-100 { color: #F8F5EE; }
    .text-porcelain-200 { color: #EDE6D8; }
    .text-porcelain-300 { color: #D9CEB8; }
    .text-porcelain-800 { color: #4A4336; }
    .text-copper-100 { color: #F5E8D8; }
    .text-copper-300 { color: #E5C5A3; }
    .text-copper-500 { color: #B57B45; }
    .text-copper-600 { color: #9A6330; }
    .text-copper-700 { color: #7A4C22; }
    .text-peacock-100 { color: #D4EFF2; }
    .text-peacock-600 { color: #0D636E; }
    .text-peacock-700 { color: #094B54; }
    .text-peacock-900 { color: #052D33; }

    /* Typography */
    .font-serif { font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums; }
    .font-display { font-family: 'Lora', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums; }
    .font-mono { font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-variant-numeric: tabular-nums lining-nums; }

    .text-\[9px\] { font-size: 9px; line-height: 1.3; }
    .text-\[10px\] { font-size: 10px; line-height: 1.35; }
    .text-\[11px\] { font-size: 11px; line-height: 1.4; }
    .text-xs { font-size: 0.75rem; line-height: 1rem; }
    .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
    .text-base { font-size: 1rem; line-height: 1.5rem; }
    .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
    .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
    .text-2xl { font-size: 1.5rem; line-height: 2rem; }
    .text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
    .text-4xl { font-size: 2.25rem; line-height: 2.5rem; }

    .font-normal { font-weight: 400; }
    .font-medium { font-weight: 500; }
    .font-semibold { font-weight: 600; }
    .font-bold { font-weight: 700; }
    .font-extrabold { font-weight: 800; }
    .italic { font-style: italic; }
    .uppercase { text-transform: uppercase; }
    .underline { text-decoration: underline; }
    .text-left { text-align: left; }
    .text-center { text-align: center; }
    .leading-tight { line-height: 1.25; }
    .leading-snug { line-height: 1.375; }
    .leading-relaxed { line-height: 1.625; }
    .tracking-tight { letter-spacing: -0.025em; }
    .tracking-wider { letter-spacing: 0.05em; }
    .tracking-widest { letter-spacing: 0.1em; }
    .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .break-all { word-break: break-all; }
    .select-all { user-select: all; }

    /* Overflow, Shadows & Misc */
    .overflow-hidden { overflow: hidden; }
    .overflow-x-auto { overflow-x: auto; }
    .overflow-y-auto { overflow-y: auto; }
    .pointer-events-none { pointer-events: none; }
    .cursor-pointer { cursor: pointer; }
    .outline-none { outline: 2px solid transparent; outline-offset: 2px; }
    .opacity-75 { opacity: 0.75; }
    .accent-peacock-600 { accent-color: #0D636E; }
    .shadow-xs { box-shadow: 0 1px 2px 0 rgba(24, 19, 30, 0.05); }
    .shadow-md { box-shadow: 0 4px 6px -1px rgba(24, 19, 30, 0.1), 0 2px 4px -2px rgba(24, 19, 30, 0.1); }
    .shadow-lg { box-shadow: 0 10px 15px -3px rgba(24, 19, 30, 0.14), 0 4px 6px -4px rgba(24, 19, 30, 0.1); }
    .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(24, 19, 30, 0.28); }
    .transition { transition: all 0.18s ease-in-out; }
    .transition-all { transition: all 0.25s ease-in-out; }
    .duration-300 { transition-duration: 300ms; }

    /* Interactive States */
    .hover\:bg-aubergine-800:hover { background-color: #2A2035; }
    .hover\:bg-aubergine-950:hover { background-color: #120D18; }
    .hover\:bg-copper-500:hover { background-color: #B57B45; }
    .hover\:bg-copper-700:hover { background-color: #7A4C22; }
    .hover\:bg-peacock-700:hover { background-color: #094B54; }
    .hover\:bg-porcelain-100:hover { background-color: #F8F5EE; }
    .hover\:text-white:hover { color: #FFFFFF; }
    .hover\:text-aubergine-950:hover { color: #120D18; }
    .hover\:text-copper-500:hover { color: #B57B45; }
    .hover\:text-copper-600:hover { color: #9A6330; }
    .hover\:text-copper-700:hover { color: #7A4C22; }
    .hover\:text-peacock-700:hover { color: #094B54; }
    .hover\:underline:hover { text-decoration: underline; }
    .focus\:border-peacock-600:focus { border-color: #0D636E; }

    /* Responsive Breakpoint: sm (min-width: 640px) */
    @media (min-width: 640px) {
      .sm\:inline-block { display: inline-block; }
      .sm\:flex-row { flex-direction: row; }
      .sm\:items-center { align-items: center; }
      .sm\:self-auto { align-self: auto; }
      .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .sm\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
      .sm\:col-span-5 { grid-column: span 5 / span 5; }
      .sm\:col-span-7 { grid-column: span 7 / span 7; }
      .sm\:gap-3 { gap: 0.75rem; }
      .sm\:gap-6 { gap: 1.5rem; }
      .sm\:p-6 { padding: 1.5rem; }
      .sm\:p-7 { padding: 1.75rem; }
      .sm\:p-8 { padding: 2rem; }
      .sm\:p-9 { padding: 2.25rem; }
      .sm\:p-10 { padding: 2.5rem; }
      .sm\:px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
      .sm\:py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
      .sm\:w-72 { width: 18rem; }
      .sm\:text-sm { font-size: 0.875rem; line-height: 1.25rem; }
      .sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
      .sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
      .sm\:text-5xl { font-size: 3rem; line-height: 1.1; }
    }

    /* Responsive Breakpoint: md (min-width: 768px) */
    @media (min-width: 768px) {
      .md\:hidden { display: none !important; }
      .md\:grid { display: grid; }
      .md\:flex-row { flex-direction: row; }
      .md\:items-end { align-items: flex-end; }
      .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
      .md\:pb-0 { padding-bottom: 0; }
      .md\:bottom-6 { bottom: 1.5rem; }
    }

    /* Responsive Breakpoint: lg (min-width: 1024px) */
    @media (min-width: 1024px) {
      .lg\:flex { display: flex; }
      .lg\:justify-end { justify-content: flex-end; }
      .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
      .lg\:col-span-2 { grid-column: span 2 / span 2; }
      .lg\:col-span-3 { grid-column: span 3 / span 3; }
      .lg\:col-span-4 { grid-column: span 4 / span 4; }
      .lg\:col-span-5 { grid-column: span 5 / span 5; }
      .lg\:col-span-7 { grid-column: span 7 / span 7; }
    }

    :root {
      --bg-porcelain: #F8F5EE;
      --bg-ivory: #FDFCFA;
      --ink-plum: #18131E;
      --ink-warm: #4A4336;
      --copper-line: #B57B45;
      --copper-pale: #D9CEB8;
      --peacock-teal: #0D636E;
    }

    * {
      box-sizing: border-box;
    }

    body {
      font-family: 'Source Serif 4', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums;
      background-color: var(--bg-porcelain);
      color: var(--ink-plum);
      background-image:
        repeating-linear-gradient(0deg, rgba(181, 123, 69, 0.03) 0px, rgba(181, 123, 69, 0.03) 1px, transparent 1px, transparent 32px),
        repeating-linear-gradient(90deg, rgba(181, 123, 69, 0.03) 0px, rgba(181, 123, 69, 0.03) 1px, transparent 1px, transparent 32px);
      line-height: 1.68;
      overflow-x: hidden;
    }

    h1, h2, h3, .font-copperplate {
      font-family: 'Lora', 'Noto Serif Devanagari', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums;
      letter-spacing: -0.01em;
    }

    .devanagari-serif {
      font-family: 'Noto Serif Devanagari', 'Source Serif 4', Georgia, serif;
    }

    /* Responsive Outer Layout Shell - Guarantees generous viewport margins on all screen sizes */
    .layout-shell {
      width: min(1140px, calc(100% - 32px));
      margin-left: auto;
      margin-right: auto;
    }
    @media (min-width: 640px) {
      .layout-shell {
        width: min(1140px, calc(100% - 56px));
      }
    }
    @media (min-width: 1024px) {
      .layout-shell {
        width: min(1140px, calc(100% - 88px));
      }
    }

    /* Chamfered Octagonal Engraving Plaque */
    .octagonal-plaque {
      position: relative;
      background-color: var(--bg-ivory);
      border: 1.5px solid var(--copper-line);
      box-shadow: inset 0 0 0 4px var(--bg-ivory), inset 0 0 0 5px var(--copper-pale), 0 18px 40px -15px rgba(24, 19, 30, 0.09);
      border-radius: 20px;
    }

    /* Arched Anatomical Code Drum Chambers - Sculpted 20px radius so multi-line labels never clip corners */
    .code-drum {
      background: linear-gradient(180deg, #1D1526 0%, #2A2035 50%, #120D18 100%);
      color: #FDFCFA;
      border: 2px solid var(--copper-line);
      border-radius: 20px;
      box-shadow: inset 0 4px 12px rgba(0,0,0,0.45), 0 6px 16px rgba(24, 19, 30, 0.14);
      transition: transform 0.2s ease, border-color 0.2s ease;
    }

    .code-drum:hover {
      transform: translateY(-2px);
      border-color: #0D636E;
    }

    .code-drum-ward {
      background: linear-gradient(180deg, #094B54 0%, #0D636E 50%, #052D33 100%);
      color: #FFFFFF;
      border: 2px solid #B57B45;
      border-radius: 20px;
      box-shadow: inset 0 4px 12px rgba(0,0,0,0.35), 0 6px 16px rgba(13, 99, 110, 0.22);
    }

    /* Sculpted Selector Nodes - 12px radius so single and multi-line buttons never touch container curves */
    .pill-node {
      border: 1px solid var(--copper-pale);
      background-color: #FFFFFF;
      border-radius: 12px;
      transition: all 0.16s ease;
    }

    .pill-node:hover {
      border-color: var(--copper-line);
      background-color: #FCF7F1;
    }

    .pill-node-active {
      background-color: var(--ink-plum);
      color: #FDFCFA;
      border-color: var(--copper-line);
    }

    .btn-peacock {
      background-color: var(--peacock-teal);
      color: #FFFFFF;
      border: 1px solid #052D33;
      border-radius: 9999px;
      transition: all 0.16s ease;
    }

    .btn-peacock:hover {
      background-color: #094B54;
    }

    .btn-copper-outline {
      background-color: #FFFFFF;
      color: var(--ink-plum);
      border: 1.5px solid var(--copper-line);
      border-radius: 9999px;
      transition: all 0.16s ease;
    }

    .btn-copper-outline:hover {
      background-color: var(--ink-plum);
      color: #FFFFFF;
      border-color: var(--ink-plum);
    }

    .editorial-dropcap::first-letter {
      float: left;
      font-family: 'Lora', Georgia, serif;
      font-variant-numeric: lining-nums tabular-nums;
      font-size: 3.6rem;
      line-height: 0.84;
      padding-top: 4px;
      padding-right: 12px;
      font-weight: 700;
      color: var(--peacock-teal);
    }

    .ledger-scroll::-webkit-scrollbar {
      width: 5px;
      height: 5px;
    }
    .ledger-scroll::-webkit-scrollbar-track {
      background: #EDE6D8;
    }
    .ledger-scroll::-webkit-scrollbar-thumb {
      background: #9A6330;
      border-radius: 9999px;
    }

    @media print {
      .no-print { display: none !important; }
      body { background: #FFFFFF !important; }
    }

    /* === ZERO HORIZONTAL SCROLL ACROSS ALL SECTIONS, TABLES, PRE BLOCKS & GRIDS === */
    html, body {
      max-width: 100vw !important;
      overflow-x: hidden !important;
    }
    main, section, article, header, footer, nav, div, details, table, pre, code {
      max-width: 100%;
    }
    .overflow-x-auto {
      overflow-x: hidden !important;
    }
    table {
      width: 100% !important;
      table-layout: fixed !important;
      border-collapse: collapse !important;
    }
    th, td {
      word-break: break-word !important;
      overflow-wrap: anywhere !important;
      white-space: normal !important;
    }
    pre, code {
      white-space: pre-wrap !important;
      word-break: break-word !important;
      overflow-wrap: anywhere !important;
    }

    /* === BULLETPROOF BUTTON & ACTIVE-STATE CONTRAST (NEVER LIGHT-ON-LIGHT OR INVISIBLE) === */
    .pill-node {
      border: 1.5px solid #B57B45 !important;
      background-color: #FFFFFF !important;
      color: #18131E !important;
      border-radius: 12px !important;
      transition: all 0.16s ease !important;
    }
    .pill-node * {
      color: #18131E;
    }
    .pill-node .text-peacock-700 {
      color: #094B54 !important;
    }
    .pill-node:not(.pill-node-active):hover,
    .pill-node:not(.pill-node-active):focus {
      border-color: #0D636E !important;
      background-color: #F5E8D8 !important;
      color: #18131E !important;
    }
    .pill-node:not(.pill-node-active):hover * {
      color: #18131E !important;
    }

    /* Active Pill Button / Card - Always Dark Aubergine (#18131E) Background with Crisp White (#FFFFFF) Text, even on hover/active/focus! */
    .pill-node.pill-node-active,
    .pill-node-active,
    .pill-node.pill-node-active:hover,
    .pill-node-active:hover,
    .pill-node.pill-node-active:focus,
    .pill-node-active:focus,
    .pill-node.pill-node-active:active,
    .pill-node-active:active {
      background-color: #18131E !important;
      color: #FFFFFF !important;
      border: 1.5px solid #B57B45 !important;
    }
    .pill-node.pill-node-active *,
    .pill-node-active *,
    .pill-node.pill-node-active:hover *,
    .pill-node-active:hover * {
      color: #FFFFFF !important;
    }
    .pill-node.pill-node-active .text-copper-300,
    .pill-node-active .text-copper-300 {
      color: #F5E8D8 !important;
    }

    /* Primary Peacock Teal Buttons */
    .btn-peacock,
    .bg-peacock-600 {
      background-color: #0D636E !important;
      color: #FFFFFF !important;
      border: 1.5px solid #052D33 !important;
    }
    .btn-peacock *,
    .bg-peacock-600 * {
      color: #FFFFFF !important;
    }
    .btn-peacock:hover,
    .btn-peacock:focus,
    .btn-peacock:active,
    .hover\:bg-peacock-700:hover,
    .hover\:bg-peacock-600:hover {
      background-color: #094B54 !important;
      color: #FFFFFF !important;
    }
    .btn-peacock:hover *,
    .hover\:bg-peacock-700:hover *,
    .hover\:bg-peacock-600:hover * {
      color: #FFFFFF !important;
    }

    /* Copper Outline Buttons */
    .btn-copper-outline {
      background-color: #FFFFFF !important;
      color: #18131E !important;
      border: 1.5px solid #B57B45 !important;
    }
    .btn-copper-outline * {
      color: #18131E !important;
    }
    .btn-copper-outline:hover,
    .btn-copper-outline:focus,
    .btn-copper-outline:active {
      background-color: #18131E !important;
      color: #FFFFFF !important;
      border-color: #18131E !important;
    }
    .btn-copper-outline:hover * {
      color: #FFFFFF !important;
    }

    /* Dark Aubergine & Copper Solid Buttons */
    button.bg-aubergine-950,
    a.bg-aubergine-950,
    .wada-cat-btn.bg-aubergine-950,
    .cc-preset-btn.bg-aubergine-950 {
      background-color: #18131E !important;
      color: #FFFFFF !important;
    }
    button.bg-copper-600,
    a.bg-copper-600 {
      background-color: #9A6330 !important;
      color: #FFFFFF !important;
    }
    button.bg-copper-600:hover,
    a.bg-copper-600:hover {
      background-color: #7A4C22 !important;
      color: #FFFFFF !important;
    }
    .district-jump-link {
      background-color: #FFFFFF !important;
      color: #18131E !important;
      border: 1px solid #B57B45 !important;
    }
    .district-jump-link:hover,
    .district-jump-link:focus,
    .district-jump-link:active {
      background-color: #0D636E !important;
      color: #FFFFFF !important;
      border-color: #052D33 !important;
    }
    .hover\:bg-porcelain-200:hover {
      background-color: #EDE6D8 !important;
      color: #18131E !important;
    }
    .ward-num-btn.bg-peacock-600 {
      background-color: #0D636E !important;
      color: #FFFFFF !important;
      border-color: #052D33 !important;
    }
    .ward-num-btn.bg-porcelain-50 {
      background-color: #FDFCFA !important;
      color: #18131E !important;
      border-color: #B57B45 !important;
    }
    .ward-num-btn.bg-porcelain-50:hover {
      background-color: #F5E8D8 !important;
      color: #18131E !important;
    }