:root{
  --bg:#070611;--bg-soft:#0d0b1b;--panel:#121022;--panel-2:#19162d;
  --line:rgba(255,255,255,.11);--text:#fff;--muted:#aaa5bb;
  --pink:#ff4fc8;--violet:#8b5cff;--cyan:#62e8ff;--green:#72f2c5;
  --shadow:0 28px 80px rgba(0,0,0,.36);--radius:24px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 "Be Vietnam Pro",Arial,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 12% 10%,rgba(255,79,200,.09),transparent 28%),radial-gradient(circle at 90% 26%,rgba(98,232,255,.07),transparent 25%)}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input,select{font:inherit}
.wrap{width:min(1220px,calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:80;background:rgba(7,6,17,.8);backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}
.nav{min-height:78px;display:flex;align-items:center;gap:20px}
.brand{display:flex;align-items:center;gap:11px;font-size:20px;font-weight:900;letter-spacing:-.04em;white-space:nowrap}
.brand img{width:48px;height:48px;object-fit:cover;border-radius:50%;box-shadow:0 0 28px rgba(255,79,200,.34)}
.brand span{background:linear-gradient(90deg,#fff,#ffb4ea 62%,var(--cyan));-webkit-background-clip:text;color:transparent}
.links{display:flex;align-items:center;gap:3px;margin-left:auto}
.links a{padding:10px 12px;border-radius:999px;color:#d2cede;font-size:13px;font-weight:800;transition:.2s}
.links a:hover,.links a.active{background:rgba(255,255,255,.08);color:#fff}
.header-cta{display:inline-flex;align-items:center;gap:8px;padding:11px 17px;border-radius:999px;background:linear-gradient(100deg,var(--cyan),#a58aff,var(--pink));color:#0a0712;font-size:13px;font-weight:900;box-shadow:0 10px 30px rgba(139,92,255,.24)}
.nav-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:13px;background:var(--panel);color:#fff}
.hero-v3{position:relative;min-height:700px;overflow:hidden;background:linear-gradient(135deg,#070611 0%,#160b29 53%,#071d27 100%)}
.hero-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#000,transparent)}
.hero-orb{position:absolute;border-radius:50%;filter:blur(2px)}
.hero-orb-one{width:600px;height:600px;right:-150px;top:-110px;background:radial-gradient(circle,rgba(255,79,200,.25),rgba(139,92,255,.1) 48%,transparent 70%)}
.hero-orb-two{width:460px;height:460px;left:-220px;bottom:-220px;background:radial-gradient(circle,rgba(98,232,255,.18),transparent 68%)}
.hero-v3-grid{position:relative;z-index:2;min-height:700px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:48px;padding:70px 0}
.hero-kicker,.eyebrow{display:inline-flex;align-items:center;gap:9px;color:#ff9de1;font-size:12px;font-weight:900;letter-spacing:.16em}
.hero-v3 h1,.page-hero-v3 h1{margin:17px 0 22px;font-size:clamp(52px,7vw,88px);line-height:1.01;letter-spacing:-.065em}
.hero-v3 h1 em,.page-hero-v3 h1 em{font-style:normal;background:linear-gradient(90deg,#ff65ce,#a481ff 48%,#6eeaff);-webkit-background-clip:text;color:transparent}
.hero-v3-copy>p{max-width:680px;color:var(--muted);font-size:18px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:13px 20px;border:0;border-radius:15px;font-weight:900;cursor:pointer;transition:.2s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(100deg,var(--pink),var(--violet));box-shadow:0 14px 38px rgba(139,92,255,.25)}
.btn-glass{background:rgba(255,255,255,.07);border:1px solid var(--line)}
.btn-light{background:#fff;color:#150b28}
.hero-proof{display:flex;gap:34px;margin-top:45px}
.hero-proof div{display:flex;flex-direction:column}.hero-proof strong{font-size:17px}.hero-proof span{color:var(--muted);font-size:11px}
.hero-showcase{position:relative;min-height:520px;display:grid;place-items:center}
.showcase-frame{position:relative;width:min(430px,90%);aspect-ratio:4/5;border:1px solid rgba(255,255,255,.18);border-radius:38px;overflow:hidden;background:linear-gradient(160deg,#241743,#10253a);box-shadow:0 38px 90px rgba(0,0,0,.48),0 0 80px rgba(255,79,200,.12)}
.showcase-frame img{width:100%;height:100%;object-fit:cover}
.showcase-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(7,6,17,.88))}
.showcase-label{position:absolute;left:24px;bottom:22px;font-family:Pacifico,cursive;font-size:27px}
.float-chip{position:absolute;padding:11px 15px;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(17,13,39,.82);backdrop-filter:blur(15px);box-shadow:var(--shadow);font-size:12px;font-weight:900}
.chip-one{left:-5px;top:23%}.chip-two{right:-5px;top:43%}.chip-three{right:25px;bottom:10%}
.quick-paths{position:relative;z-index:4;margin-top:-38px}
.quick-path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.quick-path{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;min-height:132px;padding:20px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(28,20,53,.96),rgba(13,12,30,.97));box-shadow:var(--shadow);transition:.25s}
.quick-path:hover{transform:translateY(-5px);border-color:rgba(98,232,255,.35)}
.quick-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,var(--pink),var(--violet));font-size:20px}
.quick-path small{display:block;color:#ff9de1;font-size:10px;font-weight:900;letter-spacing:.13em}
.quick-path strong{display:block;margin-top:3px;font-size:17px}.quick-path p{margin:3px 0 0;color:var(--muted);font-size:12px}.quick-path>b{color:var(--cyan)}
.section{padding:92px 0}.soft-section{background:linear-gradient(180deg,transparent,rgba(255,255,255,.018),transparent)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:28px}
.section-heading h2{margin:7px 0 0;font-size:clamp(34px,4.5vw,54px);line-height:1.08;letter-spacing:-.05em}.section-heading p{margin:8px 0 0;color:var(--muted)}.text-link{color:#ffc1eb;font-weight:900}
.content-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.content-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,var(--panel-2),var(--panel));box-shadow:var(--shadow);transition:.25s}
.content-card:hover{transform:translateY(-6px);border-color:rgba(255,79,200,.4)}
.card-media{position:relative;overflow:hidden;aspect-ratio:4/3;background:#0d0c1b}.card-media img{width:100%;height:100%;object-fit:cover;transition:.45s}.content-card:hover .card-media img{transform:scale(1.045)}
.card-id{position:absolute;left:13px;top:13px;padding:6px 9px;border-radius:999px;background:rgba(7,6,17,.78);backdrop-filter:blur(10px);font-size:10px;font-weight:900}
.card-type{position:absolute;right:13px;top:13px;padding:6px 9px;border-radius:999px;background:linear-gradient(100deg,var(--pink),var(--violet));font-size:10px;font-weight:900}
.card-body{display:flex;flex:1;flex-direction:column;padding:18px}.card-body h3{margin:0 0 9px;font-size:20px;line-height:1.35;letter-spacing:-.025em}.card-body p{margin:0;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:13px;color:#8e899f;font-size:11px}
.card-actions{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:8px;
  width:100%;
  margin-top:auto;
  padding-top:18px;
}
.card-actions a,
.card-actions button{
  flex:1 1 0;
  min-width:0;
  min-height:42px;
  padding:0 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.05);
  color:#fff;
  font:inherit;
  font-size:12px;
  font-weight:900;
  line-height:1.15;
  white-space:nowrap;
  text-align:center;
  cursor:pointer;
  overflow:hidden;
}
.card-actions .primary-action{
  border:0;
  background:linear-gradient(100deg,var(--pink),var(--violet));
}

.status,.empty{grid-column:1/-1;padding:34px;border:1px dashed rgba(255,255,255,.17);border-radius:20px;color:var(--muted);text-align:center}
.affiliate-banner{padding:20px 0 95px}.affiliate-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:52px;border-radius:32px;background:radial-gradient(circle at 82% 15%,rgba(98,232,255,.25),transparent 32%),linear-gradient(120deg,#a32687,#5f43d4 57%,#116d7d);box-shadow:var(--shadow)}
.affiliate-inner h2{margin:10px 0;font-size:clamp(38px,5vw,62px);line-height:1.03;letter-spacing:-.055em}.affiliate-inner p{max-width:750px;margin:0;color:#f0e9f6}.light-eyebrow{color:#fff}
.page-hero-v3{position:relative;padding:95px 0 75px;overflow:hidden;border-bottom:1px solid var(--line)}.page-hero-v3:after{content:"";position:absolute;width:540px;height:540px;right:-110px;top:-250px;border-radius:50%;background:radial-gradient(circle,rgba(255,79,200,.24),transparent 68%)}.page-hero-v3 h1{font-size:clamp(46px,7vw,75px);max-width:900px}.page-hero-v3 p{color:var(--muted);font-size:18px}.blog-page-hero{background:linear-gradient(120deg,#070611,#26102c)}.wiki-page-hero{background:linear-gradient(120deg,#070611,#102238)}
.library-toolbar,.wiki-toolbar{position:sticky;top:92px;z-index:30;display:grid;grid-template-columns:minmax(250px,1fr) 230px;gap:12px;margin-bottom:16px;padding:12px;border:1px solid var(--line);border-radius:19px;background:rgba(13,11,27,.87);backdrop-filter:blur(18px)}
.library-toolbar{grid-template-columns:minmax(260px,1fr) 210px;align-items:center}.type-chips{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}.type-chips button{padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);color:#fff;font-size:11px;font-weight:900;cursor:pointer}.type-chips button.active{background:linear-gradient(100deg,var(--pink),var(--violet));border-color:transparent}
.search-field{position:relative}.search-field span{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#aaa;font-size:21px}.search-field input,.library-toolbar select,.wiki-toolbar select{width:100%;height:50px;border:1px solid var(--line);border-radius:13px;background:#090817;color:#fff;padding:0 14px;outline:0}.search-field input{padding-left:44px}.search-field input:focus{border-color:var(--pink)}.result-count{margin:14px 0 22px;color:var(--muted);font-size:13px}
.post-topbar{padding:28px 0;color:#d6d0e2}.article-v3{width:min(940px,calc(100% - 40px));margin:5px auto 80px}.article-header{padding:clamp(24px,5vw,55px);border:1px solid var(--line);border-radius:30px;background:linear-gradient(180deg,var(--panel-2),var(--panel));box-shadow:var(--shadow)}.article-header h1{margin:13px 0;font-size:clamp(38px,6vw,65px);line-height:1.1;letter-spacing:-.055em}.article-cover{width:100%;max-height:650px;object-fit:cover;border-radius:23px;margin-top:30px}.article-summary{color:var(--muted);font-size:18px}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;margin-top:22px}.article-content{padding:clamp(22px,4vw,42px);border:1px solid var(--line);border-radius:25px;background:var(--panel);font-size:17px;line-height:1.85}.article-content img{width:100%;border-radius:18px;margin:22px 0}.article-content blockquote{margin:24px 0;padding:18px 20px;border-left:4px solid var(--pink);border-radius:0 15px 15px 0;background:rgba(255,79,200,.07)}.article-content .gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.article-content iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:18px}
.article-sidebar{position:sticky;top:100px;align-self:start;display:grid;gap:14px}.side-card{padding:18px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,var(--panel-2),var(--panel))}.side-card h3{margin:0 0 8px}.side-card p{margin:0;color:var(--muted);font-size:13px}.side-actions{display:grid;gap:9px;margin-top:15px}.side-actions button,.side-actions a{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.05);color:#fff;font:inherit;font-size:12px;font-weight:900;cursor:pointer}.side-actions .affiliate-action{border:0;background:linear-gradient(100deg,var(--cyan),#a58aff,var(--pink));color:#0a0712}
.related-shell{padding-bottom:90px}.compact{margin-bottom:20px}.compact h2{font-size:35px}
.wiki-grid-v3{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.wiki-card-v3{overflow:hidden;border:1px solid var(--line);border-radius:21px;background:linear-gradient(180deg,var(--panel-2),var(--panel));box-shadow:var(--shadow)}.wiki-card-v3 img{width:100%;aspect-ratio:1/1;object-fit:cover}.wiki-card-v3 .card-body{padding:16px}.wiki-card-v3 h3{margin:0 0 7px}.skill-meta{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.skill-meta span{padding:5px 8px;border-radius:999px;background:rgba(98,232,255,.08);color:var(--cyan);font-size:10px;font-weight:900}
.footer{padding:55px 0 22px;border-top:1px solid var(--line);background:#05040c}.footer-grid{display:flex;justify-content:space-between;gap:28px}.footer p{color:var(--muted)}.footer-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap;color:#ccc6d8;font-weight:800;font-size:13px}.copyright{margin-top:32px;padding-top:19px;border-top:1px solid var(--line);color:#716c7e;font-size:12px}
.toast{position:fixed;right:18px;bottom:18px;z-index:100;padding:13px 17px;border:1px solid var(--line);border-radius:14px;background:#151128;box-shadow:var(--shadow);font-size:13px;font-weight:800;animation:toast-in .2s ease}@keyframes toast-in{from{transform:translateY(12px);opacity:0}}
@media(max-width:980px){.links{display:none}.nav-toggle{display:block;margin-left:auto}.links.open{display:flex;position:absolute;top:78px;left:14px;right:14px;flex-direction:column;align-items:stretch;padding:12px;border:1px solid var(--line);border-radius:17px;background:rgba(10,8,23,.98);box-shadow:var(--shadow)}.links a{text-align:center}.header-cta{display:none}.hero-v3-grid{grid-template-columns:1fr;text-align:center}.hero-v3-copy>p{margin-left:auto;margin-right:auto}.hero-actions,.hero-proof{justify-content:center}.hero-showcase{display:none}.quick-paths{margin-top:0;padding-top:22px}.quick-path-grid{grid-template-columns:1fr}.content-grid{grid-template-columns:repeat(2,1fr)}.article-layout{grid-template-columns:1fr}.article-sidebar{position:static}.wiki-grid-v3{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.wrap{width:min(100% - 28px,1220px)}.hero-v3{min-height:auto}.hero-v3-grid{min-height:auto;padding:75px 0}.hero-v3 h1{font-size:clamp(43px,14vw,62px)}.hero-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hero-proof span{font-size:9px}.section{padding:68px 0}.section-heading{align-items:flex-start;flex-direction:column}.content-grid,.wiki-grid-v3{grid-template-columns:1fr}.affiliate-inner{align-items:flex-start;flex-direction:column;padding:30px}.library-toolbar,.wiki-toolbar{top:88px;grid-template-columns:1fr}.type-chips{grid-column:auto}.article-content .gallery{grid-template-columns:1fr}.footer-grid{flex-direction:column}.card-actions{flex-wrap:nowrap;gap:6px}.card-actions a,.card-actions button{padding:0 5px;font-size:11px}.btn{width:100%}}

/* =========================================================
   MINA HERO V5 — BOXED, STABLE, NO OVERFLOW
   Đây là cấu hình Hero duy nhất của trang chủ Production.
========================================================= */
.hero-v3.mina-hero-slider{
  --hero-delay:6500ms;
  position:relative;
  width:min(1220px,calc(100% - 40px));
  aspect-ratio:1672 / 941;
  height:auto;
  min-height:560px;
  max-height:686px;
  margin:26px auto 0;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:#070611;
  box-shadow:0 30px 90px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.02) inset;
}

.mina-hero-slides,.mina-hero-slide{position:absolute;inset:0}
.mina-hero-slide{
  z-index:0;opacity:0;visibility:hidden;
  transition:opacity .8s ease,visibility .8s ease;
}
.mina-hero-slide.is-active{z-index:1;opacity:1;visibility:visible}
.mina-hero-slide img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  user-select:none;pointer-events:none;
}

.mina-hero-shade{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,6,17,.97) 0%,rgba(7,6,17,.88) 25%,rgba(7,6,17,.58) 48%,rgba(7,6,17,.12) 76%,rgba(7,6,17,.03) 100%),
    linear-gradient(0deg,rgba(7,6,17,.48) 0%,transparent 44%);
}

.mina-hero-content{
  position:relative;z-index:3;display:flex;align-items:center;
  width:min(1120px,calc(100% - 96px));height:100%;margin:auto;padding:42px 0 62px;
}
.mina-hero-copy{width:min(575px,50%)}
.hero-script{
  width:max-content;margin:0 0 8px;font-family:Pacifico,cursive;
  color:#8ce8ff;font-size:clamp(22px,2.2vw,34px);line-height:1.15;
  text-shadow:0 0 12px rgba(98,232,255,.75),0 0 28px rgba(139,92,255,.45);
  transform:rotate(-2deg);
}
.hero-brand-lockup{display:flex;align-items:flex-end;gap:12px;margin:0 0 12px;line-height:.9}
.hero-brand-lockup strong{
  color:#fff;font-size:clamp(54px,5.5vw,82px);font-style:italic;font-weight:1000;
  letter-spacing:-.075em;text-shadow:0 3px 0 #5f68dc,0 0 18px rgba(98,232,255,.55);
}
.hero-brand-lockup span{
  padding-bottom:8px;color:#fff;font-size:clamp(20px,2vw,30px);font-style:italic;font-weight:900;
  letter-spacing:-.04em;text-shadow:0 0 16px rgba(139,92,255,.55);
}
.mina-hero-slider h1{
  max-width:590px;margin:0 0 16px;font-size:clamp(38px,4.15vw,60px);
  line-height:1.02;letter-spacing:-.055em;text-shadow:0 7px 30px rgba(0,0,0,.62);
}
.mina-hero-slider h1 em{
  font-style:normal;background:linear-gradient(90deg,#ff62ce,#a981ff 50%,#68e8ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.mina-hero-copy>p{
  max-width:550px;margin:0;color:rgba(255,255,255,.82);font-size:15px;line-height:1.7;
  text-shadow:0 2px 14px rgba(0,0,0,.72);
}
.hero-topic-pill{
  display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:20px;padding:9px 14px;
  border:1px solid rgba(98,232,255,.35);border-radius:10px;
  background:linear-gradient(90deg,rgba(91,48,188,.42),rgba(25,93,157,.28));
  box-shadow:0 8px 26px rgba(0,0,0,.2),0 0 20px rgba(139,92,255,.1) inset;
  font-size:11px;letter-spacing:.025em;
}
.hero-topic-pill span{color:#8ce8ff;font-size:15px}.hero-topic-pill b{font-weight:900}.hero-topic-pill i{color:#aaa5bb;font-style:normal}
.mina-hero-slider .hero-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:22px}
.mina-hero-slider .btn{min-height:48px;padding:12px 19px;border-radius:11px;font-size:13px}
.mina-hero-slider .btn-glass{background:rgba(7,6,17,.55);backdrop-filter:blur(14px)}

.mina-hero-arrow{
  position:absolute;top:50%;z-index:5;display:grid;place-items:center;width:44px;height:44px;padding:0;
  border:1px solid rgba(255,255,255,.24);border-radius:50%;color:#fff;background:rgba(7,6,17,.48);
  backdrop-filter:blur(12px);font-size:30px;line-height:1;cursor:pointer;transform:translateY(-50%);
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.mina-hero-arrow:hover{background:rgba(139,92,255,.72);border-color:#fff;transform:translateY(-50%) scale(1.06)}
.mina-hero-prev{left:14px}.mina-hero-next{right:14px}
.mina-hero-dots{position:absolute;left:50%;bottom:18px;z-index:5;display:flex;gap:8px;transform:translateX(-50%)}
.mina-hero-dot{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:rgba(255,255,255,.48);cursor:pointer;transition:.25s}
.mina-hero-dot.is-active{width:28px;background:#fff}
.mina-hero-progress{position:absolute;right:0;bottom:0;left:0;z-index:6;height:3px;background:rgba(255,255,255,.12)}
.mina-hero-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--cyan),var(--violet),var(--pink))}
.mina-hero-progress span.is-running{animation:mina-hero-progress var(--hero-delay) linear forwards}
@keyframes mina-hero-progress{from{width:0}to{width:100%}}

/* Cards luôn nằm dưới banner, tuyệt đối không chồng lên ảnh */
.quick-paths{position:relative;z-index:4;width:100%;margin:0!important;padding:22px 0 8px;background:transparent;transform:none!important}
.quick-path-grid{width:min(1120px,calc(100% - 64px));grid-template-columns:repeat(3,minmax(0,1fr));margin:auto}
.quick-path{min-height:112px;border-radius:18px}

@media(max-width:980px){
  .hero-v3.mina-hero-slider{width:min(100% - 28px,1220px);aspect-ratio:auto;height:650px;min-height:650px;margin-top:18px;border-radius:22px}
  .mina-hero-content{justify-content:center;width:min(760px,calc(100% - 64px));padding:64px 0 70px;text-align:center}
  .mina-hero-copy{width:100%}.hero-script,.hero-brand-lockup{margin-left:auto;margin-right:auto}.hero-brand-lockup{justify-content:center}
  .mina-hero-copy>p{margin-left:auto;margin-right:auto}.hero-topic-pill{justify-content:center}
  .mina-hero-slider .hero-actions{justify-content:center}
  .mina-hero-shade{background:linear-gradient(0deg,rgba(7,6,17,.96),rgba(7,6,17,.62) 57%,rgba(7,6,17,.25))}
  .quick-path-grid{width:min(100% - 40px,720px);grid-template-columns:1fr}
}
@media(max-width:720px){
  .hero-v3.mina-hero-slider{height:650px;min-height:650px;border-radius:18px}
  .mina-hero-content{align-items:flex-end;width:calc(100% - 38px);padding:80px 0 58px}
  .hero-brand-lockup{gap:8px}.hero-brand-lockup strong{font-size:clamp(48px,16vw,68px)}.hero-brand-lockup span{font-size:clamp(17px,5vw,24px);padding-bottom:6px}
  .mina-hero-slider h1{font-size:clamp(36px,11vw,50px)}.mina-hero-copy>p{font-size:14px;line-height:1.6}
  .mina-hero-slide img{object-position:62% center}.mina-hero-arrow{display:none}.mina-hero-dots{bottom:14px}
  .hero-topic-pill{font-size:10px}.mina-hero-slider .hero-actions{display:grid;grid-template-columns:1fr;width:100%}.mina-hero-slider .btn{width:100%}
  .quick-paths{padding-top:16px}.quick-path-grid{width:calc(100% - 28px)}
}
@media(max-width:420px){
  .hero-v3.mina-hero-slider{height:690px;min-height:690px}
  .hero-script{font-size:22px}.hero-topic-pill{gap:5px;padding:8px 9px}
}
@media(prefers-reduced-motion:reduce){.mina-hero-slide,.mina-hero-arrow,.mina-hero-dot{transition:none}.mina-hero-progress span.is-running{animation:none}}


/* =========================================================
   CMS V5 SHARED CATEGORIES — HOME + BLOG
========================================================= */
.home-categories{padding-top:72px;padding-bottom:34px}
.categories-heading{align-items:flex-end}
.home-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.home-category-card{position:relative;display:flex;min-width:0;min-height:190px;flex-direction:column;padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:linear-gradient(145deg,rgba(30,20,57,.96),rgba(11,9,25,.98));box-shadow:0 20px 55px rgba(0,0,0,.28);overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.home-category-card:before{content:"";position:absolute;width:170px;height:170px;right:-65px;top:-70px;border-radius:50%;background:radial-gradient(circle,rgba(255,79,200,.2),transparent 68%);pointer-events:none}
.home-category-card:hover{transform:translateY(-6px);border-color:rgba(255,102,215,.42);box-shadow:0 28px 70px rgba(0,0,0,.38)}
.home-category-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.home-category-card__icon{display:grid;width:48px;height:48px;place-items:center;flex:0 0 48px;border-radius:14px;background:linear-gradient(135deg,#f044cb,#8055ff);font-size:22px;box-shadow:0 10px 26px rgba(186,62,235,.26)}
.home-category-card__count{padding:6px 9px;border:1px solid rgba(98,232,255,.18);border-radius:999px;color:#76e9ff;background:rgba(98,232,255,.08);font-size:11px;font-weight:800}
.home-category-card h3{position:relative;margin:20px 0 13px;font-size:20px;line-height:1.3;letter-spacing:-.025em}
.home-category-children{position:relative;display:flex;flex-wrap:wrap;gap:7px;margin-top:auto}
.home-category-child{max-width:100%;padding:7px 10px;border:1px solid rgba(255,255,255,.09);border-radius:999px;color:#c9c2d9;background:rgba(255,255,255,.035);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:.2s}
.home-category-child:hover{color:#fff;border-color:rgba(255,104,218,.32);background:rgba(255,79,200,.09)}
.home-category-more{color:#ff9ee1;font-size:11px;font-weight:800;padding:7px 2px}
#cat option[data-level="1"]{font-weight:800}
@media(max-width:980px){.home-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.home-categories{padding-top:52px}.home-category-grid{grid-template-columns:1fr}.home-category-card{min-height:170px;padding:20px}}

/* =========================================================
   MINA SOCIAL NETWORK CARDS
   Thay cho khu vực quick-paths cũ trên trang chủ
========================================================= */
.mina-social-section{
  position:relative;
  padding:72px 0 82px;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 15%,rgba(30,180,255,.09),transparent 25%),
    radial-gradient(circle at 88% 75%,rgba(255,47,214,.09),transparent 28%),
    linear-gradient(180deg,#070611 0%,#090716 100%);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.mina-social-heading{
  max-width:720px;
  margin:0 auto 38px;
  text-align:center;
}
.mina-social-heading .eyebrow{
  display:inline-block;
  margin-bottom:10px;
  color:#ff82dc;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
}
.mina-social-heading h2{
  margin:0 0 12px;
  color:#fff;
  font-size:clamp(30px,4vw,46px);
  line-height:1.15;
  font-weight:900;
}
.mina-social-heading p{
  max-width:640px;
  margin:0 auto;
  color:rgba(231,229,245,.72);
  font-size:15px;
  line-height:1.75;
}
.mina-social-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.mina-social-card{
  --social-accent:#70ddff;
  --social-accent-rgb:112,221,255;
  position:relative;
  min-height:310px;
  padding:28px 24px 24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  overflow:hidden;
  color:#fff;
  text-align:center;
  text-decoration:none;
  border:1px solid rgba(var(--social-accent-rgb),.58);
  border-radius:24px;
  background:
    linear-gradient(
      150deg,
      rgba(var(--social-accent-rgb),.09),
      rgba(16,12,34,.92) 42%,
      rgba(8,7,20,.98)
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 20px 45px rgba(0,0,0,.22);
  isolation:isolate;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.mina-social-card::before{
  content:"";
  position:absolute;
  top:0;
  left:17%;
  width:66%;
  height:1px;
  z-index:2;
  opacity:.9;
  background:linear-gradient(90deg,transparent,var(--social-accent),transparent);
}
.mina-social-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%);
  transition:opacity .28s ease;
}
.mina-social-card:hover{
  transform:translateY(-8px);
  border-color:var(--social-accent);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    0 24px 55px rgba(0,0,0,.35),
    0 0 26px rgba(var(--social-accent-rgb),.18);
}
.mina-social-card:hover::after{opacity:1}
.social-card-glow{
  position:absolute;
  top:-90px;
  left:50%;
  width:210px;
  height:180px;
  z-index:-1;
  opacity:.18;
  pointer-events:none;
  border-radius:50%;
  background:var(--social-accent);
  filter:blur(55px);
  transform:translateX(-50%);
  transition:opacity .28s ease;
}
.mina-social-card:hover .social-card-glow{opacity:.3}
.social-icon{
  width:76px;
  height:76px;
  margin-bottom:22px;
  display:grid;
  place-items:center;
  border:1px solid rgba(var(--social-accent-rgb),.42);
  border-radius:22px;
  background:
    linear-gradient(
      145deg,
      rgba(var(--social-accent-rgb),.3),
      rgba(var(--social-accent-rgb),.08)
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 10px 28px rgba(var(--social-accent-rgb),.18);
  transition:transform .28s ease,box-shadow .28s ease;
}
.mina-social-card:hover .social-icon{
  transform:scale(1.06) rotate(-2deg);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.2),
    0 14px 34px rgba(var(--social-accent-rgb),.28);
}
.social-icon svg{
  width:39px;
  height:39px;
  fill:#fff;
  filter:drop-shadow(0 0 8px rgba(var(--social-accent-rgb),.35));
}
.social-card-content{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.social-card-content small{
  margin-bottom:8px;
  color:var(--social-accent);
  font-size:10px;
  line-height:1.4;
  font-weight:900;
  letter-spacing:.12em;
}
.social-card-content strong{
  color:#fff;
  font-size:23px;
  line-height:1.25;
  font-weight:900;
}
.social-card-content p{
  margin:8px 0 0;
  color:rgba(234,231,246,.72);
  font-size:13px;
  font-weight:600;
}
.social-card-button{
  min-width:128px;
  height:40px;
  margin-top:auto;
  padding:0 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:var(--social-accent);
  font-size:12px;
  font-weight:800;
  border:1px solid rgba(var(--social-accent-rgb),.62);
  border-radius:12px;
  background:rgba(var(--social-accent-rgb),.07);
  transition:color .25s ease,background .25s ease,box-shadow .25s ease;
}
.social-card-button b{
  font-size:15px;
  transition:transform .25s ease;
}
.mina-social-card:hover .social-card-button{
  color:#090714;
  background:var(--social-accent);
  box-shadow:0 0 18px rgba(var(--social-accent-rgb),.24);
}
.mina-social-card:hover .social-card-button b{
  transform:translate(2px,-2px);
}
.social-youtube{
  --social-accent:#ff3b55;
  --social-accent-rgb:255,59,85;
}
.social-facebook{
  --social-accent:#4b9dff;
  --social-accent-rgb:75,157,255;
}
.social-tiktok{
  --social-accent:#66f5ff;
  --social-accent-rgb:102,245,255;
}
.social-instagram{
  --social-accent:#ff59d2;
  --social-accent-rgb:255,89,210;
}
@media(max-width:1050px){
  .mina-social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mina-social-card{min-height:290px}
}
@media(max-width:640px){
  .mina-social-section{padding:54px 0 62px}
  .mina-social-heading{
    margin-bottom:28px;
    text-align:left;
  }
  .mina-social-heading p{margin-left:0}
  .mina-social-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .mina-social-card{
    min-height:0;
    padding:20px;
    display:grid;
    grid-template-columns:62px minmax(0,1fr) auto;
    gap:15px;
    align-items:center;
    text-align:left;
    border-radius:19px;
  }
  .social-icon{
    width:62px;
    height:62px;
    margin:0;
    border-radius:18px;
  }
  .social-icon svg{
    width:32px;
    height:32px;
  }
  .social-card-content{align-items:flex-start}
  .social-card-content strong{font-size:19px}
  .social-card-content small{font-size:9px}
  .social-card-content p{margin-top:4px}
  .social-card-button{
    min-width:42px;
    width:42px;
    padding:0;
    font-size:0;
    border-radius:12px;
  }
  .social-card-button b{font-size:17px}
  .mina-social-card:hover{transform:translateY(-3px)}
}

/* FIX SOCIAL ICONS — dùng SVG trực tiếp, không phụ thuộc file ảnh */
.social-icon svg{
  display:block!important;
  width:64px!important;
  height:64px!important;
  max-width:none!important;
  overflow:visible!important;
  filter:none!important;
}
@media(max-width:640px){
  .social-icon svg{
    width:54px!important;
    height:54px!important;
  }
}

/* =========================================================
   NỘI DUNG NỔI BẬT — ẢNH CHUẨN 16:9, KHÔNG KÉO GIÃN
========================================================= */
.featured-content-section{
  position:relative;
  padding:76px 0 88px;
  background:#050512;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.featured-content-heading{
  margin:0 auto 38px;
  text-align:center;
}
.featured-diamonds{
  display:flex;
  justify-content:center;
  gap:24px;
  margin-bottom:12px;
}
.featured-diamonds span{
  width:9px;
  height:9px;
  background:#56f4ff;
  transform:rotate(45deg);
  box-shadow:0 0 12px rgba(86,244,255,.9);
}
.featured-content-heading h2{
  margin:0;
  color:#fff;
  font-size:clamp(28px,3vw,38px);
  line-height:1.15;
  font-weight:900;
  letter-spacing:-.035em;
  text-shadow:0 3px 0 rgba(255,79,200,.22);
}
.featured-content-heading p{
  margin:8px 0 0;
  color:#fff;
  font-size:15px;
  font-weight:700;
}
.featured-content-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:28px;
}
.featured-content-card{
  min-width:0;
  text-align:center;
  transition:transform .25s ease;
}
.featured-content-card:hover{
  transform:translateY(-6px);
}
.featured-content-card img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:cover;
  object-position:center;
  border-radius:13px;
  box-shadow:0 18px 40px rgba(0,0,0,.32);
  image-rendering:auto;
  transition:filter .25s ease,box-shadow .25s ease;
}
.featured-content-card:hover img{
  filter:brightness(1.08);
  box-shadow:0 22px 48px rgba(0,0,0,.42),0 0 20px rgba(255,47,214,.12);
}
.featured-content-card h3{
  margin:14px 0 8px;
  color:#ff38d1;
  font-size:clamp(18px,1.8vw,25px);
  line-height:1.2;
  font-weight:900;
  letter-spacing:-.035em;
  text-shadow:0 0 12px rgba(255,47,209,.28);
}
.featured-content-card p{
  max-width:290px;
  margin:0 auto;
  color:#fff;
  font-size:14px;
  line-height:1.55;
  font-weight:600;
}
@media(max-width:1050px){
  .featured-content-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:640px){
  .featured-content-section{
    padding:58px 0 66px;
  }
  .featured-content-heading{
    margin-bottom:28px;
  }
  .featured-content-grid{
    grid-template-columns:1fr;
    gap:26px;
  }
  .featured-content-card{
    max-width:520px;
    margin:0 auto;
  }
  .featured-content-card h3{
    font-size:22px;
  }
}


/* =========================================================
   MINA POST V6 — FULL ARTICLE LAYOUT
========================================================= */
body[data-page="post"] main{
  padding:38px 0 90px;
}

body[data-page="post"] .post-topbar,
body[data-page="post"] .related-shell{
  display:none;
}

body[data-page="post"] .article-v3{
  width:min(980px,calc(100% - 40px));
  margin:0 auto;
}

.post-v6-shell{
  overflow:hidden;
  border:1px solid rgba(98,232,255,.22);
  border-radius:30px;
  background:linear-gradient(180deg,rgba(24,22,43,.98),rgba(14,13,29,.99));
  box-shadow:0 28px 80px rgba(0,0,0,.38);
}

.post-breadcrumb{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin:28px;
  padding:14px 18px;
  border:1px solid rgba(98,232,255,.24);
  border-radius:18px;
  background:rgba(255,255,255,.025);
  color:#d9d5e8;
  font-size:12px;
  font-weight:700;
}

.post-breadcrumb a:first-child,
.post-breadcrumb a:nth-child(3){
  color:var(--cyan);
}

.post-breadcrumb b{
  color:#706b82;
}

.post-v6-hero{
  padding:0 32px 34px;
}

.post-cover-frame{
  display:grid;
  place-items:center;
  max-width:760px;
  min-height:360px;
  margin:0 auto 30px;
  padding:18px;
  border:1px solid rgba(98,232,255,.28);
  border-radius:25px;
  background:#080716;
  box-shadow:0 18px 55px rgba(0,0,0,.25);
}

.post-v6-cover{
  width:auto;
  max-width:100%;
  max-height:720px;
  object-fit:contain;
  border-radius:16px;
}

.post-v6-intro{
  max-width:820px;
  margin:0 auto;
}

.post-category-pill{
  display:inline-flex;
  padding:8px 14px;
  border:1px solid rgba(98,232,255,.42);
  border-radius:999px;
  background:rgba(98,232,255,.09);
  color:#8ef0ff;
  font-size:12px;
  font-weight:900;
}

.post-v6-intro h1{
  margin:16px 0 8px;
  font-size:clamp(38px,6vw,62px);
  line-height:1.08;
  letter-spacing:-.05em;
  text-shadow:0 0 24px rgba(255,255,255,.13);
}

.post-v6-meta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  color:#d5d0e1;
  font-size:12px;
  font-weight:700;
}

.post-v6-lead{
  margin:20px 0 0;
  color:#c6c0d2;
  font-size:17px;
}

.post-v6-content{
  max-width:860px;
  margin:0 auto;
  padding:0 32px 34px;
  font-size:16px;
  line-height:1.85;
}

.post-v6-content > p{
  color:#f4f2fa;
}

.post-v6-content > img,
.post-v6-content .gallery img{
  width:100%;
  margin:22px 0;
  border-radius:18px;
}

.post-v6-content blockquote{
  margin:24px 0;
  padding:20px 22px;
  border-left:4px solid var(--pink);
  border-radius:0 18px 18px 0;
  background:rgba(255,79,200,.08);
}

.post-prompt-box,
.post-discover-box,
.post-share-box,
.post-author-box,
.post-stats-box,
.post-related-v6,
.post-comments-box,
.post-facebook-box{
  margin:26px 0;
  padding:22px;
  border:1px solid rgba(98,232,255,.24);
  border-radius:22px;
  background:rgba(14,17,39,.78);
}

.post-prompt-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.post-prompt-box span{
  display:block;
  color:var(--cyan);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
}

.post-prompt-box strong{
  display:block;
  margin-top:5px;
}

.post-prompt-box button,
.post-comments-box form button{
  min-height:44px;
  padding:10px 18px;
  border:0;
  border-radius:13px;
  color:#0b0712;
  background:linear-gradient(100deg,var(--cyan),#a58aff,var(--pink));
  font-weight:900;
  cursor:pointer;
}

.post-community-note{
  font-weight:800;
  font-style:italic;
}

.post-facebook-placeholder{
  min-height:175px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  text-align:center;
  border-radius:16px;
  color:#34313d;
  background:#fff;
}

.post-facebook-placeholder span{
  font-size:12px;
  color:#77717f;
}

.post-facebook-actions{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:18px;
}

.post-facebook-actions a{
  min-width:200px;
  padding:11px 18px;
  border-radius:999px;
  text-align:center;
  font-weight:900;
  background:linear-gradient(100deg,#2e7df6,#6a8cff);
  box-shadow:0 10px 24px rgba(46,125,246,.24);
}

.post-facebook-actions a:last-child{
  background:linear-gradient(100deg,#dc44d7,#9d4cff);
}

.post-main-actions{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  margin:24px 0;
  padding-top:20px;
  border-top:1px solid rgba(255,79,200,.2);
}

.post-main-actions a,
.post-main-actions button,
.post-discover-box a{
  min-height:40px;
  padding:9px 15px;
  border:1px solid var(--pink);
  border-radius:12px;
  color:#fff;
  background:rgba(255,255,255,.025);
  font-weight:800;
  cursor:pointer;
}

.post-discover-box{
  border-left:4px solid var(--pink);
  background:linear-gradient(135deg,rgba(52,18,63,.9),rgba(27,17,48,.9));
}

.post-discover-box h2,
.post-share-box h2,
.post-related-v6 h2,
.post-comments-box h2{
  margin:0 0 12px;
  color:#8ef0ff;
  font-size:21px;
}

.post-discover-box p{
  margin:0 0 18px;
}

.post-discover-box > div,
.post-share-box > div{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.post-share-box button{
  min-height:40px;
  padding:9px 16px;
  border:0;
  border-radius:999px;
  color:#090611;
  background:linear-gradient(100deg,#8feaff,#df5de3);
  font-weight:900;
  cursor:pointer;
}

.post-author-box{
  display:flex;
  align-items:center;
  gap:18px;
}

.post-author-box img{
  width:82px;
  height:82px;
  border:2px solid var(--cyan);
  border-radius:18px;
  object-fit:cover;
  box-shadow:0 0 24px rgba(98,232,255,.2);
}

.post-author-box h2{
  margin:0;
  color:#74efff;
  font-size:30px;
}

.post-author-box p{
  margin:5px 0 0;
}

.post-stats-box{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.post-stats-box > div,
.post-stats-box > button{
  min-height:92px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:2px;
  border:1px solid rgba(98,232,255,.32);
  border-radius:17px;
  color:#fff;
  background:#0b0d25;
}

.post-stats-box button{
  font:inherit;
  cursor:pointer;
}

.post-stats-box button[aria-pressed="true"]{
  border-color:var(--pink);
  background:rgba(255,79,200,.11);
}

.post-stats-box strong{
  color:#63eeff;
  font-size:25px;
}

.post-stats-box span{
  font-size:12px;
  font-weight:800;
}

.post-prev-next{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:24px 0;
}

.post-prev-next a,
.post-prev-next .is-empty{
  min-height:76px;
  padding:15px 17px;
  border:1px solid rgba(98,232,255,.28);
  border-radius:17px;
  background:#0d1028;
}

.post-prev-next a:last-child,
.post-prev-next .is-empty:last-child{
  text-align:right;
}

.post-prev-next span{
  display:block;
  font-size:12px;
}

.post-prev-next strong{
  display:block;
  margin-top:4px;
}

.post-prev-next .is-empty{
  opacity:.55;
}

.post-related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.post-related-card{
  overflow:hidden;
  padding:10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  transition:.2s;
}

.post-related-card:hover{
  transform:translateY(-4px);
  border-color:rgba(98,232,255,.42);
}

.post-related-card img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:13px;
}

.post-related-card strong{
  display:block;
  margin-top:9px;
  font-size:13px;
  line-height:1.35;
}

.post-related-card span{
  display:block;
  margin-top:5px;
  color:#6ff0ff;
  font-size:11px;
}

.post-comments-box form{
  display:grid;
  gap:10px;
}

.post-comments-box input,
.post-comments-box textarea{
  width:100%;
  border:1px solid rgba(98,232,255,.35);
  border-radius:14px;
  color:#fff;
  background:#070a1c;
  outline:0;
}

.post-comments-box input{
  height:46px;
  padding:0 14px;
}

.post-comments-box textarea{
  min-height:110px;
  padding:13px 14px;
  resize:vertical;
  font:inherit;
}

.post-comments-box form button{
  justify-self:start;
}

.post-comment-list{
  display:grid;
  gap:10px;
  margin-top:22px;
}

.post-comment-list article{
  padding:14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  background:rgba(255,255,255,.03);
}

.post-comment-list article p{
  margin:5px 0;
}

.post-comment-list article span,
.post-comment-empty{
  color:var(--muted);
  font-size:12px;
}

@media(max-width:760px){
  body[data-page="post"] .article-v3{
    width:min(100% - 22px,980px);
  }

  .post-breadcrumb{
    margin:14px;
  }

  .post-v6-hero,
  .post-v6-content{
    padding-left:16px;
    padding-right:16px;
  }

  .post-cover-frame{
    min-height:260px;
    padding:10px;
  }

  .post-prompt-box,
  .post-author-box{
    align-items:flex-start;
    flex-direction:column;
  }

  .post-stats-box,
  .post-prev-next{
    grid-template-columns:1fr;
  }

  .post-prev-next a:last-child,
  .post-prev-next .is-empty:last-child{
    text-align:left;
  }

  .post-related-grid{
    grid-template-columns:1fr 1fr;
  }

  .post-facebook-actions a{
    width:100%;
    min-width:0;
  }
}

@media(max-width:480px){
  .post-related-grid{
    grid-template-columns:1fr;
  }

  .post-v6-intro h1{
    font-size:36px;
  }

  .post-author-box h2{
    font-size:25px;
  }
}

/* =========================================================
   HOME — Căn giữa tiêu đề khu vực AI Prompt nổi bật
   Chỉ áp dụng cho section .soft-section trên trang chủ.
   Không thay đổi grid card, dữ liệu CMS hoặc JavaScript.
========================================================= */
.soft-section .section-heading{
  position:relative;
  display:block;
  text-align:center;
  margin-bottom:48px;
}

.soft-section .section-heading > div{
  width:min(100%, 820px);
  margin:0 auto;
}

.soft-section .section-heading .eyebrow{
  justify-content:center;
}

.soft-section .section-heading p{
  max-width:760px;
  margin:12px auto 0;
}

.soft-section .section-heading .text-link{
  position:absolute;
  right:0;
  bottom:4px;
}

@media(max-width:900px){
  .soft-section .section-heading{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:38px;
  }

  .soft-section .section-heading .text-link{
    position:static;
  }
}

/* =========================================================
   FIX — 3 NÚT TRONG CARD LUÔN NẰM TRÊN 1 HÀNG NGANG
   Chỉ tác động nhóm .card-actions, không thay đổi CMS/JS.
========================================================= */
@media(max-width:420px){
  .card-actions{
    gap:5px;
  }

  .card-actions a,
  .card-actions button{
    min-height:40px;
    padding:0 4px;
    font-size:10px;
    letter-spacing:-.01em;
  }
}

/* =========================================================
   MINA WIKI SKILL POPUP — CLICK CARD TO VIEW DETAILS
========================================================= */
.wiki-card-v3{cursor:pointer;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.wiki-card-v3:hover,.wiki-card-v3:focus-visible{transform:translateY(-6px);border-color:rgba(255,79,200,.48);box-shadow:0 28px 75px rgba(0,0,0,.46),0 0 0 1px rgba(98,232,255,.12);outline:none}
.wiki-card-v3 .card-body p{display:-webkit-box;min-height:52px;overflow:hidden;color:var(--muted);-webkit-box-orient:vertical;-webkit-line-clamp:2}
.wiki-card-detail-button{width:100%;min-height:42px;margin-top:14px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:linear-gradient(100deg,rgba(255,79,200,.16),rgba(98,232,255,.13));color:#fff;font:inherit;font-size:12px;font-weight:900;cursor:pointer}
body.wiki-modal-open{overflow:hidden}
.wiki-skill-modal[hidden]{display:none}
.wiki-skill-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;opacity:0;transition:opacity .18s ease}
.wiki-skill-modal.is-open{opacity:1}
.wiki-skill-modal__backdrop{position:absolute;inset:0;background:rgba(2,2,8,.82);backdrop-filter:blur(12px)}
.wiki-skill-dialog{position:relative;z-index:1;width:min(940px,100%);max-height:min(760px,calc(100vh - 48px));overflow:auto;border:1px solid rgba(255,255,255,.17);border-radius:28px;background:radial-gradient(circle at 0 0,rgba(255,79,200,.15),transparent 33%),linear-gradient(145deg,#21172f,#11101f 58%,#0b0b17);box-shadow:0 40px 120px rgba(0,0,0,.72),0 0 50px rgba(139,92,255,.14);transform:translateY(18px) scale(.975);transition:transform .2s ease;outline:none}
.wiki-skill-modal.is-open .wiki-skill-dialog{transform:none}
.wiki-skill-close{position:absolute;top:14px;right:14px;z-index:3;display:grid;width:42px;height:42px;place-items:center;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(255,255,255,.07);color:#fff;font-size:27px;line-height:1;cursor:pointer}
.wiki-skill-close:hover{background:rgba(255,79,200,.24)}
.wiki-skill-dialog__grid{display:grid;grid-template-columns:minmax(300px,.88fr) minmax(0,1.22fr);gap:26px;padding:30px}
.wiki-skill-dialog__media{min-height:390px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#090817}
.wiki-skill-dialog__media img{width:100%;height:100%;min-height:390px;object-fit:cover}
.wiki-skill-dialog__content{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:18px 18px 10px 0}
.wiki-skill-label{display:inline-flex;align-self:flex-start;padding:7px 12px;border-radius:999px;background:linear-gradient(100deg,var(--pink),var(--violet),var(--cyan));color:#fff;font-size:11px;font-weight:900}
.wiki-skill-dialog h2{margin:12px 0 10px;font-size:clamp(32px,4vw,49px);line-height:1.05;letter-spacing:-.045em}
.wiki-skill-facts{display:flex;flex-wrap:wrap;gap:8px}
.wiki-skill-facts span,.wiki-skill-rating{padding:7px 10px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.065);color:#eeeaf5;font-size:11px;font-weight:700}
.wiki-skill-rating{display:flex;align-self:flex-start;gap:7px;margin-top:9px}
.wiki-skill-description{margin:17px 0 0;color:#c7c2d2;font-size:14px;line-height:1.75}
.wiki-skill-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}
.wiki-skill-tags span{padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font-size:11px;font-weight:800}
.wiki-skill-primary-actions{margin-top:20px}
.wiki-skill-primary-actions a,.wiki-skill-video-disabled{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:11px 18px;border-radius:14px;background:linear-gradient(100deg,var(--pink),var(--violet),var(--cyan));color:#fff;font-size:13px;font-weight:900;box-shadow:0 12px 30px rgba(139,92,255,.25)}
.wiki-skill-video-disabled{background:rgba(255,255,255,.07);color:var(--muted);box-shadow:none}
.wiki-skill-tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.wiki-skill-tools button{min-height:40px;padding:8px 12px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.055);color:#fff;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
.wiki-skill-tools button:hover,.wiki-skill-tools button.is-liked{border-color:rgba(255,79,200,.44);background:rgba(255,79,200,.14)}
.wiki-skill-navigation{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-top:18px;padding-top:15px;border-top:1px solid rgba(255,255,255,.09)}
.wiki-skill-navigation button{min-height:38px;border:0;border-radius:10px;background:rgba(255,255,255,.07);color:#fff;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
.wiki-skill-navigation button:disabled{opacity:.35;cursor:not-allowed}
.wiki-skill-navigation span{color:var(--muted);font-size:11px;font-weight:800}
@media(max-width:760px){
  .wiki-skill-modal{padding:12px}
  .wiki-skill-dialog{max-height:calc(100vh - 24px);border-radius:22px}
  .wiki-skill-dialog__grid{grid-template-columns:1fr;gap:18px;padding:18px}
  .wiki-skill-dialog__media,.wiki-skill-dialog__media img{min-height:0;aspect-ratio:16/11}
  .wiki-skill-dialog__content{padding:0 2px 4px}
  .wiki-skill-dialog h2{padding-right:46px;font-size:34px}
  .wiki-skill-primary-actions a,.wiki-skill-video-disabled{width:100%}
  .wiki-skill-navigation{grid-template-columns:1fr 1fr}
  .wiki-skill-navigation span{grid-column:1/-1;grid-row:1;text-align:center}
}

/* =========================================================
   MINA HOME — VIDEO MỚI NHẤT
   Chèn sau khu vực Wikipedia Skill Dance trên trang chủ.
========================================================= */
.mina-latest-video-section{
  position:relative;
  overflow:hidden;
  padding:76px 0 88px;
  border-top:1px solid rgba(98,232,255,.1);
  background:
    radial-gradient(circle at 50% 34%,rgba(139,92,255,.15),transparent 34%),
    radial-gradient(circle at 18% 75%,rgba(255,79,200,.08),transparent 28%),
    linear-gradient(180deg,#050411 0%,#080719 58%,#05040d 100%);
}
.mina-latest-video-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);
}
.mina-latest-video-inner{position:relative;z-index:1}
.mina-latest-video-heading{
  max-width:790px;
  margin:0 auto 30px;
  text-align:center;
}
.mina-latest-video-diamonds{
  display:flex;
  justify-content:center;
  gap:27px;
  margin-bottom:14px;
}
.mina-latest-video-diamonds span{
  width:9px;
  height:9px;
  display:block;
  transform:rotate(45deg);
  border-radius:2px;
  background:#56f1ff;
  box-shadow:0 0 8px rgba(86,241,255,.95),0 0 20px rgba(86,241,255,.48);
}
.mina-latest-video-heading h2{
  margin:0;
  color:#fff;
  font-size:clamp(30px,3.6vw,46px);
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.045em;
  text-shadow:0 4px 24px rgba(139,92,255,.24);
}
.mina-latest-video-heading p{
  margin:12px auto 0;
  color:rgba(255,255,255,.72);
  font-size:14px;
  line-height:1.7;
  font-weight:600;
}
.mina-latest-video-card{
  width:min(860px,100%);
  margin:0 auto;
  padding:1px;
  overflow:hidden;
  border-radius:25px;
  background:linear-gradient(120deg,#52e9ff 0%,#9b66ff 48%,#ff54cf 100%);
  box-shadow:
    0 26px 70px rgba(0,0,0,.5),
    0 0 42px rgba(126,90,255,.2),
    0 0 24px rgba(255,79,200,.13);
}
.mina-latest-video-frame{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:24px 24px 0 0;
  background:#05040c;
}
.mina-latest-video-frame iframe{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  border:0;
}
.mina-latest-video-badge{
  position:absolute;
  top:14px;
  right:14px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.3);
  border-radius:999px;
  background:linear-gradient(100deg,#ff4fc8,#8b5cff);
  color:#fff;
  font-size:10px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 8px 24px rgba(255,79,200,.35);
  pointer-events:none;
}
.mina-latest-video-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  min-height:78px;
  padding:14px 18px;
  border-radius:0 0 24px 24px;
  background:linear-gradient(180deg,rgba(21,18,39,.99),rgba(12,10,25,.99));
}
.mina-latest-video-info{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.mina-latest-video-info span{
  color:#91eef9;
  font-size:9px;
  font-weight:900;
  letter-spacing:.14em;
}
.mina-latest-video-info strong{
  color:rgba(255,255,255,.86);
  font-size:12px;
  line-height:1.45;
  font-weight:700;
}
.mina-latest-video-actions a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:11px 18px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:linear-gradient(100deg,#ff43c8 0%,#a45cff 54%,#55dff4 100%);
  color:#fff;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 10px 28px rgba(174,70,220,.28);
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}
.mina-latest-video-actions a b{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:#f0003c;
  font-size:10px;
}
.mina-latest-video-actions a i{font-style:normal}
.mina-latest-video-actions a:hover{
  transform:translateY(-2px);
  filter:brightness(1.1);
  box-shadow:0 14px 34px rgba(174,70,220,.4);
}
@media(max-width:700px){
  .mina-latest-video-section{padding:58px 0 66px}
  .mina-latest-video-heading{margin-bottom:24px}
  .mina-latest-video-heading p br{display:none}
  .mina-latest-video-card{border-radius:20px}
  .mina-latest-video-frame{border-radius:19px 19px 0 0}
  .mina-latest-video-actions{
    align-items:stretch;
    flex-direction:column;
    gap:12px;
    padding:14px;
    border-radius:0 0 19px 19px;
    text-align:center;
  }
  .mina-latest-video-info{align-items:center}
  .mina-latest-video-actions a{width:100%}
  .mina-latest-video-badge{top:10px;right:10px}
}


/* =========================================================
   MINA ENTERPRISE STABLE v6.0.13 — FINAL UI POLISH
   1) Skeleton loading
   2) Premium hover (desktop only)
   3) Mobile polish
   Chỉ bổ sung CSS; không đổi cấu trúc HTML/CMS/Firebase.
========================================================= */

/* ---------- Skeleton loading ---------- */
.mina-skeleton-card{
  min-width:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(25,22,44,.96),rgba(13,12,28,.98));
  box-shadow:0 16px 38px rgba(0,0,0,.22);
}
.mina-skeleton-card--post .mina-skeleton-media{aspect-ratio:4/3}
.mina-skeleton-card--skill .mina-skeleton-media{aspect-ratio:16/8.2}
.mina-skeleton-card--wiki .mina-skeleton-media{aspect-ratio:1/1}
.mina-skeleton-body{padding:17px}
.mina-skeleton-line{height:13px;margin-top:11px;border-radius:999px}
.mina-skeleton-line--title{width:82%;height:20px;margin-top:0}
.mina-skeleton-line--short{width:58%}
.mina-skeleton-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:20px}
.mina-skeleton-actions span{height:42px;border-radius:12px}
.mina-skeleton-shimmer{
  position:relative;
  overflow:hidden;
  background:rgba(255,255,255,.065);
}
.mina-skeleton-shimmer::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-110%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  animation:mina-skeleton-wave 1.35s ease-in-out infinite;
}
@keyframes mina-skeleton-wave{to{transform:translateX(110%)}}

/* ---------- Premium hover: only mouse/trackpad ---------- */
@media (hover:hover) and (pointer:fine){
  :is(.content-card,.home-skill-card,.wiki-card-v3,.social-card,.featured-link-card,.home-category-card){
    --mina-rotate-x:0deg;
    --mina-rotate-y:0deg;
    position:relative;
    transform:perspective(1000px) rotateX(var(--mina-rotate-x)) rotateY(var(--mina-rotate-y));
    transform-style:preserve-3d;
    will-change:transform;
    transition:transform .28s cubic-bezier(.2,.75,.25,1),border-color .28s ease,box-shadow .28s ease;
  }
  :is(.content-card,.home-skill-card,.wiki-card-v3,.social-card,.featured-link-card,.home-category-card)::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:5;
    pointer-events:none;
    border-radius:inherit;
    opacity:0;
    background:radial-gradient(circle at var(--mina-glow-x,50%) var(--mina-glow-y,50%),rgba(98,232,255,.13),transparent 34%);
    transition:opacity .28s ease;
  }
  :is(.content-card,.home-skill-card,.wiki-card-v3,.social-card,.featured-link-card,.home-category-card):hover{
    transform:perspective(1000px) translateY(-6px) rotateX(var(--mina-rotate-x)) rotateY(var(--mina-rotate-y));
    border-color:rgba(111,228,255,.48);
    box-shadow:0 24px 56px rgba(0,0,0,.38),0 0 28px rgba(218,67,207,.1);
  }
  :is(.content-card,.home-skill-card,.wiki-card-v3,.social-card,.featured-link-card,.home-category-card):hover::before{opacity:1}
  :is(.content-card,.home-skill-card,.wiki-card-v3) img{transition:transform .42s ease,filter .42s ease}
  :is(.content-card,.home-skill-card,.wiki-card-v3):hover img{transform:scale(1.035);filter:brightness(1.045) saturate(1.03)}
}

/* Keyboard users */
:is(.content-card,.home-skill-card,.wiki-card-v3,.social-card,.featured-link-card,.home-category-card):focus-within{
  border-color:rgba(98,232,255,.72);
  box-shadow:0 0 0 3px rgba(98,232,255,.1),0 20px 48px rgba(0,0,0,.34);
}

/* ---------- Mobile polish ---------- */
@media(max-width:760px){
  body{font-size:15px}
  .wrap{width:min(100% - 24px,1220px)}
  .nav{min-height:68px;gap:10px}
  .brand{font-size:17px}.brand img{width:42px;height:42px}
  .nav-toggle{width:42px;height:42px}
  .links.open{top:70px;left:10px;right:10px;max-height:calc(100dvh - 84px);overflow:auto}
  .links.open a{min-height:45px;display:flex;align-items:center;justify-content:center}

  .hero-v3.mina-hero-slider{width:calc(100% - 20px);margin-top:14px;border-radius:20px}
  .mina-hero-content{width:calc(100% - 34px);padding-left:0;padding-right:0}
  .mina-hero-copy h1{font-size:clamp(31px,9.5vw,45px);line-height:1.06}
  .mina-hero-copy p{font-size:13px;line-height:1.65}
  .mina-hero-actions{gap:9px}
  .mina-hero-actions .btn{min-height:46px;padding:11px 13px;font-size:12px}
  .btn-hidden-item{min-width:0!important;width:100%!important;height:48px!important;font-size:14px!important;padding:0 14px!important}

  .section{padding:58px 0}
  .section-heading{margin-bottom:22px;gap:12px}
  .section-heading h2{font-size:clamp(30px,9vw,40px)}
  .section-heading p{font-size:13px}
  .content-grid,.home-skill-grid,.wiki-grid-v3{gap:16px}
  .content-card,.home-skill-card,.wiki-card-v3{border-radius:19px}
  .card-body{padding:16px}
  .card-body h3{font-size:18px}
  .card-body p{font-size:13px;line-height:1.6}
  .card-actions{gap:7px;padding-top:14px}
  .card-actions a,.card-actions button{min-height:44px;font-size:12px}

  .home-wiki-search-wrap{margin-bottom:20px}
  .home-wiki-search input{font-size:12px}
  .home-skill-actions{grid-template-columns:1fr 1fr}
  .home-skill-detail,.home-skill-review{min-height:42px;font-size:11px}

  .video-latest-card,.home-video-card{border-radius:20px}
  .footer .footer-grid{grid-template-columns:1fr!important;gap:30px!important;padding-top:38px!important}
  .footer-intro{max-width:none}
  .footer-list{gap:10px}
}

@media(max-width:420px){
  .wrap{width:calc(100% - 18px)}
  .hero-v3.mina-hero-slider{width:calc(100% - 12px);border-radius:17px}
  .mina-hero-content{width:calc(100% - 24px)}
  .card-actions,.latest-posts-section #latest .card-actions{grid-template-columns:1fr!important}
  .latest-posts-section #latest .card-actions > .primary-action{grid-column:auto!important}
  .home-skill-actions{grid-template-columns:1fr}
}

/* Respect accessibility and save battery */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .mina-skeleton-shimmer::after{display:none}
}

/* =========================================================
   MINA POST ENTERPRISE V7 — SAFE VISUAL UPGRADE
   Chỉ mở rộng giao diện trang post, không đổi cấu trúc dữ liệu.
========================================================= */
body[data-page="post"]{
  background:
    radial-gradient(circle at 12% 8%,rgba(255,79,200,.10),transparent 28%),
    radial-gradient(circle at 88% 18%,rgba(98,232,255,.08),transparent 26%),
    var(--bg);
}

.post-reading-progress{
  position:fixed;
  top:0;
  right:0;
  left:0;
  z-index:120;
  height:3px;
  pointer-events:none;
  background:rgba(255,255,255,.05);
}
.post-reading-progress span{
  display:block;
  width:100%;
  height:100%;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,var(--cyan),var(--violet),var(--pink));
  box-shadow:0 0 16px rgba(98,232,255,.55);
  will-change:transform;
}

.post-loading-skeleton{
  display:grid;
  gap:18px;
  padding:32px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:30px;
  background:linear-gradient(180deg,rgba(24,22,43,.96),rgba(14,13,29,.98));
}
.skeleton-line,.skeleton-cover{
  position:relative;
  overflow:hidden;
  display:block;
  border-radius:14px;
  background:rgba(255,255,255,.065);
}
.skeleton-line{height:18px}.skeleton-line--short{width:28%}.skeleton-line--title{width:82%;height:52px}.skeleton-line--medium{width:64%}
.skeleton-cover{width:100%;aspect-ratio:16/9;border-radius:24px}
.skeleton-line:after,.skeleton-cover:after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);
  animation:mina-post-shimmer 1.35s infinite;
}
@keyframes mina-post-shimmer{to{transform:translateX(100%)}}

body[data-page="post"] .article-v3{width:min(1060px,calc(100% - 40px))}
.post-v6-shell{
  position:relative;
  overflow:visible;
  border-color:rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 88% 2%,rgba(255,79,200,.09),transparent 25%),
    linear-gradient(180deg,rgba(24,22,43,.985),rgba(12,11,26,.995));
  box-shadow:0 36px 110px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.02) inset;
}
.post-breadcrumb{margin:24px 28px 20px;background:rgba(7,6,17,.45);backdrop-filter:blur(14px)}
.post-breadcrumb a{transition:color .2s ease}.post-breadcrumb a:hover{color:#fff}

.post-v6-hero{padding:0 38px 40px}
.post-cover-frame{
  position:relative;
  max-width:860px;
  min-height:0;
  margin-bottom:36px;
  padding:12px;
  border-color:rgba(255,255,255,.15);
  background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(7,6,17,.92));
  box-shadow:0 26px 70px rgba(0,0,0,.42),0 0 32px rgba(139,92,255,.08);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.post-cover-frame:hover{transform:translateY(-3px);border-color:rgba(98,232,255,.35);box-shadow:0 34px 85px rgba(0,0,0,.48),0 0 38px rgba(98,232,255,.09)}
.post-v6-cover{max-height:760px;border-radius:18px;cursor:zoom-in}
.post-v6-intro{max-width:880px;text-align:center}
.post-category-pill{box-shadow:0 8px 25px rgba(98,232,255,.08)}
.post-v6-intro h1{max-width:900px;margin:18px auto 14px;font-size:clamp(40px,5.7vw,68px);line-height:1.07;text-wrap:balance}
.post-v6-meta{justify-content:center;gap:9px}
.post-v6-meta span{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.035);
}
.post-v6-lead{max-width:760px;margin:22px auto 0;font-size:18px;line-height:1.8;text-wrap:pretty}

.post-v6-content{max-width:900px;padding:4px 38px 42px;font-size:17px;line-height:1.9}
.post-v6-content > p{margin:0 0 1.35em;color:#eeeaf5}
.post-v6-content > h2,.post-v6-content > h3{scroll-margin-top:110px;letter-spacing:-.035em}
.post-v6-content > h2{margin:46px 0 16px;font-size:clamp(27px,4vw,38px);line-height:1.22;color:#fff}
.post-v6-content > h3{margin:34px 0 12px;font-size:clamp(21px,3vw,27px);line-height:1.3;color:#9eefff}
.post-v6-content > ul,.post-v6-content > ol{margin:20px 0 28px;padding-left:24px}
.post-v6-content > ul li,.post-v6-content > ol li{margin:8px 0;padding-left:5px}
.post-v6-content > ul li::marker{color:var(--pink)}
.post-v6-content > ol li::marker{color:var(--cyan);font-weight:900}
.post-v6-content blockquote{border:1px solid rgba(255,79,200,.16);border-left:4px solid var(--pink);box-shadow:0 16px 34px rgba(0,0,0,.16)}

.post-toc-card{
  margin:0 0 30px;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(98,232,255,.22);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(16,21,46,.92),rgba(20,13,38,.92));
}
.post-toc-card[hidden]{display:none}
.post-toc-title{
  width:100%;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 17px;
  border:0;
  color:#fff;
  background:transparent;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
.post-toc-title span{color:#aaf2ff}.post-toc-title b{font-size:22px;color:#ff9de1}
.post-toc-list{display:grid;gap:4px;padding:0 13px 14px}
.post-toc-list a{padding:9px 11px;border-radius:11px;color:#d8d3e3;font-size:13px;font-weight:700;transition:.2s}
.post-toc-list a:hover{color:#fff;background:rgba(255,255,255,.055);transform:translateX(3px)}
.post-toc-list a.is-sub{padding-left:28px;color:#aaa4b8;font-size:12px}

.post-image-figure{margin:28px 0}.post-image-figure img{margin:0!important}.post-image-figure figcaption{margin-top:9px;color:var(--muted);font-size:12px;text-align:center}
.post-v6-content .gallery{gap:16px;margin:28px 0}
.post-v6-content .gallery img,.post-image-figure img{
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 42px rgba(0,0,0,.28);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.post-v6-content .gallery img:hover,.post-image-figure img:hover{transform:translateY(-3px);border-color:rgba(98,232,255,.34);box-shadow:0 24px 55px rgba(0,0,0,.38)}
.is-lightbox-ready{cursor:zoom-in}
.post-video-frame{overflow:hidden;margin:30px 0;border:1px solid rgba(255,255,255,.12);border-radius:20px;box-shadow:0 22px 55px rgba(0,0,0,.34)}
.post-video-frame iframe{display:block;border-radius:0}

.post-prompt-box,.post-discover-box,.post-share-box,.post-author-box,.post-stats-box,.post-related-v6,.post-comments-box,.post-facebook-box{
  border-color:rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(20,23,48,.88),rgba(18,13,35,.92));
  box-shadow:0 18px 44px rgba(0,0,0,.19);
}
.post-prompt-box{border-color:rgba(98,232,255,.28);background:linear-gradient(135deg,rgba(23,47,67,.86),rgba(51,18,63,.84))}
.post-prompt-box button,.post-comments-box form button{transition:transform .2s ease,box-shadow .2s ease}.post-prompt-box button:hover,.post-comments-box form button:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(139,92,255,.25)}
.post-main-actions a,.post-main-actions button,.post-discover-box a,.post-share-box button{transition:transform .2s ease,filter .2s ease,background .2s ease}
.post-main-actions a:hover,.post-main-actions button:hover,.post-discover-box a:hover,.post-share-box button:hover{transform:translateY(-2px);filter:brightness(1.08)}
.post-related-card{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.post-related-card:hover{box-shadow:0 18px 40px rgba(0,0,0,.28)}

.post-lightbox{
  position:fixed;
  inset:0;
  z-index:250;
  display:grid;
  place-items:center;
  padding:28px;
  background:rgba(3,2,9,.92);
  backdrop-filter:blur(18px);
}
.post-lightbox[hidden]{display:none}
.post-lightbox img{max-width:min(1180px,94vw);max-height:90vh;border-radius:20px;box-shadow:0 35px 100px rgba(0,0,0,.65)}
.post-lightbox__close{position:fixed;top:18px;right:20px;width:48px;height:48px;border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;background:rgba(255,255,255,.08);font-size:31px;cursor:pointer}
body.post-lightbox-open{overflow:hidden}

@media(max-width:760px){
  body[data-page="post"] main{padding-top:18px}
  body[data-page="post"] .article-v3{width:min(100% - 18px,1060px)}
  .post-v6-shell{border-radius:22px}
  .post-breadcrumb{margin:10px;padding:11px 13px;border-radius:14px;font-size:10px}
  .post-v6-hero{padding:0 13px 27px}
  .post-cover-frame{margin-bottom:24px;padding:7px;border-radius:18px}
  .post-v6-cover{border-radius:13px}
  .post-v6-intro h1{font-size:clamp(31px,10vw,44px);text-align:left}
  .post-v6-intro{text-align:left}
  .post-v6-meta{justify-content:flex-start}.post-v6-meta span{font-size:10px;min-height:29px;padding:5px 9px}
  .post-v6-lead{font-size:15px;text-align:left}
  .post-v6-content{padding:0 14px 26px;font-size:16px;line-height:1.82}
  .post-v6-content > h2{margin-top:38px}.post-v6-content .gallery{grid-template-columns:1fr}
  .post-toc-card{margin-bottom:24px}.post-toc-title{min-height:50px;padding:11px 14px}.post-toc-list{padding:0 10px 11px}
  .post-prompt-box{gap:14px}.post-prompt-box button{width:100%}
  .post-related-grid{grid-template-columns:1fr}
  .post-lightbox{padding:12px}.post-lightbox img{max-width:96vw;max-height:86vh;border-radius:14px}
  .post-loading-skeleton{padding:14px;border-radius:22px}.skeleton-line--title{height:38px}
}

@media(prefers-reduced-motion:reduce){
  .skeleton-line:after,.skeleton-cover:after{animation:none}
  .post-cover-frame,.post-related-card,.post-main-actions a,.post-main-actions button,.post-discover-box a,.post-share-box button,.post-v6-content img{transition:none!important}
}

/* =========================================================
   MINA UI FIX V7.1 — BLOG COMPACT + CARD BUTTONS + POST FOOTER
   Chỉ tinh chỉnh giao diện, không thay đổi CMS/Firestore/JS.
========================================================= */

/* 1) Thu gọn phần giới thiệu đầu trang Blog */
body[data-page="blog"] .page-hero-v3,
.blog-page-hero{
  padding:64px 0 52px;
  min-height:0;
}
body[data-page="blog"] .page-hero-v3 h1,
.blog-page-hero h1{
  max-width:720px;
  margin:12px 0 14px;
  font-size:clamp(42px,5.2vw,62px);
  line-height:1.02;
  letter-spacing:-.055em;
}
body[data-page="blog"] .page-hero-v3 p,
.blog-page-hero p{
  max-width:760px;
  margin:0;
  font-size:16px;
  line-height:1.7;
}
body[data-page="blog"] .page-hero-v3 .eyebrow,
.blog-page-hero .eyebrow{
  font-size:11px;
  letter-spacing:.14em;
}

/* Khung tìm kiếm gọn và cân đối hơn */
body[data-page="blog"] .library-toolbar{
  top:88px;
  gap:10px;
  margin-bottom:12px;
  padding:10px;
  border-radius:17px;
  box-shadow:0 16px 42px rgba(0,0,0,.22);
}
body[data-page="blog"] .search-field input,
body[data-page="blog"] .library-toolbar select{
  height:46px;
  border-radius:12px;
}
body[data-page="blog"] .type-chips{
  gap:7px;
}
body[data-page="blog"] .type-chips button{
  min-height:34px;
  padding:7px 12px;
  font-size:10px;
}
body[data-page="blog"] .result-count{
  margin:10px 0 17px;
}

/* 2) Màu nút card rõ chức năng, không còn đồng màu tối */
.card-actions{
  gap:8px;
}
.card-actions a,
.card-actions button{
  border-color:rgba(255,255,255,.13);
  transition:transform .2s ease,filter .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.card-actions a:hover,
.card-actions button:hover{
  transform:translateY(-2px);
  filter:brightness(1.08);
}
.card-actions .primary-action{
  border:0;
  color:#fff;
  background:linear-gradient(105deg,#ff43c6 0%,#8758ff 100%);
  box-shadow:0 9px 22px rgba(209,65,224,.22);
}
.card-actions button[data-copy-post]{
  color:#dffbff;
  border-color:rgba(98,232,255,.34);
  background:linear-gradient(135deg,rgba(25,121,158,.34),rgba(31,65,118,.38));
}
.card-actions .create-image-action{
  color:#16091c;
  border:0;
  background:linear-gradient(105deg,#65eaff 0%,#a78bfa 52%,#ff79d5 100%);
  box-shadow:0 9px 22px rgba(98,232,255,.16);
}

/* Card chỉ có 2 nút vẫn chia đều, card 3 nút không bị lệch */
.card-actions > *{
  min-width:0;
}

/* 3) Footer trang Post đồng bộ kiểu liên hệ trang chủ */
body[data-page="post"] .footer{
  padding:0;
  border-top:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 12% 20%,rgba(255,79,200,.08),transparent 27%),
    linear-gradient(180deg,#070611 0%,#05040c 100%);
}
body[data-page="post"] .post-footer-grid{
  display:grid;
  grid-template-columns:minmax(250px,1.35fr) repeat(3,minmax(150px,.75fr));
  gap:38px;
  padding:54px 0 38px;
}
body[data-page="post"] .post-footer-brand h2{
  margin:0;
  font-size:29px;
  line-height:1.1;
  letter-spacing:-.04em;
  background:linear-gradient(90deg,#fff,#ffafe8 55%,#68e8ff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
body[data-page="post"] .post-footer-slogan{
  margin:12px 0 8px;
  color:#fff;
  font-size:13px;
  font-weight:800;
}
body[data-page="post"] .post-footer-desc{
  max-width:410px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}
body[data-page="post"] .post-footer-column{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}
body[data-page="post"] .post-footer-column h3{
  margin:0 0 5px;
  color:#fff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.09em;
}
body[data-page="post"] .post-footer-column a,
body[data-page="post"] .post-footer-contact-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  max-width:100%;
  color:#c8c3d4;
  font-size:12px;
  line-height:1.55;
  transition:color .2s ease,transform .2s ease;
}
body[data-page="post"] .post-footer-column a:hover{
  color:#fff;
  transform:translateX(3px);
}
body[data-page="post"] .post-footer-contact-row a{
  overflow-wrap:anywhere;
}
body[data-page="post"] .copyright{
  margin-top:0;
  padding:20px 0 24px;
  border-top:1px solid rgba(255,255,255,.08);
}

@media(max-width:900px){
  body[data-page="post"] .post-footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px;
  }
  body[data-page="post"] .post-footer-brand{
    grid-column:1/-1;
  }
}

@media(max-width:720px){
  body[data-page="blog"] .page-hero-v3,
  .blog-page-hero{
    padding:48px 0 38px;
  }
  body[data-page="blog"] .page-hero-v3 h1,
  .blog-page-hero h1{
    font-size:clamp(36px,11vw,49px);
  }
  body[data-page="blog"] .page-hero-v3 p,
  .blog-page-hero p{
    font-size:14px;
  }
  body[data-page="blog"] .library-toolbar{
    top:76px;
    padding:8px;
  }
  .card-actions{
    gap:6px;
  }
  .card-actions a,
  .card-actions button{
    min-height:42px;
    padding:0 7px;
    font-size:11px;
  }
  body[data-page="post"] .post-footer-grid{
    grid-template-columns:1fr;
    gap:27px;
    padding:40px 0 30px;
  }
  body[data-page="post"] .post-footer-brand{
    grid-column:auto;
  }
}


/* =========================================================
   MINA BLOG FOOTER FIX V7.2
   Đồng bộ footer Blog với Trang chủ; không đổi CMS/JS.
========================================================= */
html{scroll-behavior:smooth}
#lien-he{scroll-margin-top:96px}
.links .nav-contact-link{color:#8ff2ff}
.links .nav-contact-link:hover,.links .nav-contact-link:focus-visible{color:#fff;text-shadow:0 0 12px rgba(98,232,255,.55)}

.footer{
  padding:0;
  border-top:1px solid rgba(92,214,255,.14);
  background:
    radial-gradient(circle at 15% 10%,rgba(225,62,204,.08),transparent 28%),
    radial-gradient(circle at 85% 15%,rgba(68,213,255,.07),transparent 28%),
    #060512;
}
.footer .footer-grid{
  display:grid;
  grid-template-columns:1.35fr .9fr .9fr 1.25fr;
  gap:42px;
  align-items:start;
  padding-top:48px;
  padding-bottom:38px;
}
.footer-brand{display:inline-flex;margin-bottom:14px}
.footer-intro{max-width:340px;margin:0;color:rgba(255,255,255,.68);font-size:14px;line-height:1.8}
.footer-title{margin:4px 0 16px;color:#fff;font-size:16px;line-height:1.3;font-weight:900;letter-spacing:.02em}
.footer-list{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.footer-list a,.footer-contact-item{display:flex;align-items:flex-start;gap:10px;color:rgba(255,255,255,.76);font-size:13px;line-height:1.55;font-weight:600;text-decoration:none;transition:color .2s ease,transform .2s ease}
.footer-list a:hover{color:#fff;transform:translateX(3px)}
.footer-icon{flex:0 0 auto;width:20px;text-align:center;color:#78eaff;filter:drop-shadow(0 0 7px rgba(72,222,255,.35))}
.footer-contact-item strong{color:#fff;font-weight:700;word-break:break-word}
.footer-contact-item a{color:#fff;text-decoration:none;word-break:break-word}
.footer-contact-item a:hover{color:#91f3ff}
.footer .copyright{margin-top:0;padding-top:18px;padding-bottom:22px;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.5);font-size:12px;text-align:center}

@media(max-width:980px){
  .footer .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 28px}
}
@media(max-width:620px){
  .footer .footer-grid{grid-template-columns:1fr;gap:28px;padding-top:38px;padding-bottom:30px}
  .footer-intro{max-width:none}
}


/* =========================================================
   MINA WIKI v7.5 — ADVANCED FILTERS
   Level 6–11 cố định + 4K/8K + Style + BPM.
========================================================= */
body[data-page="wiki"] .wiki-toolbar-advanced{
  grid-template-columns:minmax(320px,1.65fr) repeat(4,minmax(135px,.62fr)) auto;
  gap:10px;
  align-items:center;
  top:88px;
  padding:10px;
}
body[data-page="wiki"] .wiki-toolbar-advanced .wiki-search-main{min-width:0}
body[data-page="wiki"] .wiki-toolbar-advanced select{
  min-width:0;
  height:48px;
  padding:0 34px 0 13px;
  border-color:rgba(255,255,255,.13);
  background-color:#0b0919;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
body[data-page="wiki"] .wiki-toolbar-advanced select:hover,
body[data-page="wiki"] .wiki-toolbar-advanced select:focus{
  border-color:rgba(98,232,255,.62);
  box-shadow:0 0 0 3px rgba(98,232,255,.08);
  outline:none;
}
.wiki-filter-reset{
  display:none;
  height:48px;
  padding:0 16px;
  border:1px solid rgba(255,79,200,.32);
  border-radius:13px;
  background:linear-gradient(135deg,rgba(255,79,200,.16),rgba(139,92,255,.16));
  color:#fff;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  cursor:pointer;
}
.wiki-filter-reset.is-visible{display:inline-flex;align-items:center;justify-content:center}
.wiki-filter-reset:hover{border-color:rgba(255,79,200,.72);filter:brightness(1.1)}
.wiki-filter-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 2px 18px;
  color:var(--muted);
  font-size:11px;
}
.wiki-filter-summary strong{color:#c7f8ff;font-weight:900}
.wiki-filter-summary strong:before{
  content:"";
  display:inline-block;
  width:6px;height:6px;margin-right:8px;border-radius:50%;
  background:var(--cyan);box-shadow:0 0 10px rgba(98,232,255,.8);
}
.wiki-filter-summary span{text-align:right}
@media(max-width:1180px){
  body[data-page="wiki"] .wiki-toolbar-advanced{
    grid-template-columns:minmax(280px,1fr) repeat(2,minmax(150px,.45fr));
  }
  body[data-page="wiki"] .wiki-toolbar-advanced .wiki-search-main{grid-column:1/-1}
  .wiki-filter-reset{width:100%}
}
@media(max-width:720px){
  body[data-page="wiki"] .wiki-toolbar-advanced{
    position:static;
    grid-template-columns:1fr 1fr;
    padding:9px;
  }
  body[data-page="wiki"] .wiki-toolbar-advanced .wiki-search-main{grid-column:1/-1}
  body[data-page="wiki"] .wiki-toolbar-advanced select,
  .wiki-filter-reset{width:100%}
  .wiki-filter-summary{align-items:flex-start;flex-direction:column;gap:5px}
  .wiki-filter-summary span{text-align:left}
}
@media(max-width:480px){
  body[data-page="wiki"] .wiki-toolbar-advanced{grid-template-columns:1fr}
  body[data-page="wiki"] .wiki-toolbar-advanced .wiki-search-main{grid-column:auto}
}


/* =========================================================
   MINA MODULE IDENTITY V8.1
   Game Gear menu + hero riêng cho từng module.
========================================================= */
.module-hero{isolation:isolate}
.module-hero:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(110deg,rgba(255,255,255,.025),transparent 42%)}
.module-hero--blog{background:linear-gradient(120deg,#070611 0%,#23102d 58%,#32122b 100%)}
.module-hero--prompt{background:linear-gradient(120deg,#070611 0%,#28102e 50%,#50204d 100%)}
.module-hero--mix{background:linear-gradient(120deg,#080611 0%,#22112e 52%,#3c183d 100%)}
.module-hero--academy{background:linear-gradient(120deg,#070611 0%,#15182d 52%,#35204a 100%)}
.module-hero--gear{background:linear-gradient(120deg,#070611 0%,#101d2d 52%,#17364a 100%)}
.module-hero--prompt:after{background:radial-gradient(circle,rgba(255,79,200,.30),transparent 68%)}
.module-hero--mix:after{background:radial-gradient(circle,rgba(172,110,255,.27),transparent 68%)}
.module-hero--academy:after{background:radial-gradient(circle,rgba(120,112,255,.24),transparent 68%)}
.module-hero--gear:after{background:radial-gradient(circle,rgba(68,220,255,.25),transparent 68%)}
body[data-module="game-gear"] .category-sidebar{--module-accent:#53d8f3}
@media(min-width:1100px){.topbar .links{gap:4px}.topbar .links>a{padding:10px 11px;font-size:13px}}
@media(max-width:1220px) and (min-width:901px){.topbar .links>a{padding:9px 8px;font-size:12px}.header-cta{padding-inline:14px}}

/* =========================================================
   WIKI ENTERPRISE V2 — Pagination
   12 / 24 / 36 / 48 Skill mỗi trang, URL giữ bộ lọc & trang.
========================================================= */
.wiki-filter-summary{
  flex-wrap:wrap;
}
.wiki-page-size{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}
.wiki-page-size select{
  height:38px;
  min-width:112px;
  padding:0 34px 0 12px;
  border:1px solid rgba(98,232,255,.24);
  border-radius:11px;
  background:#101024;
  color:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.wiki-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin:30px 0 8px;
  padding:16px;
  border:1px solid rgba(150,120,255,.18);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(18,17,42,.9),rgba(10,10,26,.94));
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.wiki-pagination[hidden]{display:none!important}
.wiki-pagination button,
.wiki-page-numbers button{
  min-width:42px;
  height:42px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(255,255,255,.035);
  color:#e9e8f5;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.wiki-pagination button:hover:not(:disabled),
.wiki-page-numbers button:hover:not(:disabled){
  transform:translateY(-2px);
  border-color:rgba(98,232,255,.52);
  background:rgba(98,232,255,.09);
}
.wiki-pagination button:disabled{
  opacity:.38;
  cursor:not-allowed;
}
.wiki-page-numbers{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  justify-content:center;
  gap:7px;
}
.wiki-page-numbers button.is-active{
  border-color:rgba(255,91,213,.75);
  background:linear-gradient(135deg,#ff43c8,#8b5cff);
  box-shadow:0 0 18px rgba(192,73,255,.28);
  color:#fff;
}
.wiki-page-gap{
  min-width:22px;
  text-align:center;
  color:var(--muted);
  font-weight:900;
}
.wiki-go-page{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:8px;
  padding-left:14px;
  border-left:1px solid rgba(255,255,255,.1);
}
.wiki-go-page label{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.wiki-go-page input{
  width:68px;
  height:42px;
  padding:0 8px;
  border:1px solid rgba(98,232,255,.24);
  border-radius:11px;
  background:#0c0c1d;
  color:#fff;
  text-align:center;
  font-weight:900;
  outline:none;
}
.wiki-go-page input:focus{
  border-color:rgba(98,232,255,.7);
  box-shadow:0 0 0 3px rgba(98,232,255,.08);
}
.wiki-go-page button{min-width:48px}
@media(max-width:760px){
  .wiki-filter-summary{gap:10px}
  .wiki-page-size{order:3;margin-left:0;width:100%;justify-content:flex-start}
  .wiki-pagination{gap:8px;padding:12px 9px}
  .wiki-pagination>button{flex:1;min-width:104px}
  .wiki-page-numbers{order:3;width:100%}
  .wiki-go-page{order:4;width:100%;margin-left:0;padding:12px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.08);justify-content:center}
}
@media(max-width:420px){
  .wiki-page-numbers button{min-width:38px;height:38px;padding:0 10px}
  .wiki-go-page label{display:none}
}

/* =========================================================
   MINA POST IMAGE VIEWER V7.2 — COMPACT DESKTOP + ZOOM
   Chỉ tác động ảnh trong trang bài viết.
   ========================================================= */
@media (min-width: 761px){
  body[data-page="post"] .post-cover-frame{
    width:fit-content;
    max-width:min(860px,100%);
    margin-left:auto;
    margin-right:auto;
  }

  body[data-page="post"] .post-v6-cover{
    display:block;
    width:auto;
    max-width:100%;
    max-height:min(720px,72vh);
    margin:0 auto;
    object-fit:contain;
  }

  body[data-page="post"] .post-image-figure{
    position:relative;
    width:100%;
    text-align:center;
  }

  body[data-page="post"] .post-image-figure img{
    display:block;
    width:auto!important;
    max-width:min(760px,100%)!important;
    max-height:78vh;
    margin:0 auto!important;
    object-fit:contain;
  }

  body[data-page="post"] .post-v6-content .gallery img{
    width:100%!important;
    max-height:560px;
    object-fit:contain;
  }
}

body[data-page="post"] .post-image-figure::after{
  content:"🔍 Nhấn để xem lớn";
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:2;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:#fff;
  background:rgba(6,5,18,.72);
  box-shadow:0 8px 24px rgba(0,0,0,.32);
  backdrop-filter:blur(10px);
  font-size:11px;
  font-weight:800;
  pointer-events:none;
  opacity:0;
  transform:translateY(5px);
  transition:opacity .2s ease,transform .2s ease;
}
body[data-page="post"] .post-image-figure:hover::after{
  opacity:1;
  transform:translateY(0);
}

.post-lightbox{
  overflow:hidden;
  touch-action:none;
  user-select:none;
}
.post-lightbox img{
  display:block;
  transform:translate3d(0,0,0) scale(1);
  transform-origin:center center;
  transition:transform .16s ease;
  cursor:zoom-in;
  will-change:transform;
}
.post-lightbox.is-zoomed img{
  cursor:grab;
  transition:none;
}
.post-lightbox.is-dragging img{cursor:grabbing}
.post-lightbox__toolbar{
  position:fixed;
  left:50%;
  bottom:20px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(10,8,24,.76);
  box-shadow:0 18px 45px rgba(0,0,0,.4);
  backdrop-filter:blur(14px);
  transform:translateX(-50%);
}
.post-lightbox__toolbar button,
.post-lightbox__zoom-value{
  min-width:40px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#fff;
  background:rgba(255,255,255,.07);
  font:inherit;
  font-size:16px;
  font-weight:900;
}
.post-lightbox__toolbar button{cursor:pointer}
.post-lightbox__toolbar button:hover{background:rgba(255,255,255,.14)}
.post-lightbox__zoom-value{min-width:64px;padding:0 11px;font-size:12px}
.post-lightbox__hint{
  position:fixed;
  top:22px;
  left:50%;
  z-index:2;
  padding:7px 12px;
  border-radius:999px;
  color:rgba(255,255,255,.8);
  background:rgba(8,7,20,.62);
  font-size:11px;
  font-weight:700;
  transform:translateX(-50%);
  pointer-events:none;
}

@media(max-width:760px){
  body[data-page="post"] .post-image-figure::after{display:none}
  .post-lightbox__toolbar{bottom:12px}
  .post-lightbox__hint{top:14px;max-width:calc(100vw - 100px);text-align:center}
}


/* =========================================================
   MINA v6.0.2 — RICH CONTENT DISPLAY
   ========================================================= */
.article-v3 .post-rich-block{margin:0 0 22px;line-height:1.8;overflow-wrap:anywhere;border-radius:12px}
.article-v3 .post-rich-block h2,.article-v3 .post-rich-block--h2{margin:34px 0 16px;font-size:clamp(25px,3vw,34px);line-height:1.3;font-weight:900;color:#fff}
.article-v3 .post-rich-block h3,.article-v3 .post-rich-block--h3{margin:28px 0 14px;font-size:clamp(21px,2.5vw,28px);line-height:1.35;font-weight:850;color:#fff}
.article-v3 .post-rich-block h4,.article-v3 .post-rich-block--h4{margin:24px 0 12px;font-size:clamp(18px,2vw,23px);line-height:1.4;font-weight:800;color:#fff}
.article-v3 .post-rich-block p{margin:0 0 16px}
.article-v3 .post-rich-block ul,.article-v3 .post-rich-block ol{margin:12px 0 20px;padding-left:1.65em}
.article-v3 .post-rich-block li{margin:7px 0}
.article-v3 .post-rich-block a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}
.article-v3 .post-rich-block blockquote{margin:22px 0;padding:16px 20px;border-left:4px solid var(--pink);border-radius:0 14px 14px 0;background:rgba(255,79,200,.08)}
.article-v3 .post-rich-block hr{border:0;border-top:1px solid rgba(255,255,255,.16);margin:30px 0}
.article-v3 .post-rich-block pre,.article-v3 .post-rich-block code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.article-v3 .post-rich-block pre{overflow:auto;padding:16px;border-radius:14px;background:#080919}
@media(max-width:760px){.article-v3 .post-rich-block{font-size:min(100%,18px)!important;text-align:left!important}.article-v3 .post-rich-block--h2,.article-v3 .post-rich-block--h3,.article-v3 .post-rich-block--h4{text-align:left!important}}


/* =========================================================
   MINA POST UI V7.2 — VIDEO CARD RIÊNG CHO TRANG BÀI VIẾT
   Sao chép phong cách video trang chủ nhưng dùng class độc lập.
   Không tác động Home, Wiki, Blog card hoặc dữ liệu CMS.
========================================================= */
body[data-page="post"] .post-video-card{
  width:100%;
  margin:32px 0;
  padding:1px;
  overflow:hidden;
  border-radius:23px;
  background:linear-gradient(120deg,#52e9ff 0%,#9b66ff 48%,#ff54cf 100%);
  box-shadow:0 24px 62px rgba(0,0,0,.44),0 0 32px rgba(126,90,255,.16);
}
body[data-page="post"] .post-video-frame{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  margin:0;
  overflow:hidden;
  border:0;
  border-radius:22px 22px 0 0;
  background:#05040c;
  box-shadow:none;
}
body[data-page="post"] .post-video-frame iframe{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  border:0;
  border-radius:0;
}

/* Facebook Video — SDK trước, iframe plugin dự phòng; tỷ lệ lấy từ iframe thật */
body[data-page="post"] .post-video-card--facebook .post-video-frame--facebook{
  aspect-ratio:var(--facebook-video-ratio,16/9);
  min-height:260px;
  transition:aspect-ratio .2s ease;
  background:#05040c;
}
body[data-page="post"] .post-video-frame--facebook .fb-video{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
}
body[data-page="post"] .post-video-frame--facebook .fb-video > span{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
}
body[data-page="post"] .post-video-frame--facebook iframe{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  border:0!important;
  background:#05040c;
}
body[data-page="post"] .post-video-frame--facebook .post-facebook-fallback-link{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding:24px;
  color:#fff;
  background:#05040c;
  text-align:center;
  font-weight:800;
}
body[data-page="post"] .post-video-frame--facebook.has-facebook-iframe .post-facebook-fallback-link{
  display:none!important;
}
@media(max-width:640px){
  body[data-page="post"] .post-video-card--facebook .post-video-frame--facebook{
    min-height:190px;
  }
}

/* TikTok Video — khung dọc 9:16, giới hạn chiều rộng để không bị phóng quá lớn */
body[data-page="post"] .post-video-card--tiktok{
  width:min(100%,460px);
  margin:32px auto;
}
body[data-page="post"] .post-video-card--tiktok .post-video-frame--tiktok{
  width:100%;
  aspect-ratio:9/16;
}
body[data-page="post"] .post-video-card--tiktok .post-video-frame--tiktok iframe{
  width:100%;
  height:100%;
}
body[data-page="post"] .post-video-card--tiktok .post-video-actions{
  gap:10px;
}
body[data-page="post"] .post-video-card--tiktok .post-video-info strong{
  max-width:190px;
}
body[data-page="post"] .post-tiktok-link-fallback{
  position:relative;
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:34px 24px;
  border-radius:22px;
  background:linear-gradient(160deg,#090816,#151126);
  text-align:center;
}
body[data-page="post"] .post-tiktok-link-fallback strong{
  font-size:18px;
}
body[data-page="post"] .post-tiktok-link-fallback p{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
body[data-page="post"] .post-tiktok-link-fallback a{
  display:inline-flex;
  min-height:42px;
  align-items:center;
  justify-content:center;
  padding:9px 16px;
  border-radius:999px;
  background:linear-gradient(100deg,#25f4ee,#fe2c55);
  color:#080712;
  font-size:12px;
  font-weight:900;
}
@media(max-width:520px){
  body[data-page="post"] .post-video-card--tiktok{width:100%}
  body[data-page="post"] .post-video-card--tiktok .post-video-actions{flex-direction:column;align-items:stretch}
  body[data-page="post"] .post-video-card--tiktok .post-video-info strong{max-width:none}
  body[data-page="post"] .post-video-card--tiktok .post-video-actions a{width:100%}
}
body[data-page="post"] .post-video-badge{
  position:absolute;
  top:13px;
  right:13px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.3);
  border-radius:999px;
  background:linear-gradient(100deg,#ff4fc8,#8b5cff);
  color:#fff;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 8px 22px rgba(255,79,200,.32);
  pointer-events:none;
}
body[data-page="post"] .post-video-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:76px;
  padding:14px 17px;
  border-radius:0 0 22px 22px;
  background:linear-gradient(180deg,rgba(21,18,39,.99),rgba(12,10,25,.99));
}
body[data-page="post"] .post-video-info{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
body[data-page="post"] .post-video-info span{
  color:#91eef9;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}
body[data-page="post"] .post-video-info strong{
  overflow:hidden;
  color:rgba(255,255,255,.88);
  font-size:12px;
  line-height:1.45;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body[data-page="post"] .post-video-actions a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:45px;
  padding:10px 17px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:linear-gradient(100deg,#ff43c8 0%,#a45cff 54%,#55dff4 100%);
  color:#fff;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 10px 26px rgba(174,70,220,.26);
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}
body[data-page="post"] .post-video-actions a b{
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  color:#f0003c;
  font-size:9px;
}
body[data-page="post"] .post-video-actions a i{font-style:normal}
body[data-page="post"] .post-video-actions a:hover{
  transform:translateY(-2px);
  filter:brightness(1.1);
  box-shadow:0 14px 32px rgba(174,70,220,.38);
}

@media(max-width:700px){
  body[data-page="post"] .post-video-card{margin:26px 0;border-radius:19px}
  body[data-page="post"] .post-video-frame{border-radius:18px 18px 0 0}
  body[data-page="post"] .post-video-actions{
    align-items:stretch;
    flex-direction:column;
    gap:11px;
    min-height:0;
    padding:13px;
    border-radius:0 0 18px 18px;
    text-align:center;
  }
  body[data-page="post"] .post-video-info{align-items:center}
  body[data-page="post"] .post-video-info strong{max-width:100%;white-space:normal}
  body[data-page="post"] .post-video-actions a{width:100%}
  body[data-page="post"] .post-video-badge{top:10px;right:10px}
}


/* =========================================================
   MINA WIKI ENTERPRISE UI V4 — PREVIEW SAFE
   Chỉ tác động body[data-page="wiki"]; không đổi API/CMS.
========================================================= */
body[data-page="wiki"] .wiki-page-hero{
  padding:72px 0 58px;
  background:
    radial-gradient(circle at 78% 20%,rgba(98,232,255,.14),transparent 30%),
    radial-gradient(circle at 18% 15%,rgba(255,79,200,.12),transparent 28%),
    linear-gradient(120deg,#070611,#15112c 56%,#0c2230);
}
body[data-page="wiki"] .wiki-page-hero .wrap{position:relative;z-index:2}
body[data-page="wiki"] .wiki-page-hero h1{
  max-width:760px;
  margin:12px 0 14px;
  font-size:clamp(42px,5.3vw,68px);
}
body[data-page="wiki"] .wiki-page-hero p{margin:0;max-width:650px}
body[data-page="wiki"] .section{padding-top:34px}

body[data-page="wiki"] .wiki-toolbar-advanced{
  top:88px;
  border-color:rgba(139,92,255,.24);
  background:linear-gradient(135deg,rgba(16,13,37,.95),rgba(10,10,25,.92));
  box-shadow:0 18px 55px rgba(0,0,0,.26),0 0 0 1px rgba(255,255,255,.02) inset;
}
body[data-page="wiki"] .wiki-toolbar-advanced:focus-within{
  border-color:rgba(98,232,255,.33);
  box-shadow:0 18px 55px rgba(0,0,0,.28),0 0 0 3px rgba(98,232,255,.045);
}
body[data-page="wiki"] .wiki-toolbar-advanced input,
body[data-page="wiki"] .wiki-toolbar-advanced select{
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
body[data-page="wiki"] .wiki-toolbar-advanced input:hover,
body[data-page="wiki"] .wiki-toolbar-advanced select:hover{background:#0f0d20}

body[data-page="wiki"] .wiki-filter-summary{
  min-height:50px;
  margin:0 2px 20px;
  padding:8px 2px;
}
.wiki-summary-controls{display:flex;align-items:center;gap:10px;margin-left:auto}
.wiki-sort-control,.wiki-page-size{display:flex;align-items:center;gap:8px}
.wiki-sort-control label,.wiki-page-size label{color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap}
.wiki-sort-control select,.wiki-page-size select{
  height:40px;
  min-width:148px;
  padding:0 34px 0 12px;
  border:1px solid rgba(98,232,255,.22);
  border-radius:12px;
  background:#101024;
  color:#fff;
  font-size:11px;
  font-weight:850;
  cursor:pointer;
  outline:none;
}
.wiki-page-size select{min-width:112px}
.wiki-sort-control select:focus,.wiki-page-size select:focus{
  border-color:rgba(98,232,255,.7);
  box-shadow:0 0 0 3px rgba(98,232,255,.08);
}

body[data-page="wiki"] .wiki-grid-v3{
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:stretch;
  gap:20px;
}
body[data-page="wiki"] .wiki-grid-v3.is-single{
  grid-template-columns:minmax(290px,380px);
  justify-content:center;
}
body[data-page="wiki"] .wiki-grid-v3.is-sparse{
  grid-template-columns:repeat(auto-fit,minmax(290px,360px));
  justify-content:center;
}

body[data-page="wiki"] .wiki-card-v3{
  position:relative;
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.11);
  border-radius:24px;
  background:
    radial-gradient(circle at var(--mina-glow-x,50%) var(--mina-glow-y,20%),rgba(139,92,255,.09),transparent 38%),
    linear-gradient(180deg,#19152f,#100e21);
  box-shadow:0 24px 65px rgba(0,0,0,.34);
  transform:perspective(900px) rotateX(var(--mina-rotate-x,0deg)) rotateY(var(--mina-rotate-y,0deg));
  transform-style:preserve-3d;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
  outline:none;
}
body[data-page="wiki"] .wiki-card-v3:hover,
body[data-page="wiki"] .wiki-card-v3:focus-visible{
  border-color:rgba(255,79,200,.46);
  box-shadow:0 30px 78px rgba(0,0,0,.42),0 0 32px rgba(139,92,255,.12);
}
body[data-page="wiki"] .wiki-card-media{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  background:#0c0a18;
}
body[data-page="wiki"] .wiki-card-media:after{
  content:"";
  position:absolute;inset:auto 0 0;height:42%;
  background:linear-gradient(180deg,transparent,rgba(13,10,28,.9));
  pointer-events:none;
}
body[data-page="wiki"] .wiki-card-media img{
  width:100%;height:100%;aspect-ratio:auto;object-fit:cover;
  transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .3s ease;
}
body[data-page="wiki"] .wiki-card-v3:hover .wiki-card-media img{transform:scale(1.055);filter:saturate(1.06)}
.wiki-card-keymode,.wiki-card-id{
  position:absolute;z-index:2;top:13px;
  display:inline-flex;align-items:center;min-height:27px;padding:5px 10px;
  border:1px solid rgba(255,255,255,.18);border-radius:999px;
  background:rgba(8,7,20,.75);backdrop-filter:blur(12px);
  color:#fff;font-size:10px;font-weight:900;box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.wiki-card-keymode{left:13px;background:linear-gradient(135deg,rgba(255,79,200,.88),rgba(139,92,255,.88))}
.wiki-card-id{right:13px;color:#baf7ff}
body[data-page="wiki"] .wiki-card-v3 .card-body{padding:18px 18px 17px}
body[data-page="wiki"] .wiki-card-v3 .eyebrow{font-size:10px;letter-spacing:.13em}
body[data-page="wiki"] .wiki-card-v3 h3{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  min-height:3.9em;margin:6px 0 9px;
  font-size:18px;line-height:1.3;letter-spacing:-.025em;
}
body[data-page="wiki"] .wiki-card-v3 .skill-meta{margin:2px 0 12px}
body[data-page="wiki"] .wiki-card-v3 .skill-meta span{
  border:1px solid rgba(98,232,255,.11);
  background:rgba(98,232,255,.075);
}
body[data-page="wiki"] .wiki-card-v3 p{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  min-height:4.95em;margin:0;color:#b8b3c7;font-size:13px;line-height:1.65;
}
body[data-page="wiki"] .wiki-card-detail-button{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:44px;
  margin-top:17px;padding:0 15px;border:1px solid rgba(98,232,255,.22);border-radius:13px;
  background:linear-gradient(100deg,rgba(255,79,200,.18),rgba(139,92,255,.22),rgba(98,232,255,.13));
  color:#fff;font:inherit;font-size:12px;font-weight:900;cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,filter .18s ease;
}
body[data-page="wiki"] .wiki-card-detail-button b{font-size:17px;transition:transform .18s ease}
body[data-page="wiki"] .wiki-card-v3:hover .wiki-card-detail-button{
  border-color:rgba(98,232,255,.48);filter:brightness(1.12)
}
body[data-page="wiki"] .wiki-card-v3:hover .wiki-card-detail-button b{transform:translateX(4px)}

body.wiki-modal-open{overflow:hidden}
.wiki-skill-modal{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:24px;opacity:0;transition:opacity .18s ease}
.wiki-skill-modal[hidden]{display:none!important}
.wiki-skill-modal.is-open{opacity:1}
.wiki-skill-modal__backdrop{position:absolute;inset:0;background:rgba(3,3,11,.78);backdrop-filter:blur(16px)}
.wiki-skill-dialog{
  position:relative;z-index:1;width:min(930px,100%);max-height:min(760px,calc(100vh - 48px));overflow:auto;
  border:1px solid rgba(173,135,255,.28);border-radius:28px;
  background:
    radial-gradient(circle at 8% 8%,rgba(255,79,200,.12),transparent 30%),
    linear-gradient(145deg,#18132b,#0c0b19 68%);
  box-shadow:0 40px 120px rgba(0,0,0,.62),0 0 70px rgba(139,92,255,.1);
  transform:translateY(12px) scale(.985);transition:transform .2s ease;outline:none;
}
.wiki-skill-modal.is-open .wiki-skill-dialog{transform:none}
.wiki-skill-close{
  position:absolute;right:18px;top:18px;z-index:4;width:42px;height:42px;padding:0;
  border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(255,255,255,.06);
  color:#fff;font-size:25px;cursor:pointer;
}
.wiki-skill-dialog__grid{display:grid;grid-template-columns:minmax(290px,39%) minmax(0,1fr);gap:0}
.wiki-skill-dialog__media{min-height:590px;padding:28px 0 28px 28px}
.wiki-skill-dialog__media img{width:100%;height:100%;max-height:610px;object-fit:cover;border-radius:21px}
.wiki-skill-dialog__content{display:flex;min-width:0;flex-direction:column;padding:42px 42px 28px 28px}
.wiki-skill-label{
  align-self:flex-start;padding:6px 11px;border-radius:999px;
  background:linear-gradient(100deg,var(--pink),var(--violet),var(--cyan));
  color:#080612;font-size:10px;font-weight:950;
}
.wiki-skill-dialog__content h2{
  margin:13px 48px 15px 0;font-size:clamp(28px,3.4vw,45px);line-height:1.08;letter-spacing:-.05em;
  overflow-wrap:anywhere;
}
.wiki-skill-facts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:9px}
.wiki-skill-facts span,.wiki-skill-rating{
  padding:7px 10px;border:1px solid rgba(255,255,255,.1);border-radius:999px;
  background:rgba(255,255,255,.045);font-size:10px;font-weight:800;
}
.wiki-skill-rating{align-self:flex-start;margin:0 0 14px}
.wiki-skill-description{margin:0 0 13px;color:#bbb5c8;font-size:13px;line-height:1.75}
.wiki-skill-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.wiki-skill-tags span{padding:6px 10px;border-radius:999px;background:rgba(139,92,255,.13);font-size:10px;font-weight:850}
.wiki-skill-primary-actions{margin-top:auto}
.wiki-skill-primary-actions a,.wiki-skill-video-disabled{
  display:flex;align-items:center;justify-content:center;min-height:46px;padding:0 17px;border-radius:13px;
  background:linear-gradient(100deg,var(--pink),#a478ff,var(--cyan));color:#090713;font-size:12px;font-weight:950;
}
.wiki-skill-video-disabled{background:rgba(255,255,255,.06);color:#8f899d}
.wiki-skill-tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.wiki-skill-tools button{
  flex:1 1 120px;min-height:40px;padding:0 11px;border:1px solid rgba(255,255,255,.12);
  border-radius:12px;background:rgba(255,255,255,.045);color:#fff;font:inherit;font-size:10px;font-weight:900;cursor:pointer;
}
.wiki-skill-tools button:hover{border-color:rgba(98,232,255,.45);background:rgba(98,232,255,.08)}
.wiki-skill-tools button.is-liked{border-color:rgba(255,79,200,.45);background:rgba(255,79,200,.12);color:#ffb4e8}
.wiki-skill-navigation{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:9px;margin-top:14px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08)
}
.wiki-skill-navigation button{
  min-height:40px;padding:0 10px;border:0;border-radius:11px;background:rgba(255,255,255,.035);
  color:#ddd8e8;font:inherit;font-size:10px;font-weight:850;cursor:pointer;
}
.wiki-skill-navigation button:disabled{opacity:.35;cursor:not-allowed}
.wiki-skill-navigation span{color:#b5afc2;font-size:10px;font-weight:900}

@media(max-width:1120px){
  body[data-page="wiki"] .wiki-grid-v3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:860px){
  body[data-page="wiki"] .wiki-grid-v3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wiki-skill-dialog__grid{grid-template-columns:1fr}
  .wiki-skill-dialog__media{min-height:0;padding:22px 22px 0}
  .wiki-skill-dialog__media img{max-height:390px;object-fit:contain;background:#080713}
  .wiki-skill-dialog__content{padding:24px 24px 22px}
  .wiki-skill-dialog__content h2{margin-right:42px}
}
@media(max-width:720px){
  body[data-page="wiki"] .wiki-page-hero{padding:52px 0 40px}
  body[data-page="wiki"] .section{padding-top:24px}
  .wiki-summary-controls{width:100%;margin-left:0;justify-content:space-between}
  .wiki-sort-control,.wiki-page-size{flex:1}
  .wiki-sort-control select,.wiki-page-size select{width:100%;min-width:0}
  body[data-page="wiki"] .wiki-grid-v3,
  body[data-page="wiki"] .wiki-grid-v3.is-single,
  body[data-page="wiki"] .wiki-grid-v3.is-sparse{grid-template-columns:1fr}
  body[data-page="wiki"] .wiki-card-v3{max-width:520px;margin-inline:auto}
  .wiki-skill-modal{padding:10px}
  .wiki-skill-dialog{max-height:calc(100vh - 20px);border-radius:21px}
  .wiki-skill-close{right:12px;top:12px;width:38px;height:38px}
  .wiki-skill-dialog__content h2{font-size:clamp(25px,8vw,36px)}
}
@media(max-width:480px){
  .wiki-summary-controls{align-items:stretch;flex-direction:column}
  .wiki-sort-control,.wiki-page-size{display:grid;grid-template-columns:72px 1fr}
  .wiki-skill-dialog__media{padding:15px 15px 0}
  .wiki-skill-dialog__content{padding:20px 15px 16px}
  .wiki-skill-navigation{grid-template-columns:1fr 1fr}
  .wiki-skill-navigation span{grid-column:1/-1;grid-row:1;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="wiki"] .wiki-card-v3,
  body[data-page="wiki"] .wiki-card-media img,
  .wiki-skill-modal,.wiki-skill-dialog{transition:none!important}
}