/* Bootcamp 02 · vào app xem lại (chép từ club-10x/club.css, noindex). Token từ /theme.css; không :root riêng. Đọc trên giấy kem, chữ 18px; đầu trang navy. */
body.c10{background:var(--cream);color:var(--n-900);font-family:var(--f-body);font-size:18px;line-height:1.7}
.c10 *{box-sizing:border-box}
.c10 img{max-width:100%;height:auto;display:block}
.c10 a:focus-visible{outline:2px solid #E89060;outline-offset:3px}
.c10 .skip{position:absolute;left:-9999px;top:8px;z-index:20;background:var(--n-900);color:#fff;padding:10px 14px;border-radius:8px}
.c10 .skip:focus{left:12px}
.c10-wrap{max-width:720px;margin-inline:auto;padding-inline:20px}

.c10-top{background:var(--n-950);border-bottom:1px solid rgba(255,255,255,.08)}
.c10-top .c10-wrap{height:56px;display:flex;align-items:center}
.c10-brand{font-family:var(--f-label);font-weight:800;font-size:15px;letter-spacing:.02em;color:#fff;text-decoration:none}
.c10-brand b{color:var(--o-400)}

.c10-hero{background:var(--n-900);color:#fff;padding:36px 0 32px}
.c10-eyebrow{font-family:var(--f-label);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);margin:0 0 12px}
.c10-hero h1{font-family:var(--f-head);font-weight:600;font-size:clamp(30px,7vw,44px);line-height:1.18;margin:0 0 14px;color:#fff;overflow-wrap:anywhere}
.c10-lead{font-size:18px;color:var(--n-100);margin:0}
.c10-outcome{margin:0 0 10px;font-size:17px;color:var(--n-100)}
.c10-outcome span{display:inline-block;font-family:var(--f-label);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--n-950);background:var(--sand);border-radius:6px;padding:2px 8px;margin-right:6px;vertical-align:2px}
.c10-meta{font-size:14px;color:var(--n-200);margin:0}

.c10-read{padding-top:8px;padding-bottom:16px}
.c10-sec{padding:26px 0 6px;border-bottom:1px solid rgba(10,10,36,.1)}
.c10-sec h2{font-family:var(--f-head);font-weight:600;font-size:26px;line-height:1.25;margin:0 0 12px;color:var(--n-900)}
.c10-sec p{margin:0 0 14px}
.c10-sec ul,.c10-sec ol{margin:0 0 14px;padding-left:24px}
.c10-sec li{margin:0 0 8px}
.c10-sec strong{font-weight:700}
.c10-sec--keys ul{list-style:none;padding:0;counter-reset:k}
.c10-sec--keys li{counter-increment:k;position:relative;padding:12px 14px 12px 52px;background:#fff;border:1px solid rgba(10,10,36,.1);border-radius:12px}
.c10-sec--keys li::before{content:counter(k);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;background:var(--o-500);color:#fff;font-family:var(--f-label);font-weight:700;font-size:14px;display:grid;place-items:center;line-height:1}
.c10-sec--story p{font-family:var(--f-head);font-size:20px;line-height:1.6}
.c10-sec--task{background:#fff;border:1px solid rgba(10,10,36,.12);border-radius:16px;padding:22px 20px 8px;margin-top:22px}
.c10-sec--think li{font-style:italic}
.c10-sec--choi{border-bottom:0}
.c10-sec--choi ul{list-style:none;padding:0}
.c10-sec--choi li{background:var(--n-900);color:#fff;border-radius:14px 14px 14px 4px;padding:12px 16px;max-width:560px}

.c10-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border-radius:12px;background:var(--o-500);color:#fff;font-weight:600;font-size:16px;text-decoration:none;text-align:center;line-height:1.35}
.c10-btn:hover{background:var(--o-600)}
.c10-btn--ghost{background:transparent;color:var(--n-900);border:1.5px solid var(--n-900)}
.c10-btn--ghost:hover{background:rgba(10,10,36,.06)}
.c10-actions{display:flex;flex-wrap:wrap;gap:12px;padding:28px 0 8px}
.c10-actions .c10-btn{flex:1 1 260px}

.c10-toc{list-style:none;padding:0;margin:22px 0 0;border-top:1px solid rgba(10,10,36,.1)}
.c10-toc li{border-bottom:1px solid rgba(10,10,36,.1);margin:0;padding:0}
.c10-toc a{display:block;padding:12px 4px;color:var(--n-900);text-decoration:none;font-size:17px}
.c10-toc a b{font-family:var(--f-label);font-size:13px;color:var(--o-600);margin-right:8px}
.c10-toc li[aria-current="page"] a{font-weight:700}

.c10-qr{text-align:center;padding:26px 0 18px;border-bottom:1px solid rgba(10,10,36,.1)}
.c10-qr h2{font-family:var(--f-head);font-weight:600;font-size:26px;margin:0 0 14px;color:var(--n-900)}
.c10-qr__code{width:min(240px,70vw);margin:0 auto 16px;background:#fff;padding:10px;border-radius:16px;border:1px solid rgba(10,10,36,.12)}
.c10-qr__code svg{display:block;width:100%;height:auto}
.c10-small{font-size:14px;color:var(--n-600);margin:8px 0 0}
.c10-shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;list-style:none;padding:0;margin:0 0 10px}
.c10-shots li{margin:0}
.c10-shots span{display:block;font-size:15px;line-height:1.4;margin-top:8px}
.c10-shots img{border-radius:14px;border:1px solid rgba(10,10,36,.12)}

@media (prefers-reduced-motion:reduce){.c10 *{transition:none!important;animation:none!important}}
