@charset "UTF-8";
/* ==========================================================================
   TMF Leaks: the Simple theme.
   Layered on top of styles.css and active only on html[data-theme="simple"]
   (theme-boot.js / theme-gate.js). Same pages, ids and flows; the volume
   turned down, modelled on the owner's pinned reference (summitexternal.com)
   inside the site's black / white / red palette: a drop mark + tracked
   wordmark, a night-ridge WebGL hero under a red aurora, a huge flat
   wordmark, numbered prose sections on a hairline rail, flat panels, red
   for actions and the accent line only.
   ========================================================================== */

html[data-theme="simple"] {
  --liner: #0a0a0b;
  --liner-2: #121214;
  --liner-3: #1b1b1e;
  --liner-4: #26262a;
  --rule: rgba(255, 255, 255, 0.08);
  --rule-strong: rgba(255, 255, 255, 0.14);
  --grid: transparent;
  --ink: #f3f3f2;
  --ink-2: #a3a3a3;
  --ink-3: #7f7f7f;
  --paper: #f3f3f2;
  --r: 10px;
  --r-lg: 12px;
  --r-btn: 0;
  --r-btn-sm: 0;
  --r-btn-lg: 0;
  --kiss: 0px;
  --lift: 0 0 0 0 transparent;
  --lift-hover: 0 18px 40px -22px rgba(0, 0, 0, 0.85);
  --panel-shadow: 0 24px 60px -24px rgba(0, 0, 0, 0.9);
  --font-display: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* one family: the Full theme's liner mono labels set in Archivo here */
  --font-mono: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --section-y: clamp(60px, 7.5vw, 108px);
  background: var(--liner);
}

/* No tilts, no italic sponsor lettering, no stretched widths anywhere. */
html[data-theme="simple"] *,
html[data-theme="simple"] *::before,
html[data-theme="simple"] *::after {
  rotate: none !important;
  font-style: normal !important;
  font-stretch: 100% !important;
}

/* Reveals rise softly; nothing slaps onto the page here. */
@media (prefers-reduced-motion: no-preference) {
  html[data-theme="simple"].js-motion :is(.ecosystem-tile, .price-card, .vouch-card, .gc-card, .giveaway-card).reveal-in {
    animation-name: tmf-rise;
    animation-duration: 700ms;
  }
}

