.system-experience {
  --system-experience-accent: #7658ef;
  --system-experience-ink: #242739;
  --system-experience-muted: #62677b;
  --system-experience-surface: #fff;
  --system-experience-border: #e7e7f0;
  box-sizing: border-box;
  width: min(1120px, calc(100% - 40px));
  margin: 22px auto;
  border: 1px solid var(--system-experience-border);
  border-radius: 22px;
  padding: clamp(18px, 3vw, 30px);
  background: var(--system-experience-surface);
  color: var(--system-experience-ink);
  box-shadow: 0 12px 36px #131b3810;
  overflow-wrap: anywhere;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.65;
}
.system-experience *, .system-experience *::before, .system-experience *::after { box-sizing: border-box; }
.system-experience[data-site-theme="premium"] { background-image: linear-gradient(115deg, #7658ef08, transparent 64%); }
.system-experience[data-site-theme="dark"] {
  --system-experience-ink: #f2f1fb;
  --system-experience-muted: #bebed0;
  --system-experience-surface: #191b2c;
  --system-experience-border: #34364d;
  color-scheme: dark;
}
.app-main > .system-experience, .pk-main > .system-experience { width: 100%; margin: 0 0 24px; }
.system-experience p, .system-experience h2, .system-experience h3 { margin: 0; color: inherit; }
.system-experience__eyebrow { color: var(--system-experience-accent) !important; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.system-experience__title { margin-top: 5px !important; font-size: clamp(20px, 3vw, 27px); font-weight: 750; line-height: 1.4; letter-spacing: -.025em; }
.system-experience__copy { margin-top: 7px !important; white-space: pre-line; max-width: 88ch; }
.system-experience__tagline { margin-top: 8px !important; color: var(--system-experience-muted) !important; font-size: 13px; }
.system-experience__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 15px;
  padding: 10px 17px;
  border: 1px solid var(--system-experience-border);
  border-inline-start: 3px solid var(--system-experience-accent);
  border-radius: 12px;
  color: var(--system-experience-ink);
  background: var(--system-experience-surface);
  text-decoration: none;
  font-weight: 700;
  transition: transform .16s ease, box-shadow .16s ease;
}
.system-experience__cta:hover { transform: translateY(-1px); box-shadow: 0 5px 14px #131b3815; }
.system-experience a:focus-visible, .system-experience__registration:focus-visible { outline: 3px solid var(--system-experience-accent); outline-offset: 4px; }
.system-experience__announcement {
  border-inline-start: 3px solid #597ae0;
  border-radius: 0 10px 10px 0;
  background: #597ae00c;
  padding: 12px 16px;
}
.system-experience__announcement[data-tone="success"] { border-inline-start-color: #158661; background: #1586610c; }
.system-experience__announcement[data-tone="warning"] { border-inline-start-color: #bd7916; background: #bd79160c; }
.system-experience__announcement-title { font-size: 15px; font-weight: 750; line-height: 1.5; }
.system-experience__welcome + .system-experience__announcement { margin-top: 18px; }
.system-experience__registration { margin-top: 14px !important; font-size: 13px; color: var(--system-experience-muted) !important; }
.system-experience__registration:first-child { margin-top: 0 !important; }
.system-experience__support { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; }
.system-experience__support:not(:first-child) { margin-top: 18px; border-top: 1px solid var(--system-experience-border); padding-top: 14px; }
.system-experience__support-label { color: var(--system-experience-muted); font-size: 12px; }
.system-experience__support a { color: var(--system-experience-ink); text-decoration-color: var(--system-experience-accent); text-underline-offset: 4px; font-size: 13px; }
[data-system-registration-blocked="true"] { cursor: not-allowed !important; opacity: .65; }
[data-system-plan-unavailable="true"] { display: none !important; }
.system-experience[data-system-motion="off"] .system-experience__cta { transition: none; }
.system-experience[data-system-motion="off"] .system-experience__cta:hover { transform: none; }
html[data-system-motion="off"] [data-premium-home] *,
html[data-system-motion="off"] [data-premium-home] *::before,
html[data-system-motion="off"] [data-premium-home] *::after,
html[data-system-motion="off"] .ga-page *,
html[data-system-motion="off"] .ga-page *::before,
html[data-system-motion="off"] .ga-page *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}
html[data-system-motion="off"] [data-premium-home].p-reveal-ready .p-reveal {
  opacity: 1 !important;
  transform: none !important;
}
html[data-system-motion="off"] [data-premium-home] .p-loading-line::after { width: 100%; transform: none; }
html[data-system-motion="off"] [data-premium-home] .p-btn:hover,
html[data-system-motion="off"] [data-premium-home] .p-tool:hover,
html[data-system-motion="off"] [data-premium-home] .p-tool:hover .p-tool-media img,
html[data-system-motion="off"] .ga-google:hover:not(:disabled),
html[data-system-motion="off"] .aff-tool-link:hover > span { transform: none; }
html[data-system-motion="off"] .aff-tool-link > span { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .system-experience .system-experience__cta { transition: none; }
  .system-experience .system-experience__cta:hover { transform: none; }
}
/* The existing hub switches its shell at 820px but its sidebar at 760px.
   Keep the sidebar out of document flow throughout that same mobile range. */
@media (max-width: 820px) {
  .paktakra-web .app-sidebar {
    position: fixed;
    inset: auto 0 0;
    width: auto;
    height: auto;
    z-index: 60;
  }
  .paktakra-web .pk-main { padding-bottom: calc(280px + env(safe-area-inset-bottom)); }
}
@media (max-width: 600px) {
  .system-experience { width: calc(100% - 28px); margin: 14px auto; border-radius: 17px; }
  .system-experience__support { gap: 10px 14px; }
  .system-experience__support-label { flex-basis: 100%; }
}
