body {
      box-sizing: border-box;
    }
    
    :root {
      --bg-primary: #0a0a0b;
      --bg-secondary: #141416;
      --text-primary: #e8e8e8;
      --accent-green: #4ade80;
      --accent-amber: #fbbf24;
    }
    
    * {
      scrollbar-width: thin;
      scrollbar-color: #2a2a2e #0a0a0b;
    }
    
    .font-mono-tech {
      font-family: 'JetBrains Mono', monospace;
    }
    
    .font-body {
      font-family: 'IBM Plex Sans', sans-serif;
    }
    
    .terminal-cursor {
      animation: blink 1s step-end infinite;
    }
    
    @keyframes blink {
      0%, 100% { opacity: 1; }
      50% { opacity: 0; }
    }
    
    @keyframes scanline {
      0% { transform: translateY(-100%); }
      100% { transform: translateY(100%); }
    }
    
    .scanline-effect::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(74, 222, 128, 0.1), transparent);
      animation: scanline 8s linear infinite;
      pointer-events: none;
    }
    
    .nav-link {
      position: relative;
    }
    
    .nav-link::after {
      content: '';
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 0;
      height: 1px;
      background: var(--accent-green);
      transition: width 0.3s ease;
    }
    
    .nav-link:hover::after {
      width: 100%;
    }
    
    .status-badge {
      font-size: 0.65rem;
      padding: 2px 8px;
      border-radius: 2px;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }
    
    .project-card {
      border: 1px solid #2a2a2e;
      transition: border-color 0.3s ease, transform 0.2s ease;
    }
    
    .project-card:hover {
      border-color: #4ade80;
      transform: translateY(-2px);
    }
    
    .log-entry {
      border-left: 2px solid #2a2a2e;
      transition: border-color 0.3s ease;
    }
    
    .log-entry:hover {
      border-left-color: #fbbf24;
    }
    
    .section-marker {
      writing-mode: vertical-rl;
      text-orientation: mixed;
      letter-spacing: 0.2em;
    }
    
    .glow-text {
      text-shadow: 0 0 20px rgba(74, 222, 128, 0.3);
    }
    
    .idea-card {
      background: linear-gradient(135deg, #141416 0%, #1a1a1e 100%);
      border: 1px dashed #3a3a3e;
    }
    
    .tool-badge {
      background: #1a1a1e;
      border: 1px solid #2a2a2e;
    }
    
    .page-section {
      display: none;
      animation: fadeIn 0.4s ease-in-out;
    }
    
    .page-section.active {
      display: block;
    }
    
    @keyframes fadeIn {
      from {
        opacity: 0;
        transform: translateY(20px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    
    .nav-link.active {
      color: var(--accent-green);
    }

    .translation-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 0.65rem;
      padding: 2px 8px;
      border-radius: 2px;
      background: #1a1a1e;
      border: 1px solid #2a2a2e;
    }
    
    .log-content {
      white-space: pre-wrap;
      line-height: 1.6;
    }

@view-transition {
  navigation: auto;
}

/* Modal body scroll */
#md-body {
  max-height: 70vh;
  overflow-y: auto;
  padding-right: 6px; /* piccolo respiro per la scrollbar */
}

/* ================================
   Markdown Builder-like Theme
   ================================ */

#md-body {
  /* colonna leggibile */
  max-width: 860px;
  margin: 0 auto;
  padding: 22px 24px;

  /* testo */
  color: #e6e6e6;
  font-size: 16px;
  line-height: 1.85;

  /* scroll già presente: lascialo, ma miglioriamo l'aspetto */
  max-height: 70vh;
  overflow-y: auto;
}

/* Titoli */
#md-body h1,
#md-body h2,
#md-body h3,
#md-body h4 {
  color: #ffffff;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.15;
  margin: 0.9em 0 0.45em;
}

#md-body h1 { font-size: 44px; margin-top: 0.25em; }
#md-body h2 { font-size: 28px; margin-top: 1.2em; }
#md-body h3 { font-size: 20px; margin-top: 1.0em; }
#md-body h4 { font-size: 18px; margin-top: 1.0em; }

/* Paragrafi e liste */
#md-body p { margin: 0.85em 0; }
#md-body ul { margin: 0.85em 0 0.85em 1.2em; list-style: disc; }
#md-body ol { margin: 0.85em 0 0.85em 1.2em; list-style: decimal; }
#md-body li { margin: 0.35em 0; } 
#md-body li::marker { color: #a7f3d0; }

/* Separatori come nel builder */
#md-body hr {
  border: 0;
  border-top: 1px solid rgba(255,255,255,0.14);
  margin: 1.6em 0;
}

/* Immagini */
#md-body img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin: 0.85em 0;
  display: block;
}

/* Link */
#md-body a {
  color: #4ade80;
  text-decoration: underline;
  text-underline-offset: 2px;
}
#md-body a:hover { opacity: 0.9; }

/* Blockquote */
#md-body blockquote {
  margin: 1.1em 0;
  padding: 0.75em 1em;
  border-left: 3px solid #4ade80;
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.92);
  border-radius: 10px;
}

/* Inline code */
#md-body code {
  font-family: ui-monospace, SFMono-R

/* Terminal vibe: monospazio vero */
:root{
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
          "Liberation Mono", "Courier New", monospace;
}

/* usa questo per tutte le “info” */
.font-mono-tech{
  font-family: var(--mono) !important;
  letter-spacing: 0.02em;
}

/* opzionale: kicker, meta e badge più “terminal” */
.status-badge, .tool-badge{
  font-family: var(--mono) !important;
}

/* ================================
   FORCE "terminal" font inside modal markdown
   ================================ */

:root{
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
          "Liberation Mono", "Courier New", monospace;
}

/* tutto il contenuto markdown in terminale */
#md-body,
#md-body * {
  font-family: var(--mono) !important;
  letter-spacing: 0.02em;
}

/* titoli un filo più “terminal”: meno serif, più asciutti */
#md-body h1 { font-size: 36px; font-weight: 800; }
#md-body h2 { font-size: 24px; font-weight: 800; }
#md-body h3 { font-size: 18px; font-weight: 800; }
#md-body p, #md-body li { font-size: 15px; }

/* mantieni buona leggibilità */
#md-body { line-height: 1.85; }