/* Common neuromorphic properties */
:root {
  --shadow-color: rgba(0, 0, 0, 0.1);
  --highlight-color: rgba(255, 255, 255, 0.8);
  --surface-color: #e0e5ec;
  --text-color: #2d3748;
  --border-radius: 10px;
}

/* Base neuromorphic button/element style */
.neumorphic {
  background: var(--surface-color);
  border-radius: var(--border-radius);
  box-shadow: 8px 8px 15px var(--shadow-color),
    -8px -8px 15px var(--highlight-color);
  transition: all 0.2s ease;
}

/* Specific element styling */
#topbar-cta-button {
  padding: 12px 24px;
  border: none;
  color: var(--text-color);
  font-weight: 600;
  cursor: pointer;
}

#topbar-cta-button:hover {
  box-shadow: 6px 6px 10px var(--shadow-color),
    -6px -6px 10px var(--highlight-color);
  transform: translateY(-2px);
}

#topbar-cta-button:active {
  box-shadow: inset 4px 4px 8px var(--shadow-color),
    inset -4px -4px 8px var(--highlight-color);
  transform: translateY(0);
}

/* Hover states for interactive elements */
.interactive:hover {
  box-shadow: 6px 6px 10px var(--shadow-color),
    -6px -6px 10px var(--highlight-color);
}

/* Active/pressed state */
.interactive:active {
  box-shadow: inset 4px 4px 8px var(--shadow-color),
    inset -4px -4px 8px var(--highlight-color);
}

/* Info box styling */
.info-box {
  background: linear-gradient(145deg, #e6e6e6, #ffffff);
  border-radius: var(--border-radius);
  padding: 20px;
  margin: 15px 0;
  box-shadow: 5px 5px 10px var(--shadow-color),
    -5px -5px 10px var(--highlight-color);
}

/* Warning box styling */
.warning-box {
  background: linear-gradient(145deg, #fff5e6, #fffaf0);
  border-radius: var(--border-radius);
  padding: 20px;
  margin: 15px 0;
  border-left: 4px solid #f6ad55;
  box-shadow: 5px 5px 10px var(--shadow-color),
    -5px -5px 10px var(--highlight-color);
}

/* Logo container styling */
[class*="logo-"] {
  width: var(--logo-width);
  height: var(--logo-height);
  display: inline-block;
}

[class*="logo-"] img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Dark mode specific adjustments if needed */
[data-theme="dark"] [class*="logo-"] {
  filter: brightness(1.1);
}


Overview

Minh-Duc Bui

Introduction

Tokenization

Word Embedding

Word Embedding - Biểu Diễn Từ Trong Không Gian Vector

Self-attention

Masked Self-attention

Multi-head Attention

Positional Encoding

LM Head

Sample Strategies

Database Optim

Database Optimization

Creational Pattern

Structural Pattern

Behavioral Pattern

Github

Linkedin

Intro

Deep Learning

Backend

Contact

Advanced FastAPI

Design Pattern

Overview

Creational Pattern

Structural Pattern

Behavioral Pattern