/*
 * assets/css/base.css — NỀN GIAO DIỆN DÙNG CHUNG cho các trang nội dung (trang bài viết, chuyên mục, tiện ích...).
 * Nạp bằng render_head() (includes/head.php), TRƯỚC khối <style> riêng của trang và TRƯỚC theme-dynamic.php
 * (theme-dynamic chỉ ghi đè biến màu --bg/--accent... nên phải đến sau).
 * Khung chuẩn: rộng 1360px; có cột phải (.has-side) thì cột sidebar 280px. Cỡ chữ luôn dùng calc(Npx * var(--fs-scale,1)).
 * Trang nào chưa chuyển sang render_head() vẫn tự khai báo các quy tắc này trong <style> của chính nó.
 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#0f1117;--bg-card:#161b27;--bg2:#1c2130;--border:rgba(255,255,255,.08);--accent:#4f9cf9;--text-1:#e8ecf4;--text-2:#a0aab8;--text-3:#5a6478;--success:#34d399;--radius:12px}
body{background:var(--bg);color:var(--text-1);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;min-height:100vh;display:flex;flex-direction:column}
.wrap{max-width:1360px;margin:0 auto;padding:20px 16px 60px;flex:1;width:100%}
.wrap.has-side{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start}
.main-col{min-width:0}
.side-col{display:flex;flex-direction:column;gap:14px;min-width:0}
@media (max-width:760px){.wrap.has-side{grid-template-columns:1fr}}
@media (max-width:480px){.wrap{padding:14px 12px 50px}}
.crumbs{font-size:calc(12.5px * var(--fs-scale,1));color:var(--text-3);margin-bottom:12px}
.crumbs a{color:var(--text-2);text-decoration:none}.crumbs a:hover{color:var(--accent)}