/* Giao diện kiểu Apple: nền trắng / xám nhạt, chữ hệ thống to đậm khít, không chuyển màu, không ánh sáng, nút viên thuốc,
   ô bo tròn lớn. Nạp CUỐI CÙNG ở mọi trang để ghi đè. Một màu nhận diện duy nhất: xanh ngọc. */

:root{
  --font-apple:'Inter',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Helvetica,Arial,sans-serif;
  --bg:#ffffff; --bg-soft:#f5f5f7; --card:#ffffff; --border:#d2d2d7;
  --text:#1d1d1f; --muted:#6e6e73;
  --accent:#F5F3FF; --accent2:#F5F3FF; --accent-fill:#8B5CF6;
  --accent-grad:linear-gradient(#8B5CF6,#8B5CF6);
  --purple-bg:rgba(139,92,246,.12); --purple-border:rgba(139,92,246,.4); --purple-text:#F5F3FF;
  --header-bg:rgba(255,255,255,.8); --radius:18px;
  --shadow-card:none; --shadow-hover:0 8px 28px rgba(0,0,0,.08);
}
:root[data-theme="dark"]{
  --bg:#000000; --bg-soft:#1d1d1f; --card:#161617; --border:#38383a;
  --text:#f5f5f7; --muted:#a1a1a6;
  --accent:#8B5CF6; --accent2:#8B5CF6;
  --header-bg:rgba(0,0,0,.72);
  --shadow-hover:0 8px 28px rgba(0,0,0,.5);
}
body{font-family:var(--font-apple);letter-spacing:-.011em;}
h1,h2,h3,h4,.logo,.btn,.nav-links,.price-amount,.stat-num{font-family:var(--font-apple);}

/* ----- Thanh trên cùng: kính mờ mỏng ----- */
header{border-bottom:1px solid rgba(128,128,128,.22);backdrop-filter:saturate(180%) blur(20px);}
nav{padding-block:10px;}
.nav-links{font-size:13px;gap:26px;}
.logo{font-size:17px;font-weight:600;letter-spacing:-.02em;}
.nav-cta{border-radius:980px;padding:7px 16px;font-size:13px;font-weight:500;box-shadow:none !important;background:var(--accent-fill);}

/* ----- Nút ----- */
.btn{border-radius:980px;font-weight:500;letter-spacing:-.01em;box-shadow:none !important;}
.btn-primary,.btn-primary:hover{background:var(--accent-fill);border-color:var(--accent-fill);}
.btn-primary:hover{filter:brightness(.96);transform:none;}
.btn-lg{padding:14px 28px;font-size:17px;}
.btn-ghost{background:transparent;border:1px solid var(--border);}

/* ----- Hero (mọi trang) ----- */
.hero{padding:clamp(56px,9vw,104px) 0 clamp(40px,7vw,72px);background:var(--bg) !important;}
.hero::before,.hero::after{display:none !important;}
.hero-split{--bg-soft:var(--bg-soft);}
.hero h1{font-size:clamp(44px,8.5vw,92px) !important;line-height:1.03 !important;font-weight:600 !important;letter-spacing:-.045em !important;text-wrap:balance;}
h1 span{background:none !important;-webkit-text-fill-color:currentColor;color:var(--accent);filter:none !important;}
.hero-sub{font-size:clamp(19px,2.4vw,26px);line-height:1.25;color:var(--text);letter-spacing:-.015em;}
.badge{background:transparent;border:none;padding:0;font-size:clamp(15px,2vw,21px);font-weight:600;color:var(--text);letter-spacing:-.01em;}
.badge::before{display:none;}
.hero-tags{display:none;}
.hero-split{text-align:center !important;}
.hero-split .hero-content{max-width:none;margin-inline:auto;}
.hero-split .hero-sub,.hero-split h1{margin-inline:auto !important;}
.hero-split .cta-row,.hero-split .hero-tags{justify-content:center !important;}
@media(min-width:1180px){.hero-split .container{display:block !important;}}

/* Hero trang chủ: cửa sổ sản phẩm với kênh thật (tên làm mờ) */
.hero-apple{text-align:center;padding-bottom:0;overflow:hidden;}
.hero-apple .eyebrow-a{font-size:clamp(15px,2vw,21px);font-weight:600;letter-spacing:-.01em;display:flex;align-items:center;justify-content:center;gap:10px;}
.hero-apple h1{margin-top:6px;}
.hero-apple .lead-a{font-size:clamp(19px,2.6vw,28px);line-height:1.2;max-width:22em;margin:18px auto 0;letter-spacing:-.015em;text-wrap:balance;}
.hero-apple .links-a{display:flex;gap:22px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:26px;}
.hero-apple .more-a{color:var(--accent);font-size:19px;}
.hero-apple .more-a:after{content:' ›';}
.stage-a{margin:clamp(40px,7vw,72px) auto 0;max-width:1000px;background:var(--bg-soft);border-radius:28px 28px 0 0;padding:clamp(20px,4vw,44px) clamp(16px,4vw,44px) 0;}
.win-a{background:var(--card);border-radius:16px 16px 0 0;box-shadow:0 2px 24px rgba(0,0,0,.08);overflow:hidden;text-align:left;}
.win-a .tb{display:flex;gap:7px;padding:14px 16px;border-bottom:1px solid var(--border);}
.win-a .tb i{width:11px;height:11px;border-radius:50%;background:var(--border);}
.wr-a{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border);}
.wr-a:last-child{border-bottom:0;}
.wr-a img{width:48px;height:48px;border-radius:12px;object-fit:cover;filter:blur(5px);}
.wr-a b{font-size:17px;font-weight:600;display:block;filter:blur(6px);}
.wr-a small{font-size:14px;color:var(--muted);}
.wr-a .x{font-size:28px;font-weight:600;letter-spacing:-.03em;color:var(--accent);text-align:right;}
.wr-a .x small{display:block;font-size:12px;font-weight:400;letter-spacing:0;}

