/* 31/10: sổ tay cá nhân John Le (trang chủ + 3 mục Technology / Travel / Life): giấy ấm, chữ đọc dài, ảnh có chú thích */
:root{--paper:#f5f0e6;--card:#fffcf6;--line:#e4dac8;--lacquer:#2f5d6e;--turmeric:#b9842d;--jade:#4d7a5f}
@media (prefers-color-scheme:dark){:root{--paper:#12110f;--card:#1c1a17;--line:#302b25;--lacquer:#86b7c8;--turmeric:#d9ab5b;--jade:#86b89a}}
.ava-img{object-fit:cover;padding:0;background:var(--line)}
.top .logo{white-space:nowrap;flex-shrink:0}.top .nav{min-width:0}
.me{display:grid;grid-template-columns:180px 1fr;gap:40px;align-items:center;padding:56px 0 36px}
.me-ava{width:180px;height:180px;border-radius:50%;object-fit:cover;box-shadow:var(--shadow);display:grid;place-items:center;background:linear-gradient(135deg,var(--lacquer),var(--turmeric));color:#fff;font:700 54px Fraunces,serif}
.me h1{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(30px,3.8vw,46px);line-height:1.12;letter-spacing:-.6px;margin:12px 0 14px;max-width:24ch}
.me p{font-size:18.5px;color:var(--muted);max-width:62ch;margin:0 0 14px}
.me-links{margin-top:18px}
.btn{display:inline-block;text-decoration:none;font-weight:600;font-size:15px;padding:11px 18px;border-radius:999px;background:var(--lacquer);color:#fff}
.sec-d{color:var(--muted);margin:-8px 0 20px;max-width:70ch}
.prose{font-family:Lora,Georgia,"Times New Roman",serif;font-size:19.5px;line-height:1.82}
.prose>p:first-of-type:first-letter{color:var(--turmeric)}
.prose h2:before{background:var(--lacquer)}
.prose blockquote{margin:34px 0;padding:6px 0 6px 24px;border-left:3px solid var(--turmeric);font-family:Fraunces,Georgia,serif;font-style:italic;font-size:25px;line-height:1.4;color:var(--ink)}
.fig{margin:34px 0}.fig img{width:100%;border-radius:16px;box-shadow:var(--shadow)}
.fig figcaption{font:14px/1.5 Inter,system-ui,sans-serif;color:var(--muted);margin-top:10px;text-align:center}
.fig figcaption small{font-size:12px;opacity:.85}.fig figcaption a{color:var(--muted)}
.written{max-width:680px;margin:36px 0 0;font:italic 16px Lora,Georgia,serif;color:var(--muted);border-top:1px solid var(--line);padding-top:18px}
@media (max-width:760px){.me{grid-template-columns:1fr;gap:20px;padding-top:30px}.me-ava{width:120px;height:120px;font-size:38px}.prose{font-size:18.5px}}