/* ══════════════════════════════════════════
   AgentEdge — Shared Stylesheet
   agent-edge.css
   ══════════════════════════════════════════ */

/* ── DESIGN TOKENS ── */
:root {
  --bg:        #060C18;
  --bg2:       #0A1220;
  --bg3:       #0D1628;
  --cyan:      #00D4F5;
  --cyan-dim:  #0099CC;
  --cyan-glow: rgba(0,212,245,0.12);
  --white:     #FFFFFF;
  --off-white: #D8E8F0;
  --muted:     #5A7A8A;
  --border:    rgba(0,212,245,0.12);
  --gold:      #C9A84C;
  --card-bg:   rgba(13,22,40,0.8);
  --purple:    #8B5CF6;
  --pink:      #EC4899;
  --red:       #DC2626;
  --green:     #10B981;
  --amber:     #F59E0B;
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family:'DM Sans', system-ui, sans-serif;
  background:var(--bg);
  color:var(--white);
  overflow-x:hidden;
  min-height:100vh;
  line-height:1.6;
}

/* ── NOISE TEXTURE ── */
body::before {
  content:'';
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:0;
  opacity:0.4;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3, .syne { font-family:'DM Sans', sans-serif; font-weight:700; }

/* Syne font has tall descenders — prevent clipping */
h1, h2, h3, .syne,
.nav-logo-text,
.tool-title,
.section-header h2 {
  line-height:1.5;
  overflow:visible;
  -webkit-text-size-adjust:100%;
}

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:20px 40px 20px;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(6,12,24,0.95);
  border-bottom:1px solid var(--border);
  overflow:visible;
}

.nav-logo {
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
  overflow:visible;
}
.nav-logo img {
  width:32px; height:32px;
  flex-shrink:0;
}
.nav-logo-text {
  font-family:'DM Sans', sans-serif;
  font-size:1.1rem; font-weight:700;
  color:var(--white);
  letter-spacing:-0.02em;
  line-height:1.4;
}
.nav-logo-text span { color:var(--cyan); }

.nav-right {
  display:flex; align-items:center; gap:24px;
}
.nav-link {
  font-size:0.82rem; color:var(--muted);
  text-decoration:none; transition:color 0.2s;
}
.nav-link:hover { color:var(--cyan); }

.nav-agent {
  display:flex; align-items:center; gap:10px;
}
.nav-agent-avatar {
  width:32px; height:32px; border-radius:50%;
  background:linear-gradient(135deg,#1A4060,#0D2840);
  border:2px solid var(--cyan);
  display:flex; align-items:center; justify-content:center;
  font-size:0.7rem; color:var(--cyan); font-weight:700;
}
.nav-agent-name {
  font-size:0.85rem; color:var(--off-white); font-weight:500;
}

/* ── BUTTONS ── */
.btn-primary {
  background:var(--cyan); color:var(--bg);
  font-family:'DM Sans', sans-serif;
  font-size:0.95rem; font-weight:600;
  padding:14px 32px; border-radius:8px;
  text-decoration:none; border:none; cursor:pointer;
  transition:background 0.2s, transform 0.15s, box-shadow 0.2s;
  box-shadow:0 0 28px rgba(0,212,245,0.25);
  display:inline-block;
}
.btn-primary:hover {
  background:#00BBDD;
  transform:translateY(-2px);
  box-shadow:0 0 40px rgba(0,212,245,0.35);
}
.btn-primary:disabled {
  background:var(--muted); cursor:not-allowed;
  box-shadow:none; transform:none;
}

/* ── CARDS ── */
.card {
  background:rgba(13,22,40,0.95);
  border:1px solid var(--border);
  border-radius:14px;
  padding:28px 24px;
  transition:border-color 0.3s, transform 0.3s, box-shadow 0.3s;
  position:relative;
  overflow:visible;
}
.card:hover {
  border-color:rgba(0,212,245,0.35);
  transform:translateY(-3px);
  box-shadow:0 8px 32px rgba(0,212,245,0.08);
}
.card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity:0; transition:opacity 0.3s;
}
.card:hover::before { opacity:0.5; }

