/* ==========================================================================
   pages/nha-sang-tao.css — 03 · Nhà sáng tạo (unit P03)
   Loaded only on nha-sang-tao.html. Every selector is .p-nst-* or scoped to
   body[data-page="nha-sang-tao"]. Creator accent = violet (--gated) for the
   "invite-only" language; red (--danger) only for the on-air light.
   ========================================================================== */
body[data-page="nha-sang-tao"]{
  --nst-live:#FF5A4E;
  --nst-live-glow:rgb(255 90 78 / .55);
  --nst-violet:var(--gated);
  --nst-violet-bg:var(--gated-bg);
}

/* ─────────────────────────── HERO ─────────────────────────── */
.p-nst-hero{min-height:100vh;min-height:100svh}
@media (max-width:1023px){ .p-nst-hero{min-height:0} }
.p-nst-hero .hero__title{max-inline-size:12ch}
.p-nst-hero .hero__sub{max-inline-size:34ch}
@media (min-width:1024px){
  .p-nst-hero .hero__inner{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,4vw,80px)}
}
.p-nst-hero__glow{position:absolute;inset:0;opacity:0;transition:opacity 1.1s var(--ease-out);
  background:
    radial-gradient(38% 46% at 80% 42%, rgb(255 90 78 / .16), transparent 70%),
    radial-gradient(50% 60% at 68% 60%, rgb(184 163 242 / .10), transparent 72%)}
.p-nst-hero[data-onair="on"] .p-nst-hero__glow{opacity:1}
@media (max-width:1023px){ .p-nst-hero__visual{margin-top:var(--s-7)} }

/* ── studio console (the hero visual) ── */
.p-nst-studio{padding:0;max-inline-size:520px;margin-inline:auto;overflow:hidden;
  background:linear-gradient(180deg, rgb(30 36 32 / .96), rgb(17 20 18 / .97));
  border-color:var(--line-strong);font-size:var(--fs-small)}
@media (min-width:1024px){ .p-nst-studio{margin-inline:auto 0} }
.p-nst-studio::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:3;background:var(--nst-live);
  transform-origin:0 50%;transform:scaleX(0);transition:transform 700ms var(--ease-expo)}
.p-nst-hero[data-onair="on"] .p-nst-studio::before{transform:none}
.p-nst-studio .mock__tag{top:3px}

/* on-air bar */
.p-nst-air{display:flex;align-items:center;gap:16px;padding:22px 20px 18px;border-bottom:1px solid var(--line);
  background:linear-gradient(90deg, rgb(255 90 78 / .0), rgb(255 90 78 / .0));transition:background 900ms var(--ease-out)}