html[data-theme="simple"] {

  /* the site-wide scene (site-motion.js syncScene -> RB.ridgeline): fixed
     behind every page, under the grain; it fades up once */
  & .site-scene {
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: 0;
    transition: opacity 1.4s var(--ease-out);
  }
  & .site-scene.is-in { opacity: 1; }
  & .site-scene canvas { display: block; width: 100%; height: 100%; }
  @media (prefers-reduced-motion: reduce) { & .site-scene { transition: none; } }

  & body::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .04 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 160px 160px;
  }

  /* ---------- type ---------- */
  & :is(.section-head h2, .features-head h2) {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(32px, 4vw, 54px);
    letter-spacing: -0.025em;
    line-height: 1.06;
  }
  & :is(.section-head .subtitle, .features-head .subtitle) {
    font-size: clamp(17px, 1.4vw, 20px);
    font-weight: 300;
    letter-spacing: 0.005em;
    line-height: 1.6;
  }
  & main > section:first-child > .section-head:first-child h2 {
    font-size: clamp(40px, 5.6vw, 84px);
    letter-spacing: -0.045em;
    line-height: 0.98;
  }

  /* ---------- chrome ---------- */
  & .announcement-ticker { display: none; }
  & .site-header {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom-color: transparent;
  }
  & .site-header.scrolled {
    background: rgba(10, 10, 11, 0.82);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    backdrop-filter: blur(16px) saturate(140%);
    border-bottom-color: var(--rule);
  }
  /* the lockup: the drop mark, then the tracked white wordmark (like the
     reference's mountain + SUMMIT); a hairline divides it from the nav */
  & .brand { position: relative; padding: 6px 22px 6px 0; margin-right: 6px; }
  & .site-footer .brand { padding-right: 0; margin-right: 0; }
  & .site-footer .brand::after { display: none; }
  & .brand::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 1px;
    height: 20px;
    translate: 0 -50%;
    background: var(--rule-strong);
  }
  & .brand-decal {
    gap: 0;
    align-items: center;
    box-shadow: none;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.2em;
  }
  & .brand-decal::before {
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 11px;
    flex: none;
    background: var(--red);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3CclipPath id='t'%3E%3Cpolygon points='0,0 64,0 64,25.2 0,41.4'/%3E%3C/clipPath%3E%3CclipPath id='b'%3E%3Cpolygon points='0,45.2 64,29 64,64 0,64'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath clip-path='url(%23t)' d='M32 4C32 4 12 26 12 40a20 20 0 0 0 40 0C52 26 32 4 32 4Z'/%3E%3Cpath clip-path='url(%23b)' transform='translate(2.2 2.6)' d='M32 4C32 4 12 26 12 40a20 20 0 0 0 40 0C52 26 32 4 32 4Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3CclipPath id='t'%3E%3Cpolygon points='0,0 64,0 64,25.2 0,41.4'/%3E%3C/clipPath%3E%3CclipPath id='b'%3E%3Cpolygon points='0,45.2 64,29 64,64 0,64'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath clip-path='url(%23t)' d='M32 4C32 4 12 26 12 40a20 20 0 0 0 40 0C52 26 32 4 32 4Z'/%3E%3Cpath clip-path='url(%23b)' transform='translate(2.2 2.6)' d='M32 4C32 4 12 26 12 40a20 20 0 0 0 40 0C52 26 32 4 32 4Z'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  & .brand-tmf, & .brand-leaks { background: none; padding: 0; border-radius: 0; color: var(--ink); }
  & .brand-tmf { margin-right: 0.45em; }
  & .top-nav { margin: 0 auto 0 0; }
  & #discordBtn { background: none; box-shadow: none; padding: 0 8px; color: var(--ink-2); font-weight: 500; }
  & #discordBtn svg.i { display: none; }
  & #discordBtn:hover { color: var(--ink); background: none; }
  @media (min-width: 1180px) {
    & .header-cta { display: inline-flex; }
  }
  /* music: an icon button, like the reference's theme toggle */
  & .music-toggle { width: 36px; min-width: 36px; height: 36px; padding: 0; border-radius: 0; justify-content: center; }
  /* square edges on everything you press (buttons and fields use --r-btn: 0) */
  & :is(.pill, .jerry-bubble, .jerry-suggestion-chip, .nav-wallet, .admin-badge-link, .cart-btn, .settings-btn, .nav-toggle, .theme-switch-btn, .tmf-hub-link, .nav-more-btn, .carousel-arrow) { border-radius: 0; }
  & input[type="file"]::file-selector-button { border-radius: 0; }
  & :is(.shop-sound-btn, .shop-fullscreen-btn, .price-preview-arrow, .jerry-close-btn, .jerry-send-btn, .shop-wishlist-btn,
        .faq-pill, .rp-sidebar-btn, .rp-phrase-btn, .pf-mode-btn, .previews-tab, .shop-sidebar-btn, .qty-btn, .cart-item-remove,
        .music-nav-btn, .tool-fullscreen-btn) { border-radius: 0; }
  & .music-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  & :is(.top-nav > a, .nav-more-btn) { font-weight: 500; font-size: 14px; }
  & .top-nav > a[aria-current="page"]::after { height: 1px; bottom: 6px; background: var(--red-ink); }
  & .nav-more-dropdown a svg.i { background: transparent; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .nav-more-dropdown a:hover svg.i { background: var(--red); color: #fff; box-shadow: none; }
  & .cart-badge { box-shadow: 0 0 0 2px var(--liner); }
  & .profile-avatar-link { box-shadow: 0 0 0 1px var(--rule-strong); }
  & .admin-badge-link { background: transparent; color: var(--red-ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }

  & .music-toggle { background: transparent; box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .music-toggle-playing { background: var(--ink); color: #0a0a0b; box-shadow: none; }
  & .music-toggle-playing:hover { background: #ffffff; color: #0a0a0b; }
  & .music-eq i { border-radius: 0; }
  @media (max-width: 768px) {
    & body > .music-player {
      left: 18px;
      bottom: calc(18px + env(safe-area-inset-bottom));
      padding: 0;
      border: 0;
      border-radius: 0;
      background: var(--liner-2);
      box-shadow: inset 0 0 0 1px var(--rule-strong), var(--lift-hover);
    }
    & body > .music-player .music-toggle { width: 48px; min-width: 48px; height: 48px; background: transparent; box-shadow: none; }
    & body > .music-player .music-toggle-playing { background: var(--ink); }
    & body > .music-player .music-nav-btn { width: 40px; height: 48px; }
  }
  @media (max-width: 640px) {
    & .jerry-bubble { width: 48px; }   /* square, like the music button opposite */
  }

  & .jerry-bubble {
    background: var(--liner-2);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px var(--rule-strong), var(--lift-hover);
  }
  & .jerry-bubble:hover { transform: translateY(-2px); }
  & .jerry-header { border-bottom-style: solid; font-family: var(--font-display); font-weight: 800; }
  & .jerry-input-row { border-top-style: solid; }
  & .jerry-proactive { background: var(--liner-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong), var(--lift-hover); }
  & .jerry-proactive-close { color: var(--ink-2); }
  & .jerry-proactive-close:hover { background: var(--liner-3); }
  & .jerry-proactive .btn-primary { background: var(--red); color: #fff; }

  & .site-footer { border-top-style: solid; border-top-color: var(--rule); }
  & .footer-sheet { display: none; }
  & .footer-bottom { border-top-style: solid; border-top-color: var(--rule); margin-top: clamp(32px, 5vw, 56px); }
  & .footer-cols { grid-template-columns: minmax(0, 1fr) repeat(3, auto); column-gap: clamp(32px, 6vw, 96px); }
  & :is(.footer-brand p, .footer-brand .btn) { display: none; }
  & .footer-col { gap: 7px; }
  & .footer-col h2 { font-family: var(--font-text); font-weight: 600; letter-spacing: 0.14em; }
  & .footer-col a { font-size: 14px; color: var(--ink-2); }
  & .footer-col a:hover { color: var(--ink); }

  & :is(.shop-empty, .pf-empty, .rp-status, .rp-empty-note) { border-style: solid; border-width: 1px; border-color: var(--rule); }

  /* ---------- buttons ---------- */
  & .btn { font-stretch: 100%; font-weight: 600; letter-spacing: 0; }
  & :is(.btn-primary, .btn-foil) {
    background: var(--red);
    background-size: auto;
    color: #ffffff;
    box-shadow: none;
  }
  & .btn-white { background: var(--ink); color: #0a0a0b; box-shadow: none; }
  & .btn-discord { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .btn-ghost { box-shadow: inset 0 0 0 1px var(--rule-strong); }
  @media (hover: hover) and (pointer: fine) {
    & :is(.btn-primary, .btn-foil):hover:not(:disabled) { background: var(--red-hi); box-shadow: none; }
    & .btn-white:hover:not(:disabled) { background: #ffffff; box-shadow: none; }
    & .btn-discord:hover:not(:disabled) { background: var(--liner-3); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  }

  /* ---------- homepage ---------- */
  & main > .hero {
    position: relative;
    grid-template-columns: 1fr;
    place-items: center;
    text-align: center;
    max-width: none;
    min-height: min(100dvh, 880px);
    margin-top: calc(var(--header-h) * -1);
    padding-top: calc(var(--header-h) + 6vh);
    padding-bottom: 14vh;
    overflow: hidden;
  }
  & .hero-content { position: relative; z-index: 1; display: grid; justify-items: center; max-width: 1100px; }
  /* the clip belongs to the Full theme; Simple's hero sits on the site-wide scene */
  & .hero-window { display: none; }
  & .hero-sub { display: none; }
  & .hero-tagline {
    display: block;
    margin-top: 24px;
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 300;
    color: var(--ink-2);
  }
  & .hero-tagline strong { font-weight: 700; color: var(--ink); }
  & .hero-scroll {
    position: absolute;
    left: 50%;
    bottom: clamp(18px, 4vh, 40px);
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: 10px;
    translate: -50% 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--ink-3);
  }
  & .hero-scroll::after { content: ''; width: 1px; height: 34px; background: linear-gradient(var(--ink-3), transparent); }
  & .hero-scroll:hover { color: var(--ink); }
  & .pill-promo {
    background: rgba(10, 10, 11, 0.35);
    color: var(--ink-2);
    box-shadow: inset 0 0 0 1px var(--rule-strong);
    font-weight: 500;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
  & .pill-promo svg.i:first-child { color: var(--red-ink); }
  & .hero-title { align-items: center; margin-top: 28px; }
  & .hero-decal {
    padding: 0;
    background: none;
    color: var(--ink);
    box-shadow: none;
    border-radius: 0;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: clamp(52px, 12.4vw, 176px);
    line-height: 0.86;
    letter-spacing: -0.05em;
    cursor: default;
  }
  & .hero-title-accent {
    margin: 20px 0 0;
    padding: 0;
    background: none;
    color: var(--red-ink);
    box-shadow: none;
    border-radius: 0;
    font-family: var(--font-text);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.42em;
  }
  & .hero-sub {
    margin-top: 26px;
    max-width: 38ch;
    font-size: clamp(18px, 1.7vw, 23px);
    font-weight: 300;
    line-height: 1.5;
    color: var(--ink-2);
  }
  & .hero-cta-row { justify-content: center; margin-top: 34px; }

  & .invite-decal { background: transparent; box-shadow: inset 0 0 0 1px var(--rule); }
  & .invite-icon { background: var(--liner-3); color: var(--red-ink); font-family: var(--font-display); font-weight: 800; }
  & .invite-name { font-family: var(--font-display); font-weight: 800; letter-spacing: -0.02em; }

  & .partners-strip { border-style: solid; border-width: 1px; border-color: var(--rule); }
  & .powering-name { font-family: var(--font-display); font-weight: 700; }
  & .partner-logo.active { box-shadow: 0 0 0 2px var(--red); transform: none; }
  /* counting clocks keep steady digits without the mono face */
  & :is(.promo-banner-end, .giveaway-countdown, .admin-badge) { font-variant-numeric: tabular-nums; }

  /* numbered sections on a hairline rail */
  & main.page-home { counter-reset: tmfsec; }
  & main.page-home > :is(.ecosystem, .carousel-section, .features, .pricing, .testimonials) {
    counter-increment: tmfsec;
    border-top: 1px solid transparent;
    border-image: linear-gradient(var(--rule), var(--rule)) 1 / 1px 0 0 0 / 0 100vw;
  }
  & main.page-home :is(.section-head, .features-head) { position: relative; top: auto; padding-left: 72px; }
  & main.page-home :is(.section-head, .features-head)::before {
    content: counter(tmfsec, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: 0.9em;
    font-family: var(--font-text);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--red-ink);
  }
  & main.page-home :is(.section-head, .features-head)::after {
    content: '';
    position: absolute;
    left: 7px;
    top: 2.9em;
    bottom: 0;
    width: 1px;
    background: var(--rule-strong);
  }

  /* 01: what's on offer as one line of links (the reference's dot list),
     not a grid of identical icon cells */
  & .ecosystem-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 14px 0;
    padding-left: 72px;
    background: none;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
  }
  & .ecosystem-tile, & .tile-graphics, & .tile-vouches {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 0;
    flex: none;
    min-height: 0;
    padding: 0;
    background: none;
    border-radius: 0;
    box-shadow: none;
  }
  /* separators trail each item, so a wrapped line never starts with one */
  & .ecosystem-tile:not(:last-child)::after {
    content: '\00B7';
    position: static;
    display: inline;
    width: auto;
    height: auto;
    margin: 0 14px;
    background: none;
    box-shadow: none;
    border-radius: 0;
    color: var(--ink-3);
    font-weight: 700;
    transition: none;
  }
  & .ecosystem-tile:last-child::after, & .ecosystem-icon-wrap { display: none; }
  & .tile-label, & .tile-graphics .tile-label {
    font-family: var(--font-text);
    font-weight: 600;
    font-size: clamp(15px, 1.1vw, 16px);
    letter-spacing: 0;
    text-transform: none;
    color: var(--ink);
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 6px;
    transition: text-decoration-color 200ms ease, color 200ms ease;
  }
  @media (hover: hover) and (pointer: fine) {
    & .ecosystem-tile:hover { background: none; transform: none; box-shadow: none; }
    & .ecosystem-tile:hover .tile-label { text-decoration-color: var(--red-ink); }
  }
  & .tile-note { display: none; }

  & .carousel { border-radius: var(--r-lg); box-shadow: 0 0 0 1px var(--rule); }
  /* the slide's category / rank: plain meta text under the title */
  & .slide-meta {
    padding: 0;
    background: none;
    color: var(--ink-2);
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
  }
  & .slide-copy h3 { font-family: var(--font-display); font-weight: 800; text-transform: none; letter-spacing: -0.03em; text-shadow: none; }
  & .carousel-arrow {
    background: rgba(10, 10, 11, 0.55);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px var(--rule-strong);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  & .carousel-arrow:hover { background: var(--ink); color: #0a0a0b; }
  & .carousel-dots span.active { background: var(--ink); }
  & #mpCarousel { background: var(--liner-2); }
  & #mpCarousel .slide-meta { background: none; color: var(--red-ink); box-shadow: none; }

  & .feature-item { border-top-style: solid; border-top-color: var(--rule); }
  & .feature-item:last-child { border-bottom-style: solid; border-bottom-color: var(--rule); }
  & .feature-item > svg.i { width: 30px; height: 30px; padding: 0; background: none; color: var(--red-ink); box-shadow: none; }
  & .feature-item h3 { font-weight: 700; letter-spacing: -0.01em; }

  & .promo-banner { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); font-weight: 500; }
  & .promo-banner-icon { color: var(--red-ink); }
  & .promo-banner-end { padding: 0; background: none; color: var(--ink-3); }

  & main .price-card.price-card, & #promoServices .price-card {
    --vinyl: var(--liner-2);
    --on: var(--ink);
    --on-soft: var(--ink-2);
    border-radius: var(--r-lg);
    box-shadow: inset 0 0 0 1px var(--rule-strong);
  }
  @media (hover: hover) and (pointer: fine) {
    & main .price-card.price-card:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px var(--rule-strong), var(--lift-hover); }
  }
  & main .price-card.price-card.featured { box-shadow: inset 0 0 0 1.5px var(--red); }
  & .price-card::before { display: none; }
  & .price-sale-ribbon, & .price-card .price-sale-ribbon {
    top: 22px;
    right: 20px;
    width: auto;
    height: auto;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(217, 13, 24, 0.16);
    color: var(--red-ink);
    box-shadow: none;
    font-family: var(--font-text);
    font-weight: 700;
    font-size: 12px;
    line-height: 1.2;
  }
  & .price-tag {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 16px;
    text-transform: none;
    letter-spacing: -0.01em;
    padding-right: 84px;
  }
  & .price-tag em { background: var(--red); color: #ffffff; font-family: var(--font-text); }
  & .price-amt { font-family: var(--font-display); font-weight: 800; letter-spacing: -0.035em; }
  & .price-card li::before { background: var(--red); }
  & .price-card li::after { border-color: #ffffff; }
  & main .price-card .btn-primary, & main .price-card.featured .buy-instant-btn, & .opti-page .price-card .opti-buy-btn.btn-primary, & .opti-page .price-card.featured .opti-buy-btn {
    background: var(--red);
    color: #ffffff;
    box-shadow: none;
  }
  & main .price-card :is(.btn-ghost, .btn-white) { color: var(--ink); background: transparent; box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .price-card[data-in-cart]::after { background: var(--liner-3); color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .price-most-purchased-badge { background: var(--red); color: #ffffff; box-shadow: none; }

  & .vouch-card, & .vouch-card:nth-child(n) {
    --vinyl: var(--liner-2);
    --on: var(--ink);
    box-shadow: inset 0 0 0 1px var(--rule);
  }
  & .vouch-card-verified { opacity: 1; color: var(--ink-3); }
  & .vouch-card-stars { color: var(--red-ink); }

  & .cta h2 {
    max-width: min(18ch, 100%);
    padding: 0;
    background: none;
    color: var(--ink);
    box-shadow: none;
    border-radius: 0;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: clamp(38px, 6vw, 96px);
    letter-spacing: -0.045em;
    text-transform: none;
  }

  /* ---------- marketplace ---------- */
  & .shop-item { background: var(--liner-2); box-shadow: inset 0 0 0 1px var(--rule); }
  @media (hover: hover) and (pointer: fine) {
    & .shop-item:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px var(--rule-strong), var(--lift-hover); }
  }
  & .shop-item-tag { background: rgba(10, 10, 11, 0.72); color: var(--ink); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
  & .shop-item-price { font-family: var(--font-display); font-weight: 700; font-size: 19px; color: var(--ink); }
  & .shop-category-row-head h3 { font-family: var(--font-display); font-weight: 700; text-transform: none; letter-spacing: -0.02em; }
  & :is(.shop-sidebar-btn, .rp-sidebar-btn).active { background: var(--liner-3); color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & :is(.previews-tab, .faq-pill, .pf-mode-btn).active { background: var(--ink); color: #0a0a0b; box-shadow: none; }
  & .shop-modal-info h3, & .rp-modal-info h3, & .rp-main-head h3, & .faq-group h3 {
    font-family: var(--font-display);
    font-weight: 800;
    text-transform: none;
    letter-spacing: -0.02em;
  }
  & .shop-modal, & .confirm-modal, & .rp-modal { box-shadow: inset 0 0 0 1px var(--rule-strong), 0 40px 80px -30px rgba(0, 0, 0, 0.9); }
  & .rp-phrase-btn, & .rp-phrase-btn:nth-child(n) {
    background: var(--liner-2);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px var(--rule-strong);
    font-family: var(--font-display);
    font-weight: 700;
    text-transform: none;
  }
  & .rp-phrase-count { background: var(--liner-4); color: var(--ink); }
  & .pf-upload { border-style: solid; border-width: 1px; }
  & .pf-upload-inner svg { background: transparent; color: var(--red-ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .pf-item, & .gc-card { box-shadow: inset 0 0 0 1px var(--rule); }
  & .pf-item-similarity { font-family: var(--font-display); }

  /* ---------- content pages ---------- */
  & .promo-tier-price, & .whr-amount, & .orders-stat-value, & .admin-stat :is(h4, .admin-stat-value), & .wallet-summary-amount {
    font-family: var(--font-display);
    font-weight: 800;
    letter-spacing: -0.03em;
  }
  & .gc-redeem { box-shadow: inset 0 0 0 1px var(--rule); }
  & .gc-faq-item { border-top-style: solid; border-top-color: var(--rule); }
  & .giveaway-card, & .giveaway-card:nth-child(n) {
    background: var(--liner-2);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px var(--rule-strong);
  }
  & .giveaway-card-head h3 { font-family: var(--font-display); font-weight: 800; text-transform: none; letter-spacing: -0.02em; }
  & .giveaway-countdown { background: rgba(217, 13, 24, 0.16); color: var(--red-ink); }
  & .giveaway-meta li { background: var(--liner-3); }
  & .giveaway-card .btn-primary { background: var(--red); color: #ffffff; }
  & .giveaway-card.is-entered .btn-primary { background: var(--liner-3); color: var(--ink-2); }
  & .giveaway-status { color: var(--red-ink); }
  & .tutorial-video, & .tool-iframe-wrap { box-shadow: inset 0 0 0 1px var(--rule); }
  & .faq-item, & .faq-item:last-child { border-top-style: solid; border-bottom-style: solid; border-color: var(--rule); }
  & .legal-body li::before { border-radius: 50%; width: 6px; height: 6px; top: 0.75em; }
  & .login-card { box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .login-card h1, & .theme-gate-title { font-family: var(--font-display); font-weight: 800; text-transform: none; letter-spacing: -0.035em; }
  & .promo-tier-bar, & .promo-tier-bar:nth-child(n) { background: var(--liner-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .promo-tier-bar-featured { box-shadow: inset 0 0 0 1.5px var(--red); }
  & .tmf-hub-bar { border-style: solid; border-width: 1px; border-color: var(--rule); }
  & .partner-card-logo { box-shadow: 0 0 0 1px var(--rule-strong); }
  & .opti-photo-single-frame img { box-shadow: 0 0 0 1px var(--rule-strong); }
  & .wallet-summary-card { background: var(--liner-2); color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .wallet-summary-card .btn-ghost { color: var(--ink); box-shadow: inset 0 0 0 1px var(--rule-strong); }
  & .ticket-header, & .ticket-composer { border-style: solid; border-color: var(--rule); }
  & .ticket-date-sep::before, & .ticket-date-sep::after { border-top-style: solid; }
  & .admin-section-toggle { font-family: var(--font-display); font-weight: 800; text-transform: none; letter-spacing: -0.01em; }
  & .success-title {
    padding: 0;
    background: none;
    color: var(--ink);
    box-shadow: none;
    border-radius: 0;
    font-family: var(--font-display);
    font-weight: 800;
    text-transform: none;
    letter-spacing: -0.04em;
  }
  & .gc-code-box { box-shadow: none; }

  /* Glyphs drawn by rotating a border keep their angle via transform (the
     blanket rule above only removes the decorative `rotate` tilts). */
  & .faq-caret::before { transform: rotate(45deg); }
  & .price-card li::after { transform: rotate(-45deg); }
  @media (hover: hover) and (pointer: fine) {
    & .rp-phrase-btn:hover:not(:disabled) { transform: translateY(-3px); }
  }

  /* ---------- theme gate when reopened from the Simple theme ---------- */
  & .theme-option-body strong { font-family: var(--font-display); font-weight: 800; text-transform: none; }

  /* ---------- small screens ---------- */
  @media (max-width: 960px) {
    & main > .hero { min-height: 92dvh; padding-top: calc(var(--header-h) + 5vh); }
    & .hero-window { order: 0; max-width: none; width: auto; }
    & .hero-window-cut { aspect-ratio: auto; }
    & .ecosystem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* the lockup gets its own row; link columns share the width evenly */
    & .footer-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 24px; }
    & .footer-brand { grid-column: 1 / -1; }
  }
  @media (max-width: 560px) {
    & .footer-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    & .hero-decal { font-size: clamp(44px, 14vw, 64px); }
    & main.page-home :is(.section-head, .features-head) { padding-left: 40px; }
    & .ecosystem-grid { padding-left: 40px; }
    & .tile-graphics, & .tile-vouches { grid-column: auto; }
    & .price-card .price-sale-ribbon { right: 16px; width: auto; height: auto; font-size: 11.5px; }
  }
}