/* ── WELCOME BANNER ── */
.welcome {
  background:rgba(13,22,40,0.95);
  border:1px solid var(--border);
  border-radius:16px;
  padding:36px 40px;
  margin-bottom:48px;
  position:relative; overflow:visible;
}
.welcome::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity:0.5;
}
.welcome::after {
  content:''; position:absolute; top:-80px; right:-80px;
  width:300px; height:300px;
  background:radial-gradient(ellipse, rgba(0,212,245,0.06) 0%, transparent 70%);
  pointer-events:none;
}
.welcome h1 {
  font-size:1.8rem; font-weight:800;
  letter-spacing:-0.03em; margin-bottom:8px;
}
.welcome h1 .accent { color:var(--cyan); }
.welcome p {
  font-size:0.95rem; color:var(--off-white);
  opacity:0.6; line-height:1.6; font-weight:300;
  max-width:600px;
}

/* ── SECTION HEADERS ── */
.section-header {
  display:flex; align-items:center; gap:12px;
  margin-bottom:20px; margin-top:8px;
}
.section-header h2 {
  font-size:1.15rem; font-weight:700; color:var(--white);
  line-height:1.6;
}
.section-line { flex:1; height:1px; background:var(--border); }
.section-badge {
  font-size:0.65rem; font-weight:700; color:var(--cyan);
  background:rgba(0,212,245,0.08);
  border:1px solid rgba(0,212,245,0.2);
  border-radius:20px; padding:3px 12px;
  letter-spacing:0.08em; text-transform:uppercase;
}
.section-badge.gold {
  color:var(--gold);
  background:rgba(201,168,76,0.08);
  border-color:rgba(201,168,76,0.2);
}

/* ── TOOL CARDS GRID ── */
.tools-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
  margin-bottom:48px;
}

.tool-card {
  background:rgba(13,22,40,0.95);
  border:1px solid var(--border);
  border-radius:14px;
  padding:28px 24px;
  transition:border-color 0.3s, transform 0.3s, box-shadow 0.3s;
  position:relative; overflow:visible;
  cursor:pointer; text-decoration:none;
  display:flex; flex-direction:column;
}
.tool-card:hover {
  border-color:rgba(0,212,245,0.35);
  transform:translateY(-3px);
  box-shadow:0 8px 32px rgba(0,212,245,0.08);
}
.tool-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity:0; transition:opacity 0.3s;
}
.tool-card:hover::before { opacity:0.5; }

.tool-icon {
  width:44px; height:44px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; margin-bottom:16px; flex-shrink:0;
}
.tool-icon.pdf    { background:rgba(139,92,246,0.12); border:1px solid rgba(139,92,246,0.25); }
.tool-icon.email  { background:rgba(0,212,245,0.08);  border:1px solid rgba(0,212,245,0.2); }
.tool-icon.social { background:rgba(236,72,153,0.1);  border:1px solid rgba(236,72,153,0.25); }
.tool-icon.content{ background:rgba(201,168,76,0.12); border:1px solid rgba(201,168,76,0.25); }

.tool-title {
  font-family:'DM Sans', sans-serif;
  font-size:1rem; font-weight:700; color:var(--white);
  margin-bottom:8px;
  line-height:1.4;
}
.tool-desc {
  font-size:0.82rem; color:var(--off-white);
  opacity:0.55; line-height:1.6; font-weight:300; flex:1;
}