.p-nst-hero[data-onair="on"] .p-nst-air{background:linear-gradient(90deg, rgb(255 90 78 / .14), rgb(255 90 78 / 0) 70%)}
.p-nst-lamp{position:relative;flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;
  background:#231c1b;border:2px solid #3b302e;transition:background 300ms var(--ease-out),border-color 300ms var(--ease-out),box-shadow 600ms var(--ease-out)}
.p-nst-lamp i{width:22px;height:22px;border-radius:50%;background:#4a3a38;transition:background 300ms var(--ease-out),box-shadow 300ms var(--ease-out)}
.p-nst-hero[data-onair="on"] .p-nst-lamp{background:#3a1512;border-color:var(--nst-live);box-shadow:0 0 0 6px rgb(255 90 78 / .12),0 0 34px 4px var(--nst-live-glow)}
.p-nst-hero[data-onair="on"] .p-nst-lamp i{background:radial-gradient(circle at 38% 34%, #FFD3CF 0 18%, var(--nst-live) 46%, #C22E25 100%);box-shadow:0 0 14px 2px var(--nst-live-glow)}
.p-nst-air__txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.p-nst-air__state{font:800 clamp(1.625rem,1.3rem + 1vw,2.125rem)/1 var(--ff-display);font-stretch:75%;text-transform:uppercase;letter-spacing:.02em;color:var(--text-3)}
.p-nst-air__on{display:none;color:var(--nst-live)}
.p-nst-hero[data-onair="on"] .p-nst-air__on{display:inline}
.p-nst-hero[data-onair="on"] .p-nst-air__off{display:none}
.p-nst-air__who{font:500 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2)}
.p-nst-air__bars{margin-left:auto;display:flex;align-items:flex-end;gap:3px;height:28px;padding-right:74px}
.p-nst-air__bars i{width:4px;height:6px;background:var(--line-strong);transition:height 400ms var(--ease-expo),background 300ms var(--ease-out)}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i{background:var(--nst-live)}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i:nth-child(1){height:10px}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i:nth-child(2){height:18px}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i:nth-child(3){height:26px}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i:nth-child(4){height:16px}
.p-nst-hero[data-onair="on"] .p-nst-air__bars i:nth-child(5){height:22px}
@media (max-width:420px){ .p-nst-air__bars{display:none} .p-nst-air{padding-right:80px} }

/* notification message */
.p-nst-msg{padding:14px 20px 16px;border-bottom:1px solid var(--line);transition:opacity 420ms var(--ease-out),translate 560ms var(--ease-expo)}
.p-nst-msg.is-pre{opacity:0;translate:0 10px}
.p-nst-msg__chan{margin-bottom:10px;font:600 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.02em;color:var(--text-2);overflow-wrap:anywhere}
.p-nst-msg__chan .dc-chan__hash{margin-right:4px}
.p-nst-msg .dc-ava{color:var(--accent);border-color:var(--accent)}
.p-nst-msg__time{font:500 var(--fs-micro)/1 var(--ff-mono);color:var(--text-3);font-weight:500}
.p-nst-ping{display:inline-block;padding:0 5px;margin-right:4px;border-radius:3px;font-weight:600;color:#FFD08A;background:rgb(255 159 28 / .18)}
.p-nst-noping{font:500 var(--fs-micro)/1.35 var(--ff-mono);letter-spacing:.02em;color:var(--text-3)}
.p-nst-noping s{color:var(--danger);text-decoration-thickness:2px;margin-right:6px}

/* invite-only room */
.p-nst-room{padding:16px 20px 12px;background:rgb(11 13 12 / .35)}
.p-nst-room__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.p-nst-room__name{display:flex;align-items:center;gap:8px;font:700 1rem/1.3 var(--ff-body);color:var(--text)}
.p-nst-room__name .i{width:18px;height:18px;color:var(--text-2)}
.p-nst-room__lock{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--nst-violet);background:var(--nst-violet-bg);border:1px solid currentColor}
.p-nst-room__lock .i{width:12px;height:12px}
.p-nst-room__meta{margin-top:6px;font:500 var(--fs-micro)/1.35 var(--ff-mono);letter-spacing:.04em;color:var(--text-2)}
.p-nst-slots{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.p-nst-slot{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px 10px;min-width:0;
  background:var(--surface);border:1px solid var(--line-strong);transition:border-color 300ms var(--ease-out),background-color 300ms var(--ease-out)}
.p-nst-av{position:relative;display:inline-grid;place-items:center;width:46px;height:46px;flex:none;
  font:700 .875rem/1 var(--ff-mono);color:var(--text);background:var(--surface-2);border:1px solid var(--line-strong)}
.p-nst-av .i{position:absolute;top:-9px;left:50%;translate:-50% 0;width:14px;height:14px;color:var(--accent);background:var(--surface);padding:1px}
.p-nst-slot__role{font:500 var(--fs-micro)/1.2 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.p-nst-slot.is-host{border-color:var(--accent)}
.p-nst-slot.is-host .p-nst-av{border-color:var(--accent);color:var(--accent)}
.p-nst-slot.is-in{border-color:var(--ok);background:var(--ok-bg)}
.p-nst-slot.is-in .p-nst-av{border-color:var(--ok);color:var(--ok);background:#15221a}
.p-nst-slot.is-in .p-nst-slot__role{color:var(--ok)}
.p-nst-slot.is-open{background:transparent;border-style:dashed}
.p-nst-slot.is-open .p-nst-av{background:transparent;border-style:dashed;color:var(--text-3)}
.p-nst-slot.is-new{animation:p-nst-admit 900ms var(--ease-out) 1}
@keyframes p-nst-admit{0%{box-shadow:0 0 0 0 rgb(124 203 139 / .6)}100%{box-shadow:0 0 0 14px rgb(124 203 139 / 0)}}

.p-nst-queue{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.p-nst-queue__head{display:flex;align-items:center;gap:6px;font:700 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--nst-violet)}
.p-nst-queue__head .i{width:14px;height:14px}
.p-nst-queue__list{margin-top:8px;display:grid;gap:8px}
.p-nst-queue__list:empty{display:none}
.p-nst-req{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 8px 8px 10px;
  background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--nst-violet);overflow:hidden}
.p-nst-req .p-nst-av{width:40px;height:40px;border-color:var(--nst-violet);color:var(--nst-violet)}
.p-nst-req__who{display:flex;flex-direction:column;gap:2px;font:700 .9375rem/1.2 var(--ff-mono);color:var(--text);min-width:0}
.p-nst-req__who small{font:500 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ok)}
.p-nst-req__wait{display:none;font:500 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
html.no-js .p-nst-admit{display:none}
html.no-js .p-nst-req__wait{display:inline-flex}
.p-nst-admit.is-press{transform:scale(.94);background:var(--accent-hi);box-shadow:0 0 0 4px rgb(255 159 28 / .25)}


.p-nst-status{font:600 var(--fs-small)/1.45 var(--ff-body);color:var(--ok)}

/* ─────────────────────────── 01 · TOOL BENTO ─────────────────────────── */
.p-nst-bento{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
@media (min-width:768px){
  .p-nst-bento{grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-areas:"room zone" "ping zone" "event help"}
  .p-nst-card--room{grid-area:room} .p-nst-card--ping{grid-area:ping} .p-nst-card--zone{grid-area:zone}
  .p-nst-card--event{grid-area:event} .p-nst-card--help{grid-area:help}
}
@media (min-width:1024px){
  .p-nst-bento{gap:20px;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr) minmax(0,.96fr);
    grid-template-areas:"room ping zone" "event help zone"}
}
.p-nst-card{position:relative;isolation:isolate;display:flex;flex-direction:column;min-width:0;padding-bottom:26px;
  background:linear-gradient(180deg, var(--surface) 0%, var(--bg-1) 100%);border:1px solid var(--line)}
.p-nst-card::after{content:"";position:absolute;left:-1px;top:-1px;width:36px;height:3px;background:var(--nst-violet)}
.p-nst-card--zone::after,.p-nst-card--ping::after{background:var(--accent)}
.p-nst-card__code{margin:22px 24px 0;font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.14em;color:var(--text-3)}
.p-nst-card__title{margin:10px 24px 0;font:800 clamp(1.5rem,1.2rem + .9vw,2rem)/1.05 var(--ff-display);font-stretch:75%;text-transform:uppercase;letter-spacing:.005em;text-wrap:balance}
.p-nst-card__text{margin:10px 24px 0;max-inline-size:34ch;font-size:1rem;line-height:1.5;color:var(--text-2)}

/* shared mini-visual stage */
.p-nst-viz{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  min-height:200px;padding:36px 20px 24px;overflow:hidden;border-bottom:1px solid var(--line);
  background:
    radial-gradient(70% 80% at 50% 30%, rgb(184 163 242 / .09), transparent 70%),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(var(--grid) 1px, transparent 1px) 0 0 / 24px 24px,
    var(--bg-0)}
.p-nst-viz__tag{position:absolute;top:10px;right:10px;padding:3px 6px;font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--intel);border:1px dashed rgb(111 211 232 / .6);background:var(--intel-bg)}

/* room */
.p-nst-mini-lock{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--nst-violet);background:var(--nst-violet-bg);border:1px solid currentColor}
.p-nst-mini-lock .i{width:13px;height:13px}
.p-nst-mini-slots{display:flex;gap:10px}
.p-nst-mini-slots b{display:grid;place-items:center;width:56px;height:56px;font:700 .9375rem/1 var(--ff-mono);color:var(--text);background:var(--surface-2);border:1px solid var(--line-strong)}
.p-nst-mini-slots .is-host{border-color:var(--accent);color:var(--accent)}
.p-nst-mini-slots .is-in{border-color:var(--ok);color:var(--ok);background:var(--ok-bg)}
.p-nst-mini-slots .is-open{border-style:dashed;background:transparent;color:var(--text-3);font-size:1.25rem}
.p-nst-mini-switches{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.p-nst-mini-switches i{display:inline-flex;align-items:center;gap:6px;padding:4px 8px 4px 5px;font:500 var(--fs-micro)/1 var(--ff-mono);font-style:normal;letter-spacing:.02em;color:var(--text-2);
  background:var(--surface);border:1px solid var(--line)}
.p-nst-mini-switches i::before{content:"";width:18px;height:10px;border-radius:6px;background:var(--ok);box-shadow:inset 9px 0 0 0 var(--ok-bg), inset 0 0 0 1px var(--ok)}

/* ping */
.p-nst-viz--ping{gap:14px}
.p-nst-rings{position:relative;display:grid;place-items:center;width:64px;height:64px;color:var(--accent)}
.p-nst-rings .i{width:26px;height:26px;position:relative;z-index:1}
.p-nst-rings i{position:absolute;inset:0;border:1px solid rgb(255 159 28 / .45);border-radius:50%}
.p-nst-rings i:nth-child(2){inset:-14px;border-color:rgb(255 159 28 / .25)}
.p-nst-rings i:nth-child(3){inset:-28px;border-color:rgb(255 159 28 / .12)}
.p-nst-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:3px;font:600 .875rem/1.2 var(--ff-body);position:relative;z-index:1}
.p-nst-pill--yes{color:#FFD08A;background:rgb(255 159 28 / .18);border:1px solid rgb(255 159 28 / .5)}
.p-nst-pill--no{color:var(--text-3);background:var(--surface);border:1px solid var(--line)}
.p-nst-pill--no .i{width:14px;height:14px;color:var(--danger)}
.p-nst-pill--no s{text-decoration-color:var(--danger);text-decoration-thickness:2px}

/* zone (tall) */
.p-nst-viz--zone{flex:1 1 auto;justify-content:flex-start;align-items:stretch;min-height:320px;padding-top:40px}
.p-nst-chans{display:grid;gap:2px;padding:10px 8px;background:rgb(17 20 18 / .85);border:1px solid var(--line-strong)}
.p-nst-chans__cat{padding:6px 8px 6px;font:700 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.p-nst-chans__item{display:flex;align-items:center;gap:8px;min-height:36px;padding:4px 8px;font:500 .875rem/1.3 var(--ff-body);color:var(--text-2);overflow-wrap:anywhere}
.p-nst-chans__item em{font:500 1rem/1 var(--ff-mono);font-style:normal;color:var(--text-3)}
.p-nst-chans__item .i{width:16px;height:16px;color:var(--text-3)}
.p-nst-chans__item.is-live{color:var(--text);background:var(--surface-2);box-shadow:inset 3px 0 0 var(--nst-live)}
.p-nst-dot{display:inline-block;width:9px;height:9px;margin-left:auto;border-radius:50%;background:var(--nst-live);box-shadow:0 0 0 3px rgb(255 90 78 / .2),0 0 12px var(--nst-live-glow);flex:none}
.p-nst-rolechip{align-self:flex-start;margin-top:4px;display:inline-flex;align-items:center;padding:5px 10px;font:600 .8125rem/1.2 var(--ff-body);color:var(--text);
  background:var(--surface-2);border:1px solid var(--nst-violet);border-radius:999px}

/* event */
.p-nst-viz--event{gap:10px;align-items:stretch;padding-inline:clamp(16px,2vw,28px)}
.p-nst-ticket{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:stretch;min-width:0;background:var(--surface);border:1px solid var(--line-strong)}
.p-nst-ticket__time{display:grid;place-items:center;padding:10px 14px;font:400 1.75rem/1 var(--ff-stencil);color:var(--accent);border-right:1px dashed var(--line-strong);min-width:92px}
.p-nst-ticket__time .i{width:24px;height:24px;color:var(--target)}
.p-nst-ticket__body{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:10px 12px;min-width:0}
.p-nst-ticket__body b{font:700 .9375rem/1.25 var(--ff-body);color:var(--text)}
.p-nst-ticket__body i{display:inline-flex;align-items:center;gap:6px;font:500 var(--fs-micro)/1.2 var(--ff-mono);font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:var(--ok)}
.p-nst-ticket__body i .i{width:12px;height:12px}
.p-nst-ticket--ghost{opacity:.7;border-style:dashed}
.p-nst-ticket--ghost .p-nst-ticket__body i{color:var(--text-2)}

/* help */
.p-nst-form{display:grid;gap:8px;inline-size:min(100%, 300px)}
.p-nst-form__head{display:flex;align-items:center;gap:8px;font:700 .75rem/1.2 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.p-nst-form__head .i{width:16px;height:16px;color:var(--accent)}
.p-nst-form__opt{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;font:600 .875rem/1.3 var(--ff-body);color:var(--text);
  background:var(--surface-2);border:1px solid var(--accent)}
.p-nst-form__opt .i{width:16px;height:16px;color:var(--accent)}

/* ─────────────────────────── 02 · NÓI THẲNG + SẮP CÓ ─────────────────────────── */
.p-nst-real__grid{display:grid;gap:var(--s-7);align-items:center}
@media (min-width:1024px){ .p-nst-real__grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-9)} }
.p-nst-candid{position:relative;padding-left:clamp(20px,2.4vw,36px);border-left:4px solid var(--steel)}
.p-nst-candid__label{display:flex;align-items:center;gap:10px;margin-bottom:var(--s-4);font:700 var(--fs-label)/1.3 var(--ff-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.p-nst-candid__label .i{width:18px;height:18px}
.p-nst-candid__title{font-size:clamp(2.5rem,1.4rem + 4vw,5rem);line-height:1;color:var(--text)}
.p-nst-candid__body{margin-top:var(--s-4);max-inline-size:34ch;font-size:var(--fs-lead);line-height:1.5;color:var(--text-2);text-wrap:pretty}
.p-nst-soon__label{margin-bottom:var(--s-4)}
.p-nst-soon__list{display:grid;gap:12px}
.p-nst-soon__item{display:flex;align-items:center;gap:16px;padding:16px 18px;background:var(--bg-0);border:1px dashed var(--line-strong)}
.p-nst-soon__icon{display:grid;place-items:center;width:52px;height:52px;flex:none;color:var(--plan);border:1px solid var(--line-strong);background:var(--surface)}
.p-nst-soon__icon .i{width:24px;height:24px}
.p-nst-soon__text{font:700 clamp(1.125rem,1rem + .4vw,1.375rem)/1.25 var(--ff-display);font-stretch:85%;color:var(--text)}

/* ─────────────────────────── 03 · ĐỀ XUẤT ─────────────────────────── */
@media (min-width:1024px){ .p-nst-offer__feat{grid-template-columns:minmax(0,7fr) minmax(0,5fr)} }
.p-nst-offer .feature__title{max-inline-size:14ch}
.p-nst-deal{margin-top:var(--s-6);display:grid;border-bottom:1px solid var(--line)}
.p-nst-deal__row{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:18px 0;border-top:1px solid var(--line)}
@media (min-width:640px){ .p-nst-deal__row{grid-template-columns:10rem minmax(0,1fr);gap:20px;align-items:baseline} }
.p-nst-deal dt{display:flex;align-items:center;gap:8px;font:700 var(--fs-label)/1.3 var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.p-nst-deal dt .i{width:18px;height:18px}
.p-nst-deal dd{margin:0;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.45;color:var(--text)}
.p-nst-deal dd .p-nst-deal__link{display:inline-flex;align-items:center;min-height:44px;padding-block:8px;font-size:1rem;font-family:var(--ff-mono)}

.p-nst-op-wrap{min-height:clamp(420px, 20vw + 240px, 520px);
  background:
    radial-gradient(60% 55% at 50% 40%, rgb(184 163 242 / .14), transparent 70%),
    radial-gradient(40% 40% at 50% 100%, rgb(255 159 28 / .10), transparent 70%),
    var(--bg-1)}
.p-nst-op{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;inline-size:min(100%, 320px);padding:22px 22px 26px;
  background:linear-gradient(180deg, #211d2e 0%, var(--surface) 55%, var(--bg-1) 100%);border:1px solid var(--nst-violet);box-shadow:var(--shadow-card), 0 0 0 1px rgb(0 0 0 / .4)}
.p-nst-op::before{content:"";position:absolute;inset:8px;pointer-events:none;--arm:16px;--hc:var(--nst-violet);
  background:
    linear-gradient(var(--hc),var(--hc)) top left / var(--arm) 2px, linear-gradient(var(--hc),var(--hc)) top left / 2px var(--arm),
    linear-gradient(var(--hc),var(--hc)) top right / var(--arm) 2px, linear-gradient(var(--hc),var(--hc)) top right / 2px var(--arm),
    linear-gradient(var(--hc),var(--hc)) bottom left / var(--arm) 2px, linear-gradient(var(--hc),var(--hc)) bottom left / 2px var(--arm),
    linear-gradient(var(--hc),var(--hc)) bottom right / var(--arm) 2px, linear-gradient(var(--hc),var(--hc)) bottom right / 2px var(--arm);
  background-repeat:no-repeat}
.p-nst-op__top{align-self:stretch;display:flex;justify-content:space-between;align-items:baseline}
.p-nst-op__code{font:400 2.5rem/1 var(--ff-stencil);color:var(--nst-violet)}
.p-nst-op__tier{font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2)}
.p-nst-op__icon{position:relative;display:grid;place-items:center;width:112px;height:112px;margin-top:10px;color:var(--text);
  border:1px solid var(--line-strong);background:radial-gradient(circle, rgb(184 163 242 / .18), transparent 70%)}
.p-nst-op__icon .i{width:60px;height:60px;stroke-width:1.2}
.p-nst-op__icon .p-nst-dot{position:absolute;top:12px;right:12px;margin:0}
.p-nst-op__role{margin-top:18px;display:inline-flex;padding:5px 12px;font:600 .875rem/1.2 var(--ff-body);color:var(--text);background:var(--surface-2);border:1px solid var(--nst-violet);border-radius:999px}
.p-nst-op__title{margin-top:12px;font:800 clamp(1.75rem,1.4rem + 1vw,2.25rem)/1 var(--ff-display);font-stretch:75%;text-transform:uppercase}
.p-nst-op__sub{margin-top:6px;font:500 var(--fs-micro)/1.3 var(--ff-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.p-nst-op__perks{align-self:stretch;margin-top:20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.p-nst-op__perks > span{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:14px;font:500 var(--fs-micro)/1.2 var(--ff-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-2)}
.p-nst-op__perks > span + span{border-left:1px solid var(--line)}
.p-nst-op__perks .i{width:22px;height:22px;color:var(--accent)}
.p-nst-op__stamp{position:absolute;right:-18px;bottom:64px;color:var(--khaki);background:rgb(11 13 12 / .8);font-size:1.25rem;transform:rotate(-8deg)}
@media (max-width:420px){ .p-nst-op__stamp{right:-6px} }

.p-nst-rules{margin-top:clamp(56px,6vw,96px);display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;padding:20px 24px;
  background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--danger)}
.p-nst-rules__label{display:flex;align-items:center;gap:8px;font:700 var(--fs-label)/1.3 var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text)}
.p-nst-rules__label .i{width:18px;height:18px;color:var(--danger)}
.p-nst-rules__no{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.p-nst-rules__no .chip{min-height:32px}
.p-nst-rules__no .chip s{text-decoration-thickness:2px}
.p-nst-rules__yes .chip{min-height:32px}
.p-nst-rules__crit{flex-basis:100%;padding-top:12px;border-top:1px solid var(--line);font-size:var(--fs-small);color:var(--text-2)}

/* ─────────────────────────── 04 · BƯỚC TIẾP THEO ─────────────────────────── */
.p-nst-go .deploy-cta__title{max-inline-size:16ch}
.p-nst-steps-wrap{position:relative;margin:clamp(40px,5vw,72px) auto 0;max-inline-size:1040px}
.p-nst-steps{position:relative;display:grid;gap:12px;list-style:none;margin:0;padding:0;text-align:left}
.p-nst-step{position:relative;display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:14px;min-width:0;
  padding:14px 16px;background:rgb(17 20 18 / .82);border:1px solid var(--line-strong)}
.p-nst-step__n{font:400 2rem/1 var(--ff-stencil);color:var(--text-3);min-width:1.1em}
.p-nst-step__icon{display:grid;place-items:center;width:48px;height:48px;flex:none;color:var(--accent);border:1px solid var(--line-strong);background:var(--surface)}
.p-nst-step__icon .i{width:24px;height:24px}
.p-nst-step__t{font:700 1.0625rem/1.35 var(--ff-body);color:var(--text);min-width:0}
.p-nst-step__t .token{font-family:var(--ff-mono);font-size:.875rem;font-weight:500;color:var(--text-2);white-space:normal;overflow-wrap:anywhere}
.p-nst-step--goal{border-color:var(--accent)}
.p-nst-step--goal .p-nst-step__n{color:var(--accent)}
.p-nst-step--goal .p-nst-step__icon{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.p-nst-steps__rail{position:absolute;left:30px;top:24px;bottom:24px;width:2px;background:var(--line);display:none}
.p-nst-steps__rail i{position:absolute;inset:0;background:var(--accent)}
@media (min-width:1024px){
  .p-nst-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;text-align:center}
  .p-nst-step{grid-template-columns:minmax(0,1fr);justify-items:center;gap:10px;padding:22px 16px 24px}
  .p-nst-step__n{position:absolute;top:12px;left:14px;font-size:1.5rem}
  .p-nst-step__icon{width:64px;height:64px}
  .p-nst-step__icon .i{width:30px;height:30px}
  .p-nst-steps__rail{display:block;left:12%;right:12%;top:55px;bottom:auto;width:auto;height:2px}
  .p-nst-steps__rail i{transform-origin:0 50%}
}
.p-nst-go .btn-row{margin-top:clamp(36px,4vw,56px)}

/* ── polish (round 2) ── */
.p-nst-offer .feature__title{max-inline-size:24ch}
.p-nst-op{inline-size:min(100%, 340px)}
.p-nst-op__title{font-size:clamp(1.625rem,1.3rem + .9vw,2rem)}
.p-nst-op__stamp{right:-22px;bottom:auto;top:132px}
.p-nst-viz--zone{justify-content:center}
.p-nst-mini-switches i::before{box-shadow:none;background:radial-gradient(circle at 13px 50%, #0B0D0C 0 3px, transparent 3.5px), var(--ok)}
.p-nst-step__t .token{display:block;margin-top:2px}
@media (min-width:1024px){ .p-nst-step{align-content:start} }

/* request rows flip to "Đã vào" (never removed → constant console height) */
.p-nst-req__done{display:none;align-items:center;gap:6px;min-height:44px;padding:0 10px;font:700 .75rem/1 var(--ff-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ok)}
.p-nst-req__done .i{width:16px;height:16px}
.p-nst-req.is-done{border-left-color:var(--ok);background:transparent}
.p-nst-req.is-done .p-nst-req__done{display:inline-flex}
.p-nst-req.is-done .p-nst-av{border-color:var(--line-strong);color:var(--text-3)}
.p-nst-req.is-done .p-nst-req__who{color:var(--text-2)}
.p-nst-req.is-done .p-nst-req__wait{display:none !important}
html.no-js .p-nst-req__wait{min-height:44px;align-items:center;padding:0 10px}
.p-nst-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px;min-height:52px;margin-top:10px;border-top:1px solid var(--line)}
.p-nst-foot .p-nst-status{margin:0;padding:8px 0;border:0;min-height:0}
.p-nst-foot .p-nst-reset{margin:0}
/* short desktop viewports: tighten the console so it fits beside the headline */
@media (min-width:1024px) and (max-height:820px){
  .p-nst-air{padding:14px 20px 12px}
  .p-nst-lamp{width:44px;height:44px}
  .p-nst-msg{padding:10px 20px 12px}
  .p-nst-room{padding-top:12px}
  .p-nst-slots{margin-top:10px}
  .p-nst-slot{padding:8px 6px 6px;gap:4px}
  .p-nst-av{width:40px;height:40px}
  .p-nst-queue{margin-top:10px;padding-top:8px}
  .p-nst-req{padding-block:4px}
  .p-nst-foot{min-height:48px;margin-top:6px}
}

/* deploy band over the creator terrain (same recipe as the Sảnh deploy band): calm zone behind the steps, top fade */
.p-nst-go__terrain{--terrain-calm:.85;--terrain-calm-x:50%;--terrain-calm-y:50%;--terrain-calm-w:88%;--terrain-calm-h:80%;--terrain-fade:var(--bg-0)}
.p-nst-go__terrain::before{opacity:.6}
.p-nst-go .deploy-cta__bg::after{content:"";position:absolute;left:0;right:0;top:0;height:28%;z-index:2;background:linear-gradient(180deg, var(--bg-0), transparent)}
.p-nst-go .deploy-cta__beam{z-index:1}

/* ─────────────────────────── v3 · PITCH-v3 §3 (unit CREATOR) ─────────────────────────── */
/* hero console gains an event row (lịch có nhắc giờ) → tighten the on-air bar a little */
.p-nst-air{padding:18px 20px 14px}
.p-nst-evt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 20px;border-bottom:1px solid var(--line);
  background:rgb(184 163 242 / .05)}
.p-nst-evt__time{padding-right:12px;font:400 1.5rem/1 var(--ff-stencil);color:var(--accent);border-right:1px dashed var(--line-strong)}
.p-nst-evt__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.p-nst-evt__body b{font:700 .9375rem/1.2 var(--ff-body);color:var(--text)}
.p-nst-evt__body small{display:inline-flex;align-items:center;gap:6px;font:500 var(--fs-micro)/1.25 var(--ff-mono);letter-spacing:.04em;color:var(--text-2)}
.p-nst-evt__body small .i{width:12px;height:12px;flex:none;color:var(--nst-violet)}
.p-nst-evt__bell{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;font:700 var(--fs-micro)/1 var(--ff-mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ok);background:var(--ok-bg);border:1px solid rgb(124 203 139 / .45);white-space:nowrap}
.p-nst-evt__bell .i{width:13px;height:13px;transform-origin:50% 10%}
html.motion-ok .p-nst-hero[data-onair="on"] .p-nst-evt__bell .i{animation:p-nst-ring 900ms var(--ease-out) 1 400ms}
@keyframes p-nst-ring{0%,100%{rotate:0deg}20%{rotate:18deg}40%{rotate:-14deg}60%{rotate:9deg}80%{rotate:-5deg}}
@media (max-width:420px){ .p-nst-evt{grid-template-columns:auto minmax(0,1fr);row-gap:8px} .p-nst-evt__bell{grid-column:2;justify-self:start} }
@media (min-width:1024px) and (max-height:820px){ .p-nst-evt{padding-block:7px} .p-nst-evt__time{font-size:1.25rem} }

/* keypoints band: violet hint behind the band, emoji in bright text stays on one line */
.p-nst-kp .keypoint__text strong{white-space:nowrap}

/* candour: the second sentence carries the "founding creator" framing */
.p-nst-candid__title em{font-style:normal;color:var(--accent)}
.p-nst-candid__body{max-inline-size:40ch}

/* proposal: the "what it costs you" row is the one to point at in a meeting */
.p-nst-deal__row--cost{position:relative;margin-inline:-12px;padding-inline:12px;background:rgb(255 159 28 / .07);border-top-color:rgb(255 159 28 / .5);box-shadow:inset 3px 0 0 var(--accent)}
.p-nst-deal__row--cost + .p-nst-deal__row{border-top-color:rgb(255 159 28 / .5)}
.p-nst-deal__row--cost dd strong{color:var(--accent-hi, var(--accent));font-weight:700}

/* steps: the live invite, readable aloud in a meeting */
.p-nst-step__t .p-nst-step__link{display:inline-flex;align-items:center;min-height:44px;margin-top:0;color:var(--accent);text-decoration:underline;text-decoration-color:rgb(255 159 28 / .5);text-underline-offset:3px}
.p-nst-step__t .p-nst-step__link:hover{color:var(--text)}
@media (min-width:1024px){ .p-nst-step__t .p-nst-step__link{display:flex;justify-content:center} }

/* v3 hero headline: two sentences, one per line ("Sân khấu cho bạn." / "Đội hình cho fan.") */
.p-nst-hero .hero__title{max-inline-size:none;font-size:clamp(2.625rem, 1rem + 4.6vw, 5.25rem)}
.p-nst-hero__line{display:block}
@media (min-width:480px){ .p-nst-hero__line{white-space:nowrap} }

/* v3: "song song kênh riêng" line under the candid body */
.p-nst-candid__plus{margin-top:var(--s-3)}
.p-nst-candid__plus strong{color:var(--text)}