/* ----- Khối, thẻ: bo lớn, không bóng ----- */
.step-card,.feature-card,.price-card,.demo-box,.niche-row,.ns-card,.ws-col,.ws-card,.quick-filter-tile{border-radius:22px;box-shadow:none;}
.step-card,.feature-card{background:var(--card);border:1px solid var(--border);}
.feature-card:hover,.price-card:hover{transform:none;box-shadow:var(--shadow-hover);}
section{padding:clamp(56px,8vw,96px) 0;}
.section-head h2,.final-cta h2,.insight h2{font-size:clamp(30px,5vw,56px);font-weight:600;letter-spacing:-.04em;line-height:1.07;text-wrap:balance;}
.section-head p{font-size:clamp(17px,2vw,21px);}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--accent);}
.stats{background:var(--bg-soft);}
.stat-num{font-size:clamp(36px,6vw,64px);font-weight:600;letter-spacing:-.04em;background:none;-webkit-text-fill-color:currentColor;color:var(--text);}
.step-num,.feature-icon-tile{background:var(--accent-fill);color:#0a0a0b;box-shadow:none;}

/* ----- Bảng giá: phẳng, bỏ trang trí ----- */
.price-decor,.price-climber,.lynx-radar{display:none !important;}
.price-card.featured{border:none;box-shadow:none;background:#000;color:#f5f5f7;overflow:hidden;}
.price-badge{background:var(--accent-fill) !important;color:#0a0a0b;}
.price-amount{font-weight:600;letter-spacing:-.04em;}

/* ----- Chân trang ----- */
footer{background:var(--bg-soft);}

/* ----- "How it works": ô lớn kiểu Apple, ô giữa đen ----- */
.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
@media(max-width:820px){.steps-grid{grid-template-columns:minmax(0,1fr);}}
.step-card{position:relative;text-align:center;padding:clamp(32px,4vw,52px) clamp(20px,3vw,32px);min-height:340px;display:flex;flex-direction:column;align-items:center;background:var(--bg-soft);border:none;border-radius:28px;}
.step-card .step-num{position:static;width:auto;height:auto;background:none;color:var(--accent);font-size:14px;font-weight:600;border-radius:0;margin-bottom:6px;}
.step-card .step-num:before{content:'Step ';}
.step-card .step-icon{font-size:40px;color:var(--text);margin:8px 0 18px;}
.step-card h3{font-size:clamp(24px,2.8vw,32px);font-weight:600;letter-spacing:-.035em;line-height:1.1;text-wrap:balance;}
.step-card p{font-size:17px;line-height:1.4;color:var(--muted);margin-top:12px;max-width:19em;}
.step-card:nth-child(2){background:#000;color:#f5f5f7;}
.step-card:nth-child(2) .step-icon,.step-card:nth-child(2) h3{color:#f5f5f7;}
.step-card:nth-child(2) p{color:#a1a1a6;}
.step-card:nth-child(2) .step-num{color:var(--accent-fill);}
:root[data-theme="dark"] .step-card{background:#161617;}
:root[data-theme="dark"] .step-card:nth-child(2){background:#1d1d1f;}

/* ----- Câu chuyện "The truth": chữ lớn ở giữa ----- */
.insight{text-align:center;background:var(--bg);}
.insight h2{max-width:16em;margin-inline:auto;}
.insight p{max-width:38em;margin:18px auto 0;font-size:clamp(17px,2vw,21px);line-height:1.45;color:var(--muted);}
.insight .quote,.insight blockquote{border:none;background:var(--bg-soft);border-radius:28px;padding:32px;margin:36px auto 0;max-width:40em;}

/* ----- Bảng giá: hai ô lớn, ô nổi bật màu đen ----- */
.pricing-grid{gap:12px;}
.price-card{background:var(--bg-soft);border:none;border-radius:28px;padding:clamp(32px,4vw,48px);}
.price-card.featured{background:#000;color:#f5f5f7;}
:root[data-theme="dark"] .price-card{background:#161617;}
.price-note,.price-billing-note{font-size:14px;}
/* =====================================================================
   APP (app.html) kiểu Apple: phẳng, bo tròn lớn, ít viền, thoáng
   ===================================================================== */
/* Thanh bên */
.app-sidebar{background:var(--bg-soft);border-right:none;padding:22px 14px;}
.sidebar-logo{padding-bottom:22px;}
.sidebar-link{border-radius:12px;padding:11px 14px;font-size:14.5px;font-weight:500;gap:12px;}
.sidebar-link:hover{background:rgba(128,128,128,.12);}
.sidebar-link.active{background:rgba(128,128,128,.16);color:var(--text);font-weight:600;}
.sidebar-link[data-section="workspace"]{box-shadow:none !important;margin:8px 0;padding:12px 14px;}
.sidebar-link[data-section="workspace"]:hover{box-shadow:none !important;filter:brightness(.97);}
.sidebar-link[data-section="workspace"].active{box-shadow:inset 0 0 0 2px rgba(4,33,26,.35) !important;}
.sidebar-group-label{padding:22px 14px 8px;font-size:12px;letter-spacing:.02em;text-transform:none;font-weight:600;}
.acct-card{border:none;background:var(--card);border-radius:16px;padding:12px 14px;}
.acct-menu{border:none;border-radius:18px;box-shadow:0 12px 40px rgba(0,0,0,.25);}

/* Tiêu đề trang */
.page-head h1{font-size:clamp(34px,4.6vw,52px);font-weight:600;letter-spacing:-.04em;line-height:1.05;}
.page-kicker{font-size:13px;letter-spacing:.06em;}
.page-kicker .dot{box-shadow:none;}
.page-head p{font-size:clamp(16px,1.8vw,19px);line-height:1.45;}

/* Ô lọc nhanh, ô tìm kiếm, nút */
.quick-filter-tile{border:none;background:var(--bg-soft);border-radius:24px;padding:22px 24px !important;}
.quick-filter-tile:hover{background:var(--bg-soft);filter:brightness(.98);}
.quick-filter-tile.active{background:var(--purple-bg);box-shadow:inset 0 0 0 2px var(--accent-fill);}
.browse-toolbar input,.search-field input{border:none !important;background:var(--bg-soft) !important;border-radius:16px !important;}
.browse-toolbar .btn-ghost,.saved-toolbar-actions .btn-ghost,.ws-addlink .btn-ghost{border:none;background:var(--bg-soft);}
.group-tab{border:none;background:var(--bg-soft);}
.group-tab.active{background:var(--accent-fill);color:#0a0a0b;}

/* Thẻ kênh: bo lớn, không viền, thoáng */
.niche-row,.saved-card,.teaser-row{border:none !important;background:var(--bg-soft) !important;border-radius:28px !important;}
.niche-row:hover{box-shadow:none !important;}
@media(min-width:1100px){.app-main #unifiedResult > .niche-row{row-gap:20px;padding:30px 32px;}}
.niche-row img,.niche-video-thumb-wrap{border-radius:14px;}
.niche-insight{border:none;background:var(--card);border-radius:20px;padding:18px 20px;}
.niche-row-actions .row-btn{border:none;background:var(--card);border-radius:980px;}
.niche-row-actions .row-btn.save{background:var(--accent-fill);color:#0a0a0b;}
.niche-pick-btn{animation:none !important;box-shadow:none !important;background:var(--accent-fill) !important;border-radius:980px;}
.niche-pick-btn:hover{transform:none;filter:brightness(.96);box-shadow:none !important;}
.niche-pick-btn::after{content:' ›';margin-left:2px;}

/* Nhãn: một kiểu viên thuốc phẳng thống nhất */
.niche-badge,.badge-hottest,.niche-badge.steady,.niche-badge.rising,.niche-badge.unstable{
  border:none !important;border-radius:980px;padding:3px 11px;font-weight:600;background:var(--purple-bg);color:var(--accent);
}
.niche-badge.unstable{background:rgba(255,159,10,.16);color:#c77700;}
:root[data-theme="dark"] .niche-badge.unstable{color:#ffb340;}
.niche-spike-highlight{border:none;border-radius:980px;}
.niche-tag{border:none;background:var(--card);}

/* Bản tin, workspace, công cụ: bỏ viền, dùng nền xám */
.ws-digest{border:none;background:var(--bg-soft);border-radius:22px;}
.ws-digest-list .niche-pick-btn,.ws-digest-list .niche-pick-btn:hover{border:none !important;background:var(--card) !important;color:var(--text) !important;}
.ws-goalbar,.ws-next,.ws-onboard,.ws-recap,.ws-alert{border:none;}
.ws-col{border:none;background:var(--bg-soft);border-radius:24px;}
.ws-card{border:none;background:var(--card);border-radius:16px;}
.ws-tool,.ns-card,.ws-goal-gate{border:none;background:var(--bg-soft);border-radius:22px;}
.ws-step{border:none;background:var(--bg-soft);}
.ws-step.active{background:var(--purple-bg);box-shadow:inset 0 0 0 2px var(--accent-fill);}
.ws-form input,.ws-addlink input,.ws-field input,.ws-field textarea,.ws-goal-sub input{border:none;background:var(--bg-soft);border-radius:14px;}
.ws-table td,.ws-table th,.ws-vs td,.ws-vs tbody th{border-color:rgba(128,128,128,.16);}

/* Hộp thoại, thông báo */
.auth-modal,.chart-modal{border:none;border-radius:26px;}
.toast{border:none;border-radius:16px;}
/* Pro: mở khoá thẻ kênh ở hero trang chủ */
.hero-unlocked .wr-a img,.hero-unlocked .wr-a b{filter:none;}