.tool-meta {
  display:flex; align-items:center; gap:12px;
  margin-top:16px; padding-top:14px;
  border-top:1px solid rgba(255,255,255,0.04);
}
.tool-tag {
  font-size:0.65rem; font-weight:600;
  letter-spacing:0.06em; text-transform:uppercase;
  padding:3px 8px; border-radius:4px;
}
.tag-pdf    { color:#a78bfa; background:rgba(139,92,246,0.1); }
.tag-email  { color:var(--cyan); background:rgba(0,212,245,0.08); }
.tag-social { color:#ec4899; background:rgba(236,72,153,0.08); }
.tool-time  { font-size:0.72rem; color:var(--muted); margin-left:auto; }

.tool-arrow {
  position:absolute; top:24px; right:24px;
  font-size:1rem; color:var(--muted);
  transition:color 0.3s, transform 0.3s;
}
.tool-card:hover .tool-arrow { color:var(--cyan); transform:translateX(3px); }

.tool-card.coming-soon { opacity:0.5; pointer-events:none; }
.tool-card.coming-soon .tool-arrow { display:none; }
.coming-soon-badge {
  position:absolute; top:14px; right:14px;
  font-size:0.6rem; font-weight:700; color:var(--gold);
  background:rgba(201,168,76,0.1); border:1px solid rgba(201,168,76,0.2);
  border-radius:20px; padding:2px 10px;
  letter-spacing:0.08em; text-transform:uppercase;
}

/* ── FORM STYLES ── */
.form-container {
  position:relative; z-index:1;
  max-width:580px; margin:0 auto;
  padding:100px 20px 60px;
}

.form-header {
  background:rgba(13,22,40,0.95);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px 32px;
  margin-bottom:32px;
  text-align:center;
  position:relative; overflow:visible;
}
.form-header::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity:0.5;
}
.form-header-icon {
  font-size:6.4rem;
  margin-bottom:16px;
  line-height:1;
}
.form-header h1 {
  font-size:1.4rem; font-weight:800;
  letter-spacing:-0.02em; margin-bottom:6px;
  line-height:1.4; padding-bottom:2px;
}
.form-header p {
  font-size:0.85rem; color:var(--off-white);
  opacity:0.5; font-weight:300;
}
.form-header .badge {
  display:inline-flex; align-items:center; gap:6px;
  margin-top:10px;
  font-size:0.6rem; font-weight:700; color:var(--green);
  background:rgba(16,185,129,0.08);
  border:1px solid rgba(16,185,129,0.2);
  border-radius:20px; padding:3px 12px;
  letter-spacing:0.08em; text-transform:uppercase;
}
.form-header .badge img {
  width:16px; height:16px;
  flex-shrink:0;
}

.trial-page-info {
  text-align:center;
  font-size:0.78rem; font-weight:600;
  color:var(--cyan);
  background:rgba(0,212,245,0.06);
  border:1px solid rgba(0,212,245,0.15);
  border-radius:10px;
  padding:10px 16px;
  margin-bottom:24px;
  letter-spacing:0.02em;
}
.trial-page-info.trial-page-empty {
  color:var(--gold, #C9A84C);
  background:rgba(201,168,76,0.06);
  border-color:rgba(201,168,76,0.2);
}

.form-section-label {
  font-size:0.68rem; font-weight:700;
  color:var(--cyan); letter-spacing:1.5px;
  text-transform:uppercase;
  margin:28px 0 14px;
  padding-bottom:8px;
  border-bottom:1px solid var(--border);
}

.form-field { margin-bottom:16px; }
.form-field label {
  display:block; font-size:0.8rem;
  font-weight:500; color:var(--off-white);
  opacity:0.7; margin-bottom:5px;
}
.form-field label .req { color:var(--red); margin-left:2px; }

.form-field input,
.form-field select,
.form-field textarea {
  width:100%; padding:10px 14px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:8px;
  font-size:0.9rem; font-family:inherit;
  color:var(--white);
  transition:border-color 0.2s, box-shadow 0.2s;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline:none;
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(0,212,245,0.08);
}
.form-field input::placeholder,
.form-field textarea::placeholder { color:var(--muted); }
.form-field textarea { min-height:80px; resize:vertical; }
.form-field select {
  appearance:none;
  color-scheme:dark;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%235A7A8A' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:36px;
}
.form-field select option {
  background-color:#0D1628;
  color:#FFFFFF;
}
.form-field .hint {
  font-size:0.7rem; color:var(--muted); margin-top:3px;
}

.form-row { display:flex; gap:12px; }
.form-row .form-field { flex:1; }

.form-submit-btn {
  width:100%; padding:14px;
  background:var(--cyan); color:var(--bg);
  border:none; border-radius:10px;
  font-size:1rem; font-weight:700;
  font-family:inherit; cursor:pointer;
  margin-top:24px;
  transition:background 0.2s, transform 0.15s;
  box-shadow:0 0 28px rgba(0,212,245,0.2);
}
.form-submit-btn:hover {
  background:#00BBDD;
  transform:translateY(-2px);
}
.form-submit-btn:disabled {
  background:var(--muted); cursor:not-allowed;
  box-shadow:none; transform:none;
}

.form-success {
  display:none; text-align:center; padding:60px 24px;
}
.form-success .icon { font-size:48px; margin-bottom:16px; color:var(--cyan); }
.form-success h2 {
  font-size:1.3rem; font-weight:700; margin-bottom:8px;
}
.form-success p {
  font-size:0.9rem; color:var(--off-white);
  opacity:0.6; line-height:1.6;
}

.form-error {
  display:none;
  background:rgba(220,38,38,0.08);
  border:1px solid rgba(220,38,38,0.2);
  border-radius:8px; padding:12px 16px;
  margin-bottom:16px;
  font-size:0.82rem; color:#FCA5A5;
}

.form-back-link {
  display:inline-flex; align-items:center; gap:6px;
  font-size:0.82rem; color:var(--muted);
  text-decoration:none; margin-bottom:20px;
  transition:color 0.2s;
}
.form-back-link:hover { color:var(--cyan); }

/* ── FOOTER ── */
.dash-footer {
  text-align:center; padding:40px 0 20px;
  border-top:1px solid var(--border);
  margin-top:40px;
}
.dash-footer p { font-size:0.78rem; color:var(--muted); }
.dash-footer a { color:var(--cyan); text-decoration:none; }

/* ── ANIMATIONS ── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}

.reveal {
  opacity:0; transform:translateY(24px);
  transition:opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:960px) {
  nav { padding:14px 20px; }
  .tools-grid { grid-template-columns:1fr 1fr; }
  .welcome { padding:28px 24px; }
  .welcome h1 { font-size:1.4rem; }
  .form-container { padding:90px 16px 40px; }
  .form-row { flex-direction:column; gap:0; }
}
@media(max-width:600px) {
  .tools-grid { grid-template-columns:1fr; }
  .nav-agent-name { display:none; }
  .nav-right { gap:16px; }
}

/* ── DASHBOARD CARD / BADGE STYLES ───────────────────────────────────────── */
/* Promoted from Dashboard.aspx so the CoachingEdge / ClientEdge / AgentEdge
   pages share the same card look. Dashboard.aspx still has duplicate inline
   copies (harmless) so it remains untouched. */

.tool-card-disabled {
  opacity:0.4;
  pointer-events:none;
  cursor:default;
}
.tool-card-disabled .tool-arrow { display:none; }

.trial-badge {
  position:absolute;
  top:12px; right:12px;
  font-size:0.6rem;
  font-weight:700;
  color:var(--cyan);
  background:rgba(0,212,245,0.08);
  border:1px solid rgba(0,212,245,0.2);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.04em;
}
.trial-badge.trial-empty {
  color:var(--muted);
  background:rgba(255,255,255,0.04);
  border-color:rgba(255,255,255,0.08);
}

.nav-subscribed-badge {
  font-size:0.65rem;
  font-weight:700;
  color:var(--green, #10B981);
  background:rgba(16,185,129,0.1);
  border:1px solid rgba(16,185,129,0.25);
  border-radius:20px;
  padding:4px 14px;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.nav-premium-badge {
  font-size:0.65rem;
  font-weight:700;
  color:var(--bg);
  background:linear-gradient(135deg, #C9A84C 0%, #E8C76B 50%, #C9A84C 100%);
  border:1px solid rgba(201,168,76,0.6);
  border-radius:20px;
  padding:4px 14px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  box-shadow:0 0 14px rgba(201,168,76,0.35);
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.nav-premium-badge::before {
  content:'\2605';
  font-size:0.7rem;
  line-height:1;
}
.nav-subscribe-btn {
  font-size:0.75rem;
  font-weight:700;
  color:var(--bg);
  background:var(--cyan);
  border-radius:6px;
  padding:6px 16px;
  text-decoration:none;
  transition:background 0.2s, transform 0.15s;
  box-shadow:0 0 16px rgba(0,212,245,0.2);
}
.nav-subscribe-btn:hover {
  background:#00BBDD;
  transform:translateY(-1px);
}
.nav-trial-badge {
  font-size:0.65rem;
  font-weight:700;
  color:var(--gold, #C9A84C);
  background:rgba(201,168,76,0.1);
  border:1px solid rgba(201,168,76,0.25);
  border-radius:20px;
  padding:4px 14px;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.profile-link-wrap {
  position:relative;
  display:inline-flex;
  align-items:center;
}
.profile-incomplete-bubble {
  position:absolute;
  top:calc(100% + 10px);
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  font-size:0.68rem;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--bg);
  background:var(--gold, #C9A84C);
  padding:6px 12px;
  border-radius:20px;
  text-decoration:none;
  box-shadow:0 0 0 0 rgba(201,168,76,0.7);
  animation:profilePulse 2s ease-out infinite;
  z-index:10;
}
.profile-incomplete-bubble::before {
  content:'';
  position:absolute;
  top:-5px;
  left:50%;
  transform:translateX(-50%) rotate(45deg);
  width:10px; height:10px;
  background:var(--gold, #C9A84C);
}
.profile-incomplete-bubble:hover {
  background:#D8B65A;
  transform:translateX(-50%) translateY(-1px);
}
@keyframes profilePulse {
  0%   { box-shadow:0 0 0 0 rgba(201,168,76,0.55); }
  70%  { box-shadow:0 0 0 12px rgba(201,168,76,0); }
  100% { box-shadow:0 0 0 0 rgba(201,168,76,0); }
}

.section-badge.premium-gold {
  color:var(--bg);
  background:linear-gradient(135deg,#C9A84C 0%,#E8C76B 50%,#C9A84C 100%);
  border-color:rgba(201,168,76,0.6);
  font-weight:700;
}
.tool-card.premium-card {
  border:1px solid rgba(201,168,76,0.45);
  background:linear-gradient(180deg, rgba(201,168,76,0.06) 0%, rgba(13,22,40,0.95) 60%);
  box-shadow:0 0 24px rgba(201,168,76,0.08);
}
.tool-card.premium-card:hover {
  border-color:rgba(232,199,107,0.7);
  box-shadow:0 0 32px rgba(201,168,76,0.18);
}
.tool-card.premium-card .tool-arrow { color:#E8C76B; }

.premium-corner {
  position:absolute;
  top:12px; right:12px;
  font-size:0.6rem; font-weight:700;
  color:var(--bg);
  background:linear-gradient(135deg,#C9A84C 0%,#E8C76B 50%,#C9A84C 100%);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.saved-corner {
  position:absolute;
  top:12px; left:12px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:0.6rem; font-weight:700;
  color:var(--green, #10B981);
  background:rgba(16,185,129,0.1);
  border:1px solid rgba(16,185,129,0.3);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.05em;
  text-transform:uppercase;
}
.saved-corner .check {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px; height:14px;
  background:var(--green, #10B981);
  color:#fff;
  border-radius:50%;
  font-size:0.7rem;
  line-height:1;
}
.processing-corner {
  position:absolute;
  top:12px; left:12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.6rem; font-weight:700;
  color:var(--gold, #C9A84C);
  background:rgba(201,168,76,0.1);
  border:1px solid rgba(201,168,76,0.35);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.05em;
  text-transform:uppercase;
}
.processing-corner .dot {
  width:7px; height:7px;
  border-radius:50%;
  background:var(--gold, #C9A84C);
  animation:processingPulse 1.2s ease-in-out infinite;
}
@keyframes processingPulse {
  0%, 100% { opacity:1; transform:scale(1); }
  50%      { opacity:0.4; transform:scale(0.7); }
}

.new-corner {
  position:absolute;
  top:12px; left:12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.62rem; font-weight:800;
  color:#0B0F14;
  background:linear-gradient(135deg,#E8C76B,#C9A84C);
  border:1px solid rgba(232,199,107,0.6);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  box-shadow:0 0 14px rgba(232,199,107,0.35);
}
.new-corner .dot {
  width:7px; height:7px;
  border-radius:50%;
  background:#0B0F14;
  animation:newPulse 1.2s ease-in-out infinite;
}
@keyframes newPulse {
  0%, 100% { opacity:1; transform:scale(1); }
  50%      { opacity:0.45; transform:scale(0.7); }
}
.tool-card.has-new {
  border-color:rgba(232,199,107,0.5);
  box-shadow:0 0 24px rgba(201,168,76,0.18);
}
.tool-card.has-new:hover {
  border-color:rgba(232,199,107,0.85);
  box-shadow:0 0 32px rgba(201,168,76,0.3);
}

.tool-card.tool-card-locked {
  opacity:0.55;
  cursor:default;
  pointer-events:none;
}
.tool-card.tool-card-locked .tool-arrow { display:none; }
.locked-corner {
  position:absolute;
  top:12px; left:12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.6rem; font-weight:700;
  color:var(--off-white);
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.15);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.05em;
  text-transform:uppercase;
}

.section-header.agentedge-header { margin-top:10px; }
.section-header.agentedge-header h2 {
  font-size:1.6rem;
  letter-spacing:-0.01em;
}
.section-header.agentedge-header h2::after {
  content:"";
  display:block;
  width:36px; height:3px;
  background:var(--cyan);
  border-radius:2px;
  margin-top:6px;
}
.section-badge.agentedge-badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(0,212,245,0.08);
  color:var(--cyan);
  border:1px solid rgba(0,212,245,0.25);
}
.section-badge.agentedge-badge img {
  width:14px; height:14px; opacity:0.9;
}

/* ── AE / CE USAGE COUNTER PILL ─────────────────────────────────────── */
.usage-pill {
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:0.7rem;
  font-weight:700;
  color:var(--off-white);
  background:rgba(0,212,245,0.08);
  border:1px solid rgba(0,212,245,0.25);
  border-radius:20px;
  padding:4px 12px;
  letter-spacing:0.04em;
  text-decoration:none;
  font-variant-numeric:tabular-nums;
}
.usage-pill .lbl { color:var(--muted); font-weight:600; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.08em; }
.usage-pill .num { color:var(--cyan); font-weight:800; }
.usage-pill .sep { color:var(--muted); }
.usage-pill .max { color:var(--off-white); }
.usage-pill.warn  { background:rgba(245,158,11,0.08); border-color:rgba(245,158,11,0.3); }
.usage-pill.warn .num { color:#FCD34D; }
.usage-pill.full  { background:rgba(220,38,38,0.08); border-color:rgba(220,38,38,0.3); }
.usage-pill.full .num { color:#FCA5A5; }
.usage-pill.unlimited .num { color:#10B981; }

/* Corner-positioned variant of usage-pill - drops into card top-right slot. */
.usage-pill.corner {
  position:absolute;
  top:12px; right:12px;
  font-size:0.62rem;
  padding:3px 10px;
}
.usage-pill.corner .lbl { font-size:0.55rem; }
.usage-pill.corner .num { font-size:0.7rem; }

/* ── ACTIVITY TRENDS CHART (shared across SessionDetail / CoachingDashboard / AICoaching) ── */
.trends-card{background:rgba(13,22,40,0.95);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:18px;}
.trends-card .range-tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap;}
.trends-card .range-tab{padding:6px 12px;background:rgba(255,255,255,0.04);border:1px solid var(--border);color:var(--off-white);border-radius:7px;font-family:inherit;font-size:0.78rem;font-weight:600;cursor:pointer;}
.trends-card .range-tab.active{background:var(--cyan);color:var(--bg);border-color:var(--cyan);}
.trends-card .chart-grid{display:grid;grid-template-columns:1fr;gap:14px;}
@media(min-width:880px){.trends-card .chart-grid{grid-template-columns:1fr 1fr;}}
.trends-card .chart-block{background:rgba(255,255,255,0.025);border:1px solid var(--border);border-radius:10px;padding:12px;}
.trends-card .chart-block h4{margin:0 0 8px;font-size:0.78rem;color:var(--off-white);font-weight:700;text-transform:uppercase;letter-spacing:0.05em;display:flex;align-items:center;justify-content:space-between;}
.trends-card .chart-block h4 .stat{color:var(--cyan);font-weight:800;font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0;}
.trends-card .chart-svg{width:100%;height:180px;display:block;}
.trends-card .chart-svg .grid{stroke:rgba(255,255,255,0.06);stroke-width:1;}
.trends-card .chart-svg .axis{stroke:rgba(255,255,255,0.12);stroke-width:1;}
.trends-card .chart-svg .label{fill:#64748B;font-size:10px;font-family:'DM Sans';}
.trends-card .chart-svg .area{fill:rgba(0,212,245,0.12);}
.trends-card .chart-svg .line{fill:none;stroke:var(--cyan);stroke-width:2;}
.trends-card .chart-svg .dot{fill:var(--cyan);}
.trends-card .chart-svg .line2{fill:none;stroke:#A78BFA;stroke-width:2;}
.trends-card .chart-svg .dot2{fill:#A78BFA;}
.trends-card .chart-svg .line3{fill:none;stroke:#10B981;stroke-width:2;}
.trends-card .chart-svg .dot3{fill:#10B981;}
.trends-card .chart-svg .line4{fill:none;stroke:#F59E0B;stroke-width:2;}
.trends-card .chart-svg .dot4{fill:#F59E0B;}
.trends-card .chart-svg .empty{fill:#64748B;font-size:11px;font-family:'DM Sans';}
.trends-card .chart-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font-size:0.72rem;color:var(--muted);}
.trends-card .chart-legend .swatch{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:middle;}

/* ── START HERE corner badge (onboarding bootstrap) ───────────────────────── */
.start-here-corner {
  position:absolute;
  top:12px; left:12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.62rem;
  font-weight:800;
  color:#0B0F14;
  background:linear-gradient(135deg,#E8C76B,#C9A84C);
  border:1px solid rgba(232,199,107,0.6);
  border-radius:20px;
  padding:3px 10px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  box-shadow:0 0 18px rgba(232,199,107,0.45), 0 0 0 0 rgba(232,199,107,0.6);
  animation:startHerePulse 1.6s ease-in-out infinite;
  z-index:2;
}
@keyframes startHerePulse {
  0%, 100% { box-shadow:0 0 18px rgba(232,199,107,0.45), 0 0 0 0 rgba(232,199,107,0.6); }
  50%      { box-shadow:0 0 26px rgba(232,199,107,0.6),  0 0 0 6px rgba(232,199,107,0); }
}
.tool-card.premium-card:has(.start-here-corner) {
  border-color:rgba(232,199,107,0.8);
  box-shadow:0 0 36px rgba(232,199,107,0.25);
}

/* -- Free trial banner (rendered by PremiumPageBase.TrialBannerHtml) --------- */
.trial-banner{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap;
  padding:9px 16px; margin:0 0 14px;
  background:rgba(0,212,245,0.07);
  border:1px solid rgba(0,212,245,0.3);
  border-radius:10px;
  font-size:0.84rem; color:var(--off-white);
}
.trial-banner .tb-msg strong{ color:var(--cyan); font-weight:800; }
.trial-banner .tb-cta{
  font-size:0.78rem; font-weight:800;
  color:#0B0F14; background:#10B981;
  padding:6px 14px; border-radius:7px;
  text-decoration:none; letter-spacing:0.02em;
}
.trial-banner .tb-cta:hover{ filter:brightness(1.06); }
.trial-banner.urgent{
  background:linear-gradient(135deg, rgba(201,168,76,0.18), rgba(232,199,107,0.12));
  border-color:rgba(232,199,107,0.6);
  box-shadow:0 0 18px rgba(232,199,107,0.18);
}
.trial-banner.urgent .tb-msg strong{ color:#E8C76B; }
.trial-banner.urgent .tb-cta{
  background:linear-gradient(135deg, #C9A84C, #E8C76B);
}