/* ════════════════════════════════════════════════════════════════
   ONENESS BẢN ĐỒ SỐ — giao diện theo tone nlp.com.vn (cùng bộ màu với bài DISC)
   Tím đậm + kem + vàng gradient, font Be Vietnam Pro.
   Mọi class có tiền tố .ownum nên không ảnh hưởng phần còn lại của trang.
   ════════════════════════════════════════════════════════════════ */

.ownum{
  --n-night:#0b0518; --n-royal:#2a1660; --n-violet:#1d1142;
  --n-accent:#8b5cff; --n-accent-deep:#6d3cf0; --n-accent-ink:#4b23b8; --n-lav-soft:#d6c4ff;
  --n-gold:#e0b252; --n-gold-bright:#f6c85f; --n-gold-deep:#c79235;
  --n-gold-grad:linear-gradient(135deg,#e6b94f 0%,#f6c85f 55%,#d99a3f 100%);
  --n-cream:#fbf5ea; --n-sand:#efe7d6; --n-ink:#1b1320; --n-ink-soft:#4a4258; --n-muted:#6b6478;
  --n-line:rgba(42,22,96,.1); --n-line-strong:rgba(42,22,96,.18);
  --n-sage:#2f7a57; --n-sage-soft:#e2f2ea; --n-rose:#a8384f; --n-rose-soft:#f8e6ea;
  --n-accent-soft:#efe9ff; --n-gold-soft:#f8ecd2;
  --n-shadow:0 30px 70px -40px rgba(42,22,96,.45);
  --n-radius:20px;
  font-family:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--n-ink); line-height:1.6; max-width:1100px; margin:0 auto; padding:8px 0;
}
.ownum *, .ownum *::before, .ownum *::after{ box-sizing:border-box; }
.ownum h2, .ownum h3, .ownum h4{ font-family:inherit; text-transform:none; letter-spacing:-.015em; color:var(--n-ink); margin:0; }
/* Flatsome thụt lề cho ul/li/ol trong nội dung trang -> bỏ trong phạm vi plugin */
.ownum ul, .ownum ol{ margin:0 !important; padding:0 !important; list-style:none !important; }
.ownum li{ margin-left:0 !important; list-style:none !important; }
.ownum p{ margin:0; }
.ownum button, .ownum select, .ownum input{ font-family:inherit; text-transform:none; letter-spacing:0; }
.ownum table{ margin:0; border:0; }
.ownum td, .ownum th{ border:0; padding:0; }
/* Flatsome viết hoa + thu nhỏ th/dt -> trả về chữ thường */
.ownum th, .ownum dt{ text-transform:none; letter-spacing:0; font-size:inherit; color:inherit; }
.ownum code, .ownum-mono{ font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.85em; }
.ownum code{ padding:.05rem .35rem; border-radius:6px; background:var(--n-cream); color:inherit; white-space:nowrap; }

