:root{
  --bg:#0f1724;
  --card:#0b1220ff;
  --glass: rgba(255,255,255,0.04);
  --accent1: linear-gradient(135deg,#7b61ff 0%, #4cc3ff 100%);
  --muted:#9aa4b2;
}

.nt-pro-wrap { max-width:960px; margin:24px auto; font-family:Inter,Segoe UI,Arial; color:#e6eef8; }
.nt-header { display:flex; align-items:center; gap:16px; margin-bottom:18px; }
.nt-brand { display:flex; gap:12px; align-items:center; }
.nt-logo { width:58px; height:58px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-weight:700; background:var(--accent1); color:#fff; box-shadow: 0 8px 30px rgba(76,195,255,0.12); font-size:18px; }
.nt-header h1 { margin:0; font-size:18px; }
.nt-header h1 span{ font-weight:400; color:var(--muted); font-size:14px; display:block; }
.nt-sub{ margin:0; color:var(--muted); font-size:13px; }

.nt-main{ background:transparent; }

.nt-tabs{ display:flex; gap:8px; margin-bottom:16px; }
.nt-tab{ padding:10px 14px; border-radius:999px; background:transparent; border:1px solid rgba(255,255,255,0.06); cursor:pointer; color:var(--muted); transition:all .25s; }
.nt-tab.nt-active{ background:var(--glass); color:#fff; transform:translateY(-2px); box-shadow:0 6px 18px rgba(2,6,23,0.6); border:1px solid rgba(255,255,255,0.08); }

.nt-card{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); border-radius:14px; padding:16px; box-shadow: 0 6px 30px rgba(2,6,23,0.6); border:1px solid rgba(255,255,255,0.03); }

.nt-label{ display:block; margin-bottom:8px; font-weight:600; color:#dceeff; }
.nt-input{ width:100%; min-height:140px; padding:12px; border-radius:10px; border:1px solid rgba(255,255,255,0.04); background:rgba(255,255,255,0.02); color:#eaf4ff; resize:vertical; font-size:14px; }

.nt-controls{ display:flex; gap:12px; align-items:center; margin-top:12px; flex-wrap:wrap; }
.nt-control-group{ display:flex; gap:8px; align-items:center; }
.nt-right{ margin-left:auto; display:flex; gap:8px; }

.nt-select{ padding:8px 10px; border-radius:8px; background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.03); color:#eaf4ff; }

.nt-small input[type=range]{ vertical-align:middle; }

.nt-btn{ padding:10px 14px; border-radius:10px; border:0; cursor:pointer; font-weight:600; box-shadow: 0 8px 22px rgba(11,18,32,0.6); transition:transform .12s ease, box-shadow .12s; background:rgba(255,255,255,0.03); color:#eaf4ff; }
.nt-btn:hover{ transform:translateY(-3px); box-shadow: 0 12px 30px rgba(11,18,32,0.7); }
.nt-primary{ background: linear-gradient(135deg,#4cc3ff,#7b61ff); color:#00101f; }
.nt-danger{ background: linear-gradient(135deg,#ff7a7a,#ff5a43); color:#fff; }
.nt-ghost{ background:transparent; border:1px dashed rgba(255,255,255,0.04); }
.nt-download{ background: linear-gradient(90deg,#ffd36b,#ff9a6b); color:#081017; }

.nt-ico{ margin-left:8px; font-size:12px; opacity:0.9; }

.nt-foot{ font-size:12px; color:var(--muted); margin-top:12px; }

.nt-stt-row{ display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.nt-record-controls{ display:flex; gap:8px; align-items:center; }

.nt-toast{ position:fixed; right:24px; bottom:24px; background:rgba(2,6,23,0.9); padding:12px 16px; border-radius:10px; color:#fff; opacity:0; transform:translateY(20px); transition:all .3s; z-index:9999; }
.nt-toast.show{ opacity:1; transform:translateY(0); }

@media (max-width:720px){
  .nt-pro-wrap{ padding:12px; }
  .nt-header{ gap:10px; align-items:flex-start; }
  .nt-logo{ width:48px; height:48px; font-size:16px; }
  .nt-controls{ flex-direction:column; align-items:stretch; }
  .nt-right{ margin-left:0; }
}