:root {
  --ttp-accent: #7fd4ff;
  --ttp-accent-2: #b07cff;
  --ttp-signal: #f7c95c;
  --ttp-ok: #6fe0b2;
  --ttp-danger: #ff8f9d;
}
body.ttp-page {
  background:
    radial-gradient(circle at 12% 0%, rgba(127,212,255,.16), transparent 26%),
    radial-gradient(circle at 88% 12%, rgba(247,201,92,.10), transparent 22%),
    radial-gradient(circle at 55% 105%, rgba(176,124,255,.12), transparent 32%),
    linear-gradient(160deg, #050816 0%, #0b1330 50%, #111b3d 100%);
}
.ttp-header { border-bottom-color: rgba(247,201,92,.16); }
.ttp-brand-mark {
  width:46px; height:46px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(145deg,rgba(127,212,255,.16),rgba(176,124,255,.18));
  border:1px solid rgba(127,212,255,.28); box-shadow:var(--hn-shadow-soft);
}
.ttp-brand-mark svg { width:29px; height:29px; stroke:var(--hn-accent); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ttp-brand-mark .ttp-signal-dot { fill:var(--ttp-signal); stroke:none; }
.ttp-product-nav-return { color:var(--hn-accent) !important; border-left:1px solid rgba(127,212,255,.18); padding-left:.9rem !important; }
.ttp-badge { color:var(--ttp-signal); border-color:rgba(247,201,92,.26); background:rgba(247,201,92,.08); }
.ttp-kicker { color:var(--ttp-signal); }
.ttp-card::before { background:linear-gradient(90deg,var(--ttp-accent),var(--ttp-signal),var(--ttp-accent-2)); }
.ttp-stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem; margin-top:1.2rem; }
.ttp-stat { padding:1rem; border-radius:18px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.08); }
.ttp-stat strong { display:block; font-family:var(--hn-font-heading); font-size:1rem; color:var(--hn-text); text-transform:uppercase; letter-spacing:.05em; margin-bottom:.35rem; }
.ttp-stat span { color:var(--hn-text-muted); font-size:.9rem; line-height:1.55; }
.ttp-workflow { display:grid; grid-template-columns:repeat(5,1fr); gap:.8rem; counter-reset:ttp-step; }
.ttp-step { position:relative; padding:1.2rem; border-radius:18px; background:var(--hn-surface-strong); border:1px solid var(--hn-border-soft); }
.ttp-step::before { counter-increment:ttp-step; content:counter(ttp-step); display:grid; place-items:center; width:2rem; height:2rem; border-radius:50%; margin-bottom:.8rem; font-family:var(--hn-font-heading); font-size:.8rem; background:rgba(127,212,255,.10); border:1px solid rgba(127,212,255,.24); color:var(--hn-accent); }
.ttp-feature-list { display:grid; gap:.8rem; margin:1.1rem 0 0; padding:0; list-style:none; }
.ttp-feature-list li { position:relative; padding-left:1.6rem; color:var(--hn-text-muted); line-height:1.7; }
.ttp-feature-list li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--ttp-ok); font-weight:800; }
.ttp-status-band { padding:1.25rem 1.5rem; border-radius:20px; background:linear-gradient(135deg,rgba(127,212,255,.10),rgba(247,201,92,.09)); border:1px solid rgba(247,201,92,.18); }
.ttp-status-band p { margin:0; color:var(--hn-text); line-height:1.8; }
.ttp-mini-label { font-family:var(--hn-font-heading); font-size:.7rem; text-transform:uppercase; letter-spacing:.15em; color:var(--ttp-signal); }
@media (max-width:960px) { .ttp-stat-grid, .ttp-workflow { grid-template-columns:1fr 1fr; } }
@media (max-width:640px) { .ttp-stat-grid, .ttp-workflow { grid-template-columns:1fr; } .ttp-product-nav-return { border-left:0; padding-left:.12rem !important; } }