.ownum__card{ background:#fff; border:1px solid var(--n-line); border-radius:28px; box-shadow:var(--n-shadow); padding:clamp(1.4rem,4vw,3rem); overflow:hidden; }
.ownum.is-result .ownum__card{ padding:0; }

/* ── Chữ chung ── */
.ownum-eyebrow{ display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:0 0 .8rem !important; color:var(--n-gold-deep); font-weight:700; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; }
.ownum-eyebrow::before{ content:""; display:inline-block; width:26px; height:1px; background:linear-gradient(90deg,transparent,var(--n-gold)); }
.ownum-title{ font-weight:800; font-size:clamp(1.6rem,3.6vw,2.4rem); line-height:1.2; }
.ownum-h2{ font-weight:800; font-size:clamp(1.4rem,3vw,1.95rem); line-height:1.25; }
.ownum-h3{ font-weight:700; font-size:1.2rem; }
.ownum-lead{ margin-top:1rem !important; color:var(--n-ink-soft); font-size:1.04rem; }
.ownum-intro{ margin-top:.7rem !important; max-width:760px; color:var(--n-ink-soft); }
.ownum-muted{ color:var(--n-muted); }
.ownum-small{ font-size:.86rem; line-height:1.5; }
.ownum-gap{ margin-top:2.4rem !important; }
.ownum-error{ padding:.8rem 1rem; border-radius:12px; background:#fdecea; color:#a3261c; font-weight:600; }

/* ── Nút ── */
.ownum-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem; min-height:48px; padding:0 1.5rem; margin:0;
  border-radius:999px; font-weight:700; font-size:1rem; line-height:1; cursor:pointer; text-decoration:none !important;
  border:1px solid transparent; transition:transform .25s,box-shadow .25s,background .2s,border-color .2s;
}
.ownum-btn--gold{ background:var(--n-gold-grad); color:#2b1a05 !important; box-shadow:0 8px 30px -8px rgba(230,178,79,.55),inset 0 1px 0 rgba(255,255,255,.4); }
.ownum-btn--gold:hover{ transform:translateY(-2px); box-shadow:0 14px 40px -8px rgba(230,178,79,.7); }
.ownum-btn--ghost{ background:rgba(255,255,255,.08); color:#fff !important; border-color:rgba(214,196,255,.35); }
.ownum-btn--ghost:hover{ background:rgba(255,255,255,.16); border-color:var(--n-lav-soft); }
.ownum-btn--link{ background:none; color:var(--n-accent-deep) !important; padding:0 .6rem; }
.ownum-btn--link:hover{ text-decoration:underline !important; }
.ownum-btn[disabled]{ opacity:.55; cursor:default; transform:none; }
.ownum-btn:focus-visible, .ownum a:focus-visible, .ownum summary:focus-visible{ outline:3px solid rgba(139,92,255,.45); outline-offset:2px; }
.ownum-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; }

/* ── Form ── */
.ownum-intro-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(1.4rem,4vw,3rem); align-items:start; }
.ownum-points{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:1.6rem !important; }
.ownum-points li{ padding:.9rem 1rem; border-radius:16px; background:var(--n-cream); border:1px solid var(--n-line); }
.ownum-points b{ display:block; font-size:.92rem; }
.ownum-points span{ display:block; margin-top:.25rem; color:var(--n-ink-soft); font-size:.82rem; line-height:1.45; }
.ownum-form{ display:grid; gap:1rem; padding:clamp(1.1rem,3vw,1.8rem); border-radius:24px; background:var(--n-cream); border:1px solid var(--n-line); margin:0; }
.ownum-field{ display:flex; flex-direction:column; gap:.4rem; margin:0; font-size:.9rem; font-weight:600; color:var(--n-ink); }
.ownum-field small{ font-weight:400; color:var(--n-muted); font-size:.8rem; line-height:1.45; }
.ownum-form input[type=text], .ownum-form input[type=email], .ownum-form input[type=tel], .ownum-form select{
  width:100%; height:auto; min-height:48px; margin:0; padding:.75rem 1rem; border-radius:12px; border:1px solid var(--n-line-strong); background:#fff;
  font-size:1rem; font-weight:400; color:var(--n-ink); box-shadow:none;
}
.ownum-form select{ padding-right:2rem; }
.ownum-form input:focus, .ownum-form select:focus{ outline:none; border-color:var(--n-accent); box-shadow:0 0 0 3px rgba(139,92,255,.15); }
.ownum-form [aria-invalid=true]{ border-color:#e0574f !important; }
.ownum-field-error{ color:#a3261c; font-size:.82rem; font-weight:600; }
.ownum-dob{ display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:.5rem; }
.ownum-methods{ margin:0; padding:0; border:0; display:grid; gap:.5rem; }
.ownum-methods legend{ padding:0; margin-bottom:.4rem; font-size:.9rem; font-weight:600; text-transform:none; letter-spacing:0; color:var(--n-ink); border:0; width:auto; }
.ownum-method{ display:flex; gap:.7rem; padding:.75rem .9rem; border-radius:14px; border:1px solid var(--n-line-strong); background:#fff; cursor:pointer; margin:0; font-weight:400; }
.ownum-method:has(input:checked){ border-color:var(--n-accent-deep); background:var(--n-accent-soft); }
.ownum-method input{ margin:.3rem 0 0; accent-color:var(--n-accent-deep); }
.ownum-method b{ display:block; }
.ownum-method small{ display:block; color:var(--n-muted); font-size:.8rem; line-height:1.45; }
.ownum-fineprint{ color:var(--n-muted); font-size:.78rem; line-height:1.5; }

/* ── Báo cáo: phần đầu ── */
.ownum-report__head{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:1.2rem; color:#fff;
  padding:clamp(1.8rem,5vw,3rem) clamp(1.3rem,4vw,2.6rem);
  background:radial-gradient(120% 90% at 0% -10%,#2a1660 0%,transparent 60%),radial-gradient(80% 70% at 100% 10%,rgba(139,92,255,.25),transparent 60%),linear-gradient(180deg,#0e0726,#0b0518);
}
.ownum-report__head .ownum-eyebrow{ color:var(--n-gold-bright); }
.ownum-report__head .ownum-title{ color:#fff !important; }
.ownum-report__head .ownum-muted{ color:var(--n-lav-soft); margin-top:.4rem !important; }
.ownum-sent{ margin-top:.7rem !important; display:inline-block; padding:.3rem .8rem; border-radius:99px; background:rgba(63,168,119,.18); color:#bff0d6; font-size:.86rem; font-weight:600; }
.ownum-nav{ position:relative; background:#fff; border-bottom:1px solid var(--n-line); }
.ownum-nav ul{ display:flex; gap:.3rem; overflow-x:auto; padding:.6rem clamp(1rem,3vw,2.2rem) !important; white-space:nowrap; scrollbar-width:thin; }
.ownum-nav a{ display:block; padding:.4rem .85rem; border-radius:99px; color:var(--n-ink-soft) !important; font-size:.9rem; font-weight:600; text-decoration:none !important; transition:background .2s,color .2s; }
.ownum-nav a:hover{ background:var(--n-accent-soft); color:var(--n-accent-ink) !important; }
.ownum-report__body{ padding:0 clamp(1rem,3vw,2.2rem) clamp(1.4rem,4vw,2.4rem); background:var(--n-cream); }

/* ── Khối & thẻ ── */
.ownum-section{ padding:clamp(2rem,5vw,3.2rem) 0 0; scroll-margin-top:90px; }
.ownum-section__body{ margin-top:1.4rem; }
.ownum-grid{ display:grid; gap:14px; }
.ownum-grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.ownum-grid--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.ownum-grid--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.ownum-card{ display:flex; flex-direction:column; gap:.7rem; background:#fff; border:1px solid var(--n-line); border-radius:var(--n-radius); padding:1.2rem 1.3rem; box-shadow:0 14px 34px -30px rgba(42,22,96,.4); }
.ownum-card h4{ font-size:1.02rem; font-weight:700; }
.ownum-card__head{ display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.ownum-card__head .ownum-muted{ font-size:.86rem; margin-top:.2rem !important; }
.ownum-push{ margin-top:auto; }
.ownum-empty{ margin-top:1rem !important; padding:.8rem 1rem; border-radius:14px; border:1px dashed var(--n-line-strong); color:var(--n-muted); font-size:.9rem; }
.ownum-group + .ownum-group{ margin-top:2rem; }
.ownum-group > .ownum-grid{ margin-top:1rem; }
.ownum-stack{ display:grid; gap:12px; margin-top:.6rem; }
.ownum-note-box{ margin-bottom:1rem !important; padding:.8rem 1rem; border-radius:14px; background:var(--n-gold-soft); color:#6b4a12; font-size:.88rem; }

/* Số */
.ownum-num{ font-weight:800; line-height:1; font-variant-numeric:tabular-nums; color:var(--n-accent-deep); white-space:nowrap; }
.ownum-num small{ font-size:.45em; color:var(--n-muted); font-weight:700; }
.ownum-num--sm{ font-size:1.5rem; }
.ownum-num--md{ font-size:2.3rem; }
.ownum-num--lg{ font-size:clamp(4rem,10vw,5.6rem); color:#2b1a05; }
.ownum-num--lg small{ color:rgba(43,26,5,.6); }

/* Chip */
.ownum-chips{ display:flex; flex-wrap:wrap; gap:.35rem; }
.ownum-chip{ display:inline-flex; align-items:center; padding:.18rem .65rem; border-radius:99px; font-size:.8rem; font-weight:600; letter-spacing:0; text-transform:none; background:#fff; color:var(--n-muted); border:1px solid var(--n-line); align-self:flex-start; }
.ownum-chip--sage{ background:var(--n-sage-soft); color:var(--n-sage); border-color:transparent; }
.ownum-chip--rose{ background:var(--n-rose-soft); color:var(--n-rose); border-color:transparent; }
.ownum-chip--accent{ background:var(--n-accent-soft); color:var(--n-accent-ink); border-color:transparent; }
.ownum-chip--gold{ background:var(--n-gold-soft); color:#8a5c14; border-color:transparent; }
.ownum-label{ margin-bottom:.4rem !important; font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--n-muted); }
.ownum-lists{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.4rem; }

/* Mở rộng */
.ownum-details summary{ display:flex; align-items:center; gap:.4rem; cursor:pointer; list-style:none; color:var(--n-accent-deep); font-size:.9rem; font-weight:600; padding:.2rem 0; }
.ownum-details summary::-webkit-details-marker{ display:none; }
.ownum-chevron{ width:16px; height:16px; flex:0 0 auto; transition:transform .2s; }
.ownum-details[open] > summary .ownum-chevron{ transform:rotate(90deg); }
.ownum-details__body{ margin-top:.7rem; }
.ownum-details--box{ background:#fff; border:1px solid var(--n-line); border-radius:var(--n-radius); padding:.9rem 1.2rem; }
.ownum-details--box > summary{ font-size:1rem; color:var(--n-ink); }
.ownum-evidence{ margin:0; border:1px solid var(--n-line); border-radius:12px; background:var(--n-cream); font-size:.86rem; }
.ownum-evidence div{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:.2rem 1rem; padding:.45rem .8rem; }
.ownum-evidence div + div{ border-top:1px solid var(--n-line); }
.ownum-evidence dt{ font-weight:400; }
.ownum-evidence dt code{ color:var(--n-muted); margin-left:.3rem; }
.ownum-evidence dd{ margin:0; font-weight:700; }
.ownum-details .ownum-small{ margin-top:.5rem !important; color:var(--n-muted); }

/* Tổng quan */
.ownum-hero{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(1.4rem,4vw,3rem); align-items:center; margin-top:clamp(1.4rem,4vw,2.2rem); padding:clamp(1.3rem,4vw,2.4rem); background:#fff; border:1px solid var(--n-line); border-radius:26px; box-shadow:var(--n-shadow); scroll-margin-top:90px; }
.ownum-hero__badge{ display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:180px; padding:1.6rem 2rem; border-radius:24px; background:var(--n-gold-grad); color:#2b1a05; box-shadow:0 22px 50px -24px rgba(199,146,53,.85); text-align:center; }
.ownum-hero__badge p{ margin-bottom:.6rem !important; font-size:.74rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; }
.ownum-hero__badge span{ margin-top:.6rem; font-weight:700; }
.ownum-hero .ownum-lists{ margin-top:1.4rem; }
.ownum-tiles{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:14px; }
.ownum-tile{ padding:1rem 1.1rem; background:#fff; border:1px solid var(--n-line); border-radius:18px; }
.ownum-tile__label{ font-size:.86rem; font-weight:700; }
.ownum-tile__value{ margin:.35rem 0 .2rem !important; font-size:1.9rem; font-weight:800; color:var(--n-accent-deep); line-height:1.1; }
.ownum-tile .ownum-small{ color:var(--n-muted); font-size:.78rem; }

/* Chặng */
.ownum-stages{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:1rem !important; }
.ownum-stage{ display:flex; flex-direction:column; gap:.6rem; padding:1.1rem 1.2rem; border-radius:var(--n-radius); border:1px solid var(--n-line); background:#fff; }
.ownum-stage.is-active{ border-color:var(--n-accent-deep); background:var(--n-accent-soft); box-shadow:0 0 0 3px rgba(139,92,255,.15); }
.ownum-stage__head{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; font-size:.9rem; }
.ownum-stage__nums{ display:flex; align-items:flex-end; gap:1.4rem; }
.ownum-stage + .ownum-small, .ownum-stages + .ownum-small{ margin-top:.8rem !important; }

/* Mặt biểu hiện & biểu đồ */
.ownum-bar{ height:8px; border-radius:99px; background:var(--n-sand); overflow:hidden; }
.ownum-bar i{ display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,var(--n-accent),var(--n-accent-deep)); }
.ownum-chart{ width:100%; table-layout:fixed; border-collapse:collapse !important; text-align:center; }
.ownum-chart caption{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.ownum-chart td{ border:1px solid var(--n-line) !important; padding:.8rem .2rem !important; vertical-align:middle; text-align:center !important; }
.ownum-chart b{ display:block; font-size:1.5rem; font-weight:800; letter-spacing:.06em; color:var(--n-accent-deep); line-height:1.2; word-break:break-all; }
.ownum-chart span{ display:block; margin-top:.2rem; font-size:.72rem; color:var(--n-muted); }
.ownum-chart td.is-empty{ opacity:.38; }
.ownum-chart td.is-empty b{ font-size:1.2rem; color:var(--n-ink); }

/* Tổng hợp */
.ownum-card p + p{ margin-top:.2rem !important; }
.ownum-card > p{ color:var(--n-ink-soft); }
.ownum-questions{ display:grid; gap:.4rem; padding-top:.6rem !important; border-top:1px dashed var(--n-line-strong); }
.ownum-questions li{ position:relative; padding-left:1.2rem !important; color:var(--n-ink); font-style:italic; }
.ownum-questions li::before{ content:"?"; position:absolute; left:0; font-weight:800; font-style:normal; color:var(--n-gold-deep); }

/* Cách tính */
.ownum-steps{ margin:.6rem 0 0; }
.ownum-step{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:.2rem 1.4rem; padding:.55rem 0; border-top:1px solid var(--n-line); }
.ownum-step dt{ font-weight:600; }
.ownum-step dd{ margin:0; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.84rem; color:var(--n-ink-soft); overflow-wrap:anywhere; text-align:right; }
.ownum-scroll{ overflow-x:auto; margin-top:.6rem; }
.ownum-words{ width:100%; min-width:30rem; border-collapse:collapse !important; font-size:.88rem; }
.ownum-words th{ padding:.4rem .5rem !important; font-size:.75rem; font-weight:600; color:var(--n-muted); text-align:left; }
.ownum-words td{ padding:.55rem .5rem !important; border-top:1px solid var(--n-line) !important; vertical-align:top; }
.ownum-words th:nth-child(n+3), .ownum-words td:nth-child(n+3){ text-align:right; font-variant-numeric:tabular-nums; }
.ownum-letters{ display:flex; flex-wrap:wrap; gap:.25rem; }
.ownum-letter{ display:inline-flex; flex-direction:column; align-items:center; min-width:2.1rem; padding:.15rem .3rem; border-radius:8px; background:var(--n-cream); font-family:ui-monospace,Consolas,monospace; line-height:1.2; }
.ownum-letter small{ font-size:.7rem; color:var(--n-muted); }
.ownum-letter.is-vowel{ background:var(--n-gold-soft); color:#8a5c14; }

/* Kêu gọi & chân */
.ownum-cta{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1.2rem; margin-top:clamp(2rem,5vw,3rem); padding:clamp(1.3rem,4vw,2rem); border-radius:24px; color:#fff; background:linear-gradient(120deg,#1d1142,#2a1660 60%,#3b1f86); box-shadow:var(--n-shadow); }
.ownum-cta h3{ color:#fff !important; font-size:1.25rem; font-weight:800; }
.ownum-cta p{ margin-top:.3rem !important; color:var(--n-lav-soft); max-width:560px; }
.ownum-footer{ margin-top:1.6rem; padding:1rem 1.2rem; border-radius:16px; border:1px solid var(--n-line); background:rgba(255,255,255,.6); color:var(--n-muted); font-size:.8rem; line-height:1.55; }
.ownum-footer p + p{ margin-top:.4rem !important; }

/* ── Điện thoại ── */
@media (max-width:980px){
  .ownum-grid--3, .ownum-grid--4, .ownum-stages, .ownum-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ownum-intro-grid{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px){
  .ownum__card{ border-radius:22px; padding:1.1rem; }
  .ownum-grid--2, .ownum-grid--3, .ownum-grid--4, .ownum-stages, .ownum-lists, .ownum-points{ grid-template-columns:minmax(0,1fr); }
  .ownum-hero{ grid-template-columns:minmax(0,1fr); }
  .ownum-hero__badge{ min-width:0; }
  .ownum-report__head .ownum-actions, .ownum-report__head .ownum-btn{ width:100%; }
  .ownum-form .ownum-actions .ownum-btn--gold{ width:100%; }
  .ownum-step dd{ text-align:left; }
  .ownum-points{ display:none; }
  .ownum-chart b{ font-size:1.15rem; letter-spacing:0; word-break:normal; }
}
@media (prefers-reduced-motion:reduce){
  .ownum *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}

/* ── In / PDF ── */
@media print{
  .ownum-noprint{ display:none !important; }
  .ownum__card{ box-shadow:none; border:0; }
  .ownum-report__head{ background:none !important; color:var(--n-ink); padding:0 0 1rem; }
  .ownum-report__head .ownum-title{ color:var(--n-ink) !important; }
  .ownum-report__head .ownum-muted, .ownum-report__head .ownum-eyebrow{ color:var(--n-muted); }
  .ownum-report__body{ background:#fff; padding:0; }
  .ownum-card, .ownum-stage, .ownum-hero{ break-inside:avoid; box-shadow:none; }
  .ownum-details:not([open]) > .ownum-details__body{ display:block; }
}
