/*
 * Copyright © 2026 House of Lassgård LLC.
 * All rights reserved.
 */
  :root{
    /* ---- Rasmus athlete theme — BrandOS shell, Rasmus atmosphere ---- */
    --brandos-bg: #020B19;
    --brandos-surface: #162235;
    --brandos-surface-reading: #F7F4EF;
    --brandos-surface-neutral: #F2F2EF;
    --brandos-accent: #C6E347;

    --bg: var(--brandos-bg);
    --surface: var(--brandos-surface);
    --surface-reading: var(--brandos-surface-reading);
    --surface-neutral: var(--brandos-surface-neutral);
    --lime: var(--brandos-accent);
    --accent-fg: #020B19;

    --hairline: rgba(247, 244, 239, 0.10);
    --hairline-strong: rgba(247, 244, 239, 0.18);
    --hairline-on-light: rgba(2, 11, 25, 0.10);
    --hairline-on-light-strong: rgba(2, 11, 25, 0.18);

    --text-primary: #F7F4EF;
    --text-secondary: rgba(247, 244, 239, 0.72);
    --text-tertiary: rgba(247, 244, 239, 0.48);
    --text-on-light-primary: #020B19;
    --text-on-light-secondary: rgba(2, 11, 25, 0.68);
    --text-on-light-tertiary: rgba(2, 11, 25, 0.46);

    --shadow-soft: 0 12px 32px rgba(0, 0, 0, 0.28);
    --shadow-lift: 0 -24px 48px -16px rgba(0, 0, 0, 0.45);
    --shadow-dock: 0 -12px 28px rgba(0, 0, 0, 0.32);

    --rasmus: var(--brandos-accent);
    --rasmus-dim: rgba(198, 227, 71, 0.14);
    --community: #8B9BB5;
    --community-dim: rgba(139, 155, 181, 0.14);
    --partner: #A69A82;
    --partner-dim: rgba(166, 154, 130, 0.14);
    --ai: #7A8798;
    --ai-dim: rgba(122, 135, 152, 0.14);

    /* ---- TYPE ---- */
    --font-display: 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-mono: 'IBM Plex Mono', monospace;

    --text-xs: 11px;
    --text-sm: 13px;
    --text-base: 15px;
    --text-md: 17px;
    --text-lg: 21px;
    --text-xl: 28px;
    --text-2xl: 38px;

    /* ---- SPACING (8px base) ---- */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;
    --sp-8: 64px;
    --sp-9: 96px;

    --radius-sm: 3px;
    --radius-md: 6px;
    --radius-lg: 16px;
    --topbar-height: 60px;

    /* ---- Responsive tokens (Phase 2A) — desktop-safe defaults ---- */
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --touch-target-min: 44px;
    --brandos-feed-gutter: var(--sp-5);
    --brandos-feed-gutter-inline: max(var(--brandos-feed-gutter), var(--safe-left), var(--safe-right));
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) *{box-sizing:border-box; margin:0; padding:0;}

  html, body{
    background:var(--brandos-bg);
    color:var(--text-primary);
  }
  
  .digital-home-body{
  background:var(--bg);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:var(--text-base);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

:is(#appRoot, #feedOverlay, #modalScrim){
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:var(--text-base);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
  @media (prefers-reduced-motion: reduce){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) a{color:inherit; text-decoration:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) button{font-family:inherit; background:none; border:none; color:inherit; cursor:pointer;}

  /* ================= APP SHELL ================= */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app{min-height:100vh; display:flex; flex-direction:column; position:relative; width:100%;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked{min-height:100vh; min-height:100dvh;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked #feedLanding{padding:var(--sp-5) 0; overflow:visible;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar{
    position:sticky; top:0; z-index:30;
    padding:var(--sp-4) var(--sp-5);
    background:var(--bg);
    border-bottom:1px solid var(--hairline);
    backdrop-filter:blur(6px);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-inner{
    max-width:640px; margin:0 auto; width:100%;
    display:grid; grid-template-columns:1fr auto 1fr;
    align-items:center;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brand-group{
    display:flex; align-items:center; gap:12px;
    justify-self:start; grid-column:1;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-context{
    font-family:var(--font-mono); font-size:18px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--lime); grid-column:2; justify-self:center; text-align:center;
    background:none; border:none; padding:0; cursor:pointer; transition:opacity .2s ease;
    text-decoration:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-context:hover{opacity:0.75;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .wordmark{
    font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:0.14em;
    color:var(--text-secondary); text-transform:uppercase;
    display:flex; align-items:center; gap:7px;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .wordmark b{color:var(--text-primary); font-weight:500;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .signature-mark{height:20px; width:auto; opacity:0.92;}

  @media (max-width:480px){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar{padding:var(--sp-3) var(--sp-4);}
  }

  /* ---- Tablet (≤1024px) ---- */
  @media (max-width:1024px){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-title{font-size:28px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-philosophy{font-size:16px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #brandHero{background-position:68% 26%;}
  }

  /* ---- Mobile (≤640px) ---- */
  @media (max-width:640px){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-inner{
      grid-template-columns:1fr auto 1fr;
      column-gap:var(--sp-2);
    }
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-context{
      font-size:clamp(0.8125rem, 3.4vw, 1rem);
      letter-spacing:0.05em;
      min-height:var(--touch-target-min);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:0 var(--sp-1);
    }
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .wordmark{
      font-size:10px;
      letter-spacing:0.1em;
    }
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked #feedLanding{padding:var(--sp-4) 0;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-inner{padding:0 var(--sp-4);}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-title{font-size:22px; margin-bottom:var(--sp-2);}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-title{font-size:22px; margin-bottom:var(--sp-2);}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-philosophy{font-size:14px; line-height:1.4; margin-bottom:var(--sp-3);}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask{padding:5px 5px 5px 16px; margin-bottom:var(--sp-3);}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask textarea{font-size:14px; padding:9px 0;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-chips{gap:8px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-chip{font-size:12px; padding:7px 12px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #brandHero{background-position:82% 24%;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-title{font-size:24px !important;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-row{flex-direction:column; align-items:flex-start; gap:2px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-val{text-align:left;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-actions{flex-direction:column;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-specs{gap:var(--sp-4);}
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) main{flex:1; padding-bottom:var(--sp-8); max-width:640px; margin:0 auto; width:100%;}

  /* ================= FEED ================= */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed{padding:0 var(--sp-5) 96px var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-intro{
    padding:var(--sp-2) 0 var(--sp-6) 0;
    font-family:var(--font-display); font-weight:600; text-transform:uppercase;
    font-size:13px; letter-spacing:0.06em; color:var(--text-tertiary);
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card{
    padding:var(--sp-5) 0;
    border-bottom:1px solid var(--hairline);
    opacity:0; transform:translateY(6px);
    animation:cardIn .5s ease forwards;
    cursor:pointer;
    transition:background-color .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card:hover{background-color:var(--surface);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card:last-child{border-bottom:none;}
  @keyframes cardIn{to{opacity:1; transform:translateY(0);}}
  @keyframes heroKenBurns{from{transform:scale(1);}to{transform:scale(1.04);}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.fading-out{animation:cardOut .3s ease forwards;}
  @keyframes cardOut{to{opacity:0; transform:translateY(-4px); height:0; padding:0; margin:0; border:none;}}

  /* ---- tile grid: the Pinterest / interest layer ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-grid{
    columns:2 200px; column-gap:var(--sp-3); margin:var(--sp-2) 0 var(--sp-6) 0;
  }
  @media (max-width:420px){ :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-grid{columns:1; } }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile:last-child{
    display:inline-block; width:100%; break-inside:avoid;
    padding:var(--sp-4); margin-bottom:var(--sp-3);
    border:1px solid var(--hairline); border-radius:10px;
    background:var(--surface);
    transition:border-color .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile:hover{border-color:var(--text-secondary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-accent{height:3px; border-radius:2px; margin:calc(var(--sp-4) * -1) calc(var(--sp-4) * -1) var(--sp-3) calc(var(--sp-4) * -1); width:calc(100% + var(--sp-4) * 2);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-accent-rasmus{background:var(--rasmus);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-accent-community{background:var(--community);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-accent-partner{background:var(--partner);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .tile-accent-ai{background:var(--ai);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile .card-title{font-size:15px; letter-spacing:0.005em;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile .card-body{font-size:13px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile .card-media{height:110px; margin-top:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card.tile .badge-row{margin-bottom:var(--sp-2);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .badge-row{display:flex; align-items:center; gap:var(--sp-2); margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .dot-rasmus{background:var(--rasmus);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .dot-community{background:var(--community);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .dot-partner{background:var(--partner);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .dot-ai{background:var(--ai);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .badge-label{
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--text-secondary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .badge-time{
    font-family:var(--font-mono); font-size:10px; color:var(--text-tertiary);
    margin-left:auto;
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-title{
    font-family:var(--font-display); font-weight:700; font-size:var(--text-lg);
    line-height:1.2; margin-bottom:var(--sp-2); letter-spacing:0.01em; text-transform:uppercase;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-body{color:var(--text-secondary); font-size:var(--text-base); max-width:54ch; margin-bottom:8px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-body:last-child{margin-bottom:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-body.clamp{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-media{
    margin-top:var(--sp-4); height:180px; border-radius:var(--radius-md);
    background:
      repeating-linear-gradient(135deg, var(--hairline) 0 2px, transparent 2px 14px),
      var(--surface);
    border:1px solid var(--hairline);
    display:flex; align-items:center; justify-content:center;
    position:relative; overflow:hidden;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-media-fill{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-media-external-link{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-decoration:none; z-index:1;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-media-external-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.04em; color:rgba(255,255,255,0.92); background:rgba(0,0,0,0.65); padding:3px 7px; border-radius:3px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .play-btn{
    width:44px; height:44px; border-radius:50%; border:1px solid var(--hairline-strong);
    display:flex; align-items:center; justify-content:center; backdrop-filter:blur(4px);
    background:rgba(0,0,0,0.45); position:relative; z-index:1;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .play-btn::after{content:''; width:0; height:0; border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:11px solid #FFFFFF; margin-left:3px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .media-tag{position:absolute; bottom:10px; left:10px; font-family:var(--font-mono); font-size:10px; color:rgba(255,255,255,0.92); background:rgba(0,0,0,0.65); padding:3px 7px; border-radius:3px; z-index:1;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .stat-row{display:flex; gap:var(--sp-6); margin-top:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .stat{font-family:var(--font-mono);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .stat .n{font-size:var(--text-md); color:var(--text-primary); display:block;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .stat .l{font-size:10px; color:var(--text-tertiary); text-transform:uppercase; letter-spacing:0.08em;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .product-row{
    margin-top:var(--sp-4); display:flex; align-items:center; justify-content:space-between;
    padding-top:var(--sp-3); border-top:1px solid var(--hairline);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .price{font-family:var(--font-mono); font-size:var(--text-sm); color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .ghost-btn{
    font-family:var(--font-mono); font-size:11px; letter-spacing:0.04em; text-transform:uppercase;
    padding:8px 14px; border:1px solid var(--hairline-strong); border-radius:var(--radius-sm);
    color:var(--text-primary); transition:border-color .2s ease, background .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .ghost-btn:hover{border-color:var(--text-secondary); background:var(--hairline);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .card-actions{display:flex; gap:var(--sp-5); margin-top:var(--sp-4); align-items:center; position:relative;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .link-action{font-size:var(--text-sm); color:var(--text-tertiary); transition:color .2s ease; cursor:pointer; background:none; border:none; font-family:var(--font-body); padding:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .link-action:hover{color:var(--text-primary);}

  /* ---- skeleton loading ---- */
  @keyframes shimmer{0%{background-position:-400px 0;} 100%{background-position:400px 0;}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-card{
    border:1px solid var(--hairline); border-radius:var(--radius-lg);
    padding:var(--sp-5); margin-bottom:var(--sp-5);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-line{
    height:14px; border-radius:4px; margin-bottom:10px;
    background:linear-gradient(90deg, var(--hairline) 25%, var(--hairline-strong) 37%, var(--hairline) 63%);
    background-size:800px 100%; animation:shimmer 1.4s ease-in-out infinite;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-line.short{width:40%;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-line.title{height:22px; width:70%; margin-bottom:16px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-line.body{width:95%;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .skeleton-line.body2{width:80%;}

  /* ---- reply box ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-box{margin-top:var(--sp-4); animation:fadeSlideIn .2s ease;}
  @keyframes fadeSlideIn{from{opacity:0; transform:translateY(-4px);} to{opacity:1; transform:translateY(0);}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-box textarea{
    width:100%; min-height:70px; resize:vertical; font-family:var(--font-body); font-size:var(--text-sm);
    color:var(--text-primary); background:var(--surface); border:1px solid var(--hairline-strong);
    border-radius:var(--radius-md); padding:var(--sp-3); outline:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-box textarea:focus{border-color:var(--lime);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-actions{display:flex; justify-content:flex-end; gap:var(--sp-3); margin-top:var(--sp-2);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-send-btn{
    font-family:var(--font-body); font-size:var(--text-sm); font-weight:600; color:var(--accent-fg);
    background:var(--lime); border:none; border-radius:999px; padding:7px 18px; cursor:pointer;
    transition:opacity .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-send-btn:disabled{opacity:0.6; cursor:default;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-status{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); transition:color .25s ease, opacity .25s ease; opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-status:empty{opacity:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .reply-status.sent{color:var(--rasmus); opacity:1;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .share-toast{
    position:absolute; left:0; top:-30px; font-family:var(--font-mono); font-size:11px;
    color:var(--text-primary); background:var(--surface); border:1px solid var(--hairline-strong);
    padding:4px 10px; border-radius:6px; opacity:0; transform:translateY(4px);
    transition:all .2s ease; pointer-events:none; white-space:nowrap;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .share-toast.show{opacity:1; transform:translateY(0);}

  /* ================= CANVAS — progressive, conversational, no boxes ================= */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas{padding:var(--sp-2) var(--sp-5) 140px var(--sp-5); max-width:640px;}

  /* ---- Feed Landing — the ChatGPT-style entrance, centered until the first question ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #view-feed{
    display:flex; flex-direction:column; min-height:100vh; min-height:100dvh;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #brandHero{
    background-image:url('assets/brand-hero.jpg');
    width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw;
    height:68vh; background-size:cover; background-position:62% 28%;
    background-repeat:no-repeat; overflow:hidden;
    transition:opacity .5s ease, flex-basis .5s ease, height .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #brandHero::after{
    content:''; position:absolute; left:0; right:0; bottom:0; height:140px;
    background:linear-gradient(to bottom, rgba(0,0,0,0), var(--bg));
    pointer-events:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #feedLanding{
    width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw;
    display:flex; align-items:center; justify-content:center;
    min-height:66vh;
    padding:var(--sp-9) 0 var(--sp-8) 0;
    background:var(--bg); border-top:none;
    transition:opacity .35s ease, min-height .35s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #feedLanding.started{
    display:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-inner{width:100%; max-width:620px; text-align:center; padding:0 var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-eyebrow{
    display:inline-flex; align-items:center; gap:7px;
    font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase;
    color:var(--text-secondary); border:1px solid var(--hairline-strong); border-radius:999px;
    padding:6px 14px 6px 12px; margin-bottom:var(--sp-4);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-eyebrow::before{
    content:''; width:6px; height:6px; border-radius:50%; background:var(--lime); flex-shrink:0;
    animation:pulse 2.4s ease-in-out infinite;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked #feedLanding{
    flex:1 1 auto; min-height:auto; padding:var(--sp-1) 0; overflow:visible;
    margin-top:-28px; border-radius:28px 28px 0 0; position:relative; z-index:2;
    box-shadow:var(--shadow-lift);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.brandos-no-hero #feedLanding{
    min-height:auto;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.brandos-no-hero.locked #feedLanding{
    margin-top:0; border-radius:0; box-shadow:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-eyebrow{margin-bottom:var(--sp-1);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-title{font-size:29px; line-height:1.2; margin-bottom:var(--sp-1);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-philosophy{margin-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-ask{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-landing-ask textarea{padding:7px 0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-chip{padding:8px 16px;}
  /* the badge, heading, and input form one tight, connected focal group —
     the primary CTA — everything below it (guidance line, chips) is
     secondary and sits further away, smaller and quieter */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-title{font-family:var(--font-display); font-weight:700; font-size:32px; margin-bottom:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask{
    display:flex; align-items:flex-end; gap:10px;
    background:var(--surface); border:1px solid var(--hairline-strong); border-radius:24px;
    padding:6px 6px 6px 20px; margin-bottom:var(--sp-4);
    transition:border-color .15s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask:focus-within{border-color:var(--lime);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask textarea{
    flex:1; border:none; background:none; outline:none; font-family:var(--font-body);
    font-size:15px; color:var(--text-primary); padding:10px 0;
    resize:none; overflow-y:hidden; max-height:200px;
    line-height:1.4; font-weight:inherit;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask textarea::placeholder{color:var(--text-tertiary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-philosophy{
    font-family:var(--font-display); font-style:italic; font-weight:600;
    font-size:18px; color:var(--text-secondary); line-height:1.5;
    letter-spacing:0.005em; margin-bottom:var(--sp-5);
    max-width:38ch; margin-left:auto; margin-right:auto;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-chips{
    display:flex; flex-direction:row; flex-wrap:wrap; align-items:center;
    justify-content:center; gap:var(--sp-5); width:100%;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-chip{
    font-family:var(--font-body); font-size:14px; font-weight:500; color:var(--text-secondary);
    background:var(--bg); border:1px solid var(--hairline-strong); border-radius:999px;
    padding:9px 16px; cursor:pointer; transition:all .2s ease;
    flex:0 0 auto;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-chip:hover{border-color:var(--text-secondary); color:var(--text-primary); background:var(--surface);}

  @media (min-width:1025px){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-inner{max-width:1080px;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask{
      max-width:620px; margin-left:auto; margin-right:auto;
    }
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-chips{
      flex-wrap:nowrap; gap:var(--sp-5);
    }
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-chip{white-space:nowrap;}
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .app.locked .feed-chip{padding:8px 15px;}
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pinned-outer{
    border-bottom:1px solid var(--hairline); position:sticky; top:var(--topbar-height, 60px); z-index:24; background:var(--bg);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pinned{
    display:flex; gap:var(--sp-2); overflow-x:auto; scrollbar-width:none;
    padding:var(--sp-3) var(--sp-5); max-width:640px; margin:0 auto;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pinned::-webkit-scrollbar{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .new-chapter-btn{
    font-family:var(--font-body); font-size:13px; font-weight:600; color:var(--text-secondary);
    background:none; border:1px solid var(--hairline-strong); border-radius:999px;
    padding:7px 14px; cursor:pointer; transition:all .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .new-chapter-btn.pressing{transform:scale(0.94); transition:transform 100ms ease;}

  /* ---- New Chapter close — one calm motion, no sweep, no wipe ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-timeline.chapter-closing{
    animation:canvasChapterClose 360ms cubic-bezier(.4,0,.2,1) forwards;
  }
  @keyframes canvasChapterClose{
    0%{opacity:1; transform:translateY(0) scale(1);}
    100%{opacity:0; transform:translateY(-10px) scale(0.97);}
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #feedLanding.tear-reveal{
    display:flex !important; animation:feedLandingReveal 340ms cubic-bezier(.2,1.1,.3,1) both;
  }
  @keyframes feedLandingReveal{
    0%{opacity:0; transform:translateY(22px) scale(0.97);}
    55%{opacity:1; transform:translateY(-4px) scale(1.005);}
    80%{transform:translateY(2px) scale(0.998);}
    100%{opacity:1; transform:translateY(0) scale(1);}
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .new-chapter-btn:hover{border-color:var(--text-secondary); color:var(--text-primary); background:var(--surface);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip{
    display:flex; align-items:center; gap:8px; flex-shrink:0;
    font-family:var(--font-mono); font-size:11px; letter-spacing:0.04em;
    color:var(--text-secondary); background:var(--surface); border:1px solid var(--hairline-strong);
    border-radius:999px; padding:6px 8px 6px 14px; transition:all .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip:hover{border-color:var(--text-secondary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip-label{background:none; border:none; padding:0; color:inherit; font:inherit; cursor:pointer; white-space:nowrap;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip-label:hover{color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip-remove{
    width:16px; height:16px; border-radius:50%; flex-shrink:0; background:none; border:none;
    color:var(--text-tertiary); font-size:10px; cursor:pointer; display:flex; align-items:center; justify-content:center;
    transition:all .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip-remove:hover{color:var(--text-primary); background:var(--hairline);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle{
    margin-left:auto; flex-shrink:0; cursor:pointer;
    display:flex; align-items:center; gap:3px;
    background:none; border:none; padding:0;
    color:var(--text-secondary); transition:color .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle svg{width:16px; height:16px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-plus{font-family:var(--font-body); font-size:15px; font-weight:600; line-height:1;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle:hover{color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle.pinned{color:var(--rasmus);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle.pinned .canvas-pin-plus{display:none;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-back-link{
    display:block; background:none; border:none; padding:0 0 var(--sp-3) 0;
    font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); cursor:pointer;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-back-link:hover{color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-user-msg{
    font-family:var(--font-body); font-weight:500; font-size:var(--text-base); color:var(--text-primary);
    background:var(--surface); border:1px solid var(--hairline);
    border-radius:16px; padding:var(--sp-3) var(--sp-4);
    margin-left:auto; margin-bottom:var(--sp-6); width:fit-content; max-width:80%;
    line-height:1.5;
    white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word;
    opacity:0; transform:translateY(6px); transition:all .5s ease;
  }

  /* the ask bar — anchored to the bottom of the feed overlay sheet */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-dock{
    position:relative; flex-shrink:0;
    z-index:25; width:100%;
    background:var(--bg); padding:var(--sp-3) var(--sp-5) var(--sp-5) var(--sp-5);
    box-shadow:var(--shadow-dock);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask{
    display:flex; align-items:flex-end; gap:var(--sp-3);
    background:var(--surface); border:1px solid var(--hairline-strong);
    border-radius:14px; padding:var(--sp-3) var(--sp-4);
    box-shadow:var(--shadow-soft);
    transition:border-color .15s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask:focus-within{border-color:var(--lime);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask textarea{
    flex:1; background:none; border:none; outline:none; font-family:var(--font-body);
    font-size:var(--text-base); color:var(--text-primary); padding:var(--sp-2) 0;
    resize:none; overflow-y:hidden; max-height:200px; line-height:1.45; font-weight:inherit;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask textarea::placeholder{color:var(--text-tertiary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-send{
    width:30px; height:30px; border-radius:50%; background:var(--lime); flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    border:none; color:var(--accent-fg); font-size:14px; font-weight:600; cursor:pointer;
    transition:opacity .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-send:hover{opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-send:disabled{opacity:0.5; cursor:default;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-chip:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-send:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-item:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-toggle:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-pin-chip-label:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .topbar-context:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .new-chapter-btn:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-btn:focus-visible,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-btn:focus-visible{
    outline:2px solid var(--lime); outline-offset:2px;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-landing-ask textarea:disabled,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask textarea:disabled{opacity:0.6;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-ask-hint{
    font-family:var(--font-mono); font-size:10px; color:var(--text-tertiary);
    text-align:center; margin-top:var(--sp-3);
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-block{
    margin-bottom:100px; scroll-margin-top:140px;
    opacity:0; transform:translateY(18px) scale(0.985);
    transition:opacity .55s cubic-bezier(.2,.8,.2,1), transform .55s cubic-bezier(.2,.8,.2,1);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-block.canvas-block-in{opacity:1; transform:translateY(0) scale(1);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-block.light{margin-bottom:60px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-block.light .canvas-title{font-size:28px; margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-block.light .canvas-intro{font-size:var(--text-base); line-height:1.6; max-width:60ch; margin-bottom:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-teaser-cta{
    display:inline-flex; align-items:center; gap:6px; margin-bottom:var(--sp-4);
    background:none; border:1px solid var(--hairline-strong); border-radius:999px; padding:8px 16px;
    font-family:var(--font-mono); font-size:11px; letter-spacing:0.04em; color:var(--text-secondary);
    cursor:pointer; transition:all .2s ease;
    opacity:0; transform:translateY(8px);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-teaser-cta:hover{color:var(--text-primary); border-color:var(--text-secondary);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-back-inline{
    display:inline-flex; align-items:center; gap:6px; margin-bottom:var(--sp-4);
    background:none; border:none; padding:0; cursor:pointer;
    font-family:var(--font-mono); font-size:12px; color:var(--text-tertiary); transition:color .2s ease;
    opacity:0; transform:translateY(6px); transition:opacity .5s ease, transform .5s ease, color .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-back-inline:hover{color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-chapter{
    display:flex; align-items:center; gap:var(--sp-2); margin-bottom:var(--sp-3);
    opacity:0; transform:translateY(6px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-chapter-dot{width:7px; height:7px; border-radius:50%; background:var(--rasmus); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-chapter-label{
    font-family:var(--font-mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--text-tertiary); flex-shrink:0; white-space:nowrap;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-title{
    font-family:var(--font-display); font-weight:700; font-size:42px;
    line-height:1.05; letter-spacing:-0.01em; margin-bottom:var(--sp-4); max-width:100%;
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-intro{
    font-size:18px; line-height:1.6; color:var(--text-primary); max-width:60ch;
    margin-bottom:var(--sp-5);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media{
    width:auto; height:280px; overflow:hidden;
    margin:0 calc(var(--sp-5) * -1) var(--sp-6) calc(var(--sp-5) * -1); background:var(--surface);
    opacity:0; transform:translateY(10px) scale(0.98); transition:opacity .6s ease, transform .6s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media img{
    width:100%; height:100%; object-fit:cover; object-position:center 20%;
    display:block; animation:heroKenBurns 8s ease-out forwards;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media video{width:100%; height:100%; object-fit:cover; display:block; background:#000;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-placeholder{
    width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:10px; border:1.5px dashed var(--hairline-strong);
    color:var(--text-tertiary); font-family:var(--font-mono); font-size:11px; letter-spacing:0.02em; background:var(--surface);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-placeholder svg{width:26px; height:26px; opacity:0.55;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-external{
    width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:10px; border:1.5px solid var(--hairline-strong); background:var(--surface);
    color:var(--text-primary); font-family:var(--font-mono); font-size:12px; letter-spacing:0.02em;
    text-decoration:none; transition:border-color .2s ease, background .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-external:hover{border-color:var(--text-secondary); background:var(--bg);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-external svg{width:28px; height:28px; opacity:0.7;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-media-external .canvas-media-external-tag{color:var(--text-tertiary); font-size:10px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-stats{display:flex; gap:var(--sp-6); margin-bottom:var(--sp-5); opacity:0; transform:translateY(8px); transition:all .5s ease;}

  /* ---- Editorial Event Module (v2) — reusable for any race/event: Indy 500, F1, Le Mans, Nürburgring, Goodwood ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-intro-2{margin-top:calc(var(--sp-4) * -1);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-hero{
    margin:0 calc(var(--sp-5) * -1) var(--sp-6) calc(var(--sp-5) * -1);
    opacity:0; transform:translateY(10px) scale(0.98); transition:opacity .6s ease, transform .6s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-hero .canvas-media{margin:0; height:440px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta{
    display:flex; flex-direction:column; margin-bottom:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-row{
    display:flex; justify-content:space-between; align-items:baseline;
    padding:var(--sp-3) 0; border-bottom:1px solid var(--hairline);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-row:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-label{font-family:var(--font-mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-tertiary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-meta-val{font-family:var(--font-display); font-size:17px; color:var(--text-primary); text-align:right;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-askmore{
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-event-askmore-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:var(--sp-3);}

  /* ---- Editorial Music Module — reusable, "The Soundtrack" ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-story{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-5);
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-story-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--rasmus); margin-bottom:var(--sp-2);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-story-title{font-family:var(--font-display); font-weight:700; font-size:22px; line-height:1.2; margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-story-text{font-size:var(--text-base); color:var(--text-secondary); line-height:1.6;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-module{
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-placeholder{
    width:100%; height:100%; min-height:280px; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:12px; border:1.5px dashed var(--hairline-strong); border-radius:var(--radius-lg);
    color:var(--text-tertiary); font-family:var(--font-mono); font-size:12px; background:var(--surface);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-placeholder svg{width:32px; height:32px; opacity:0.6;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-performances{
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-performances-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-performance-item{
    display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--hairline);
    font-family:var(--font-display); font-size:16px;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-performance-item:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-music-performance-item .dot{width:5px; height:5px; border-radius:50%; background:var(--rasmus); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-stats .stat .n{font-family:var(--font-display); font-weight:700; font-size:26px; display:block;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-stats .stat .l{font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; color:var(--text-tertiary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related{
    opacity:0; transform:translateY(8px); transition:all .5s ease;
    padding-top:var(--sp-4); border-top:1px solid var(--hairline);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-label{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); margin-bottom:var(--sp-3);}

  /* ---- Honest "no verified answer" block ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-no-answer{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-4);
    margin-bottom:var(--sp-4); opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-no-answer-text{font-size:var(--text-sm); color:var(--text-secondary); line-height:1.55;}

  /* ---- Send-to-athlete decision — one neutral card, one decision ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-4);
    margin-bottom:var(--sp-4); opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-text{font-size:var(--text-sm); color:var(--text-secondary); line-height:1.55; margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-actions{display:flex; gap:10px; margin-top:var(--sp-3); flex-wrap:wrap;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-btn{
    font-family:var(--font-body); font-size:13px; font-weight:600; border-radius:999px;
    padding:9px 16px; cursor:pointer; transition:opacity .2s ease;
    border:1px solid var(--hairline-strong); background:none; color:var(--text-primary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-btn.primary{background:var(--lime); color:var(--accent-fg); border-color:transparent;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-btn:hover{opacity:0.8;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-decision-btn:disabled{opacity:0.5; cursor:default;}

  /* ---- Relevance feedback — epilogue to the conversation ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance{
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-row{
    display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-label{
    font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); margin-bottom:0;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-actions{display:flex; gap:var(--sp-2); flex-wrap:wrap;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-btn{
    width:30px; height:30px; padding:0;
    display:inline-flex; align-items:center; justify-content:center;
    border-radius:999px; cursor:pointer; transition:all .2s ease;
    background:transparent; border:1px solid var(--hairline); color:var(--text-tertiary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-btn:hover{
    border-color:var(--hairline-strong); color:var(--text-secondary); background:var(--surface);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-btn.selected{
    border-color:var(--lime); color:var(--lime);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-btn:disabled{opacity:0.55; cursor:default;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-icon{display:block; flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance-thanks{
    font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-relevance.submitted .canvas-relevance-row{display:none;}

  /* ---- BrandOS account invitation ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-invite{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-invite-badge{
    display:inline-block; font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--accent-fg); background:var(--lime); border-radius:999px; padding:5px 12px; margin-bottom:var(--sp-4);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-invite-cta{
    background:var(--lime); color:var(--accent-fg); border:none; border-radius:999px;
    font-family:var(--font-body); font-weight:600; font-size:14px; padding:13px 22px; cursor:pointer; transition:opacity .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-invite-cta:hover{opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-invite-cta.is-loading{opacity:0.6; pointer-events:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-form-error{
    display:block; font-size:var(--text-sm); color:var(--text-secondary); margin-top:2px;
    opacity:0; max-height:0; overflow:hidden; transition:opacity .25s ease, max-height .25s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-form-error.show{opacity:1; max-height:40px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-form-error::before{content:'— '; opacity:0.6;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-account-form{display:flex; flex-direction:column; gap:10px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-account-form input,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-account-form textarea{
    font-family:var(--font-body); font-size:15px; padding:12px 16px; border:1px solid var(--hairline-strong);
    border-radius:12px; background:var(--bg); color:var(--text-primary); outline:none; resize:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-account-form input:focus,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-account-form textarea:focus{border-color:var(--lime);}

  /* a "product moment" — still no card box, just image + type hierarchy + one CTA */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-5);
    margin-bottom:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-module-label{
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--text-tertiary); margin-bottom:var(--sp-3); display:block;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-img{width:100%; height:200px; border-radius:var(--radius-md); object-fit:cover; display:block; margin-bottom:var(--sp-4); animation:heroKenBurns 8s ease-out forwards;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-title{font-family:var(--font-display); font-weight:700; font-size:26px; line-height:1.15; color:var(--text-primary); margin-bottom:8px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-desc{font-size:var(--text-base); color:var(--text-secondary); line-height:1.6; margin-bottom:var(--sp-4); max-width:48ch;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-features{margin-bottom:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-feature{
    display:flex; align-items:center; gap:10px; padding:8px 0;
    border-bottom:1px solid var(--hairline-strong); font-size:var(--text-sm); color:var(--text-secondary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-feature:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-feature .dot{width:5px; height:5px; border-radius:50%; background:var(--rasmus); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-row{display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-price{font-family:var(--font-mono); font-size:14px; color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-btn{
    background:var(--lime); border:none; padding:10px 20px; border-radius:999px;
    font-family:var(--font-body); font-size:13px; font-weight:600; color:var(--accent-fg); cursor:pointer;
    transition:opacity .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-btn:hover{opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-product-btn:hover{text-decoration:underline;}

  /* ---- Module 1: Partnership Story — editorial, no commerce ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-cta{
    display:inline-flex; align-items:center; gap:8px; margin-bottom:var(--sp-6);
    background:var(--rasmus); color:var(--bg); border:none; border-radius:999px;
    padding:12px 22px; font-family:var(--font-body); font-weight:600; font-size:14px; cursor:pointer;
    transition:opacity .2s ease;
    opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-cta:hover{opacity:0.88;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-questions{
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-questions-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:var(--sp-3);}

  /* ---- Module 2: Commerce — reusable purchase module (products, tickets, memberships, etc.) ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce{
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-6);
    margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-badge{
    display:inline-block; font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--accent-fg); background:var(--lime); border-radius:999px; padding:5px 12px; margin-bottom:var(--sp-4);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-gallery{display:flex; gap:var(--sp-3); overflow-x:auto; scrollbar-width:none; margin-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-gallery::-webkit-scrollbar{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-gallery img{width:160px; height:160px; object-fit:cover; border-radius:var(--radius-md); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-title{font-family:var(--font-display); font-weight:700; font-size:30px; line-height:1.1; margin-bottom:6px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-subtitle{font-family:var(--font-mono); font-size:12px; color:var(--text-tertiary); margin-bottom:var(--sp-4);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-desc{font-size:var(--text-base); color:var(--text-secondary); line-height:1.6; margin-bottom:var(--sp-5); max-width:48ch;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-price-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-price{font-family:var(--font-display); font-weight:700; font-size:24px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-qty{display:flex; align-items:center; gap:14px; border:1px solid var(--hairline-strong); border-radius:999px; padding:6px 10px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-qty button{
    width:24px; height:24px; border-radius:50%; border:none; background:var(--hairline);
    color:var(--text-primary); font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-qty button:hover{background:var(--hairline-strong);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-qty-val{font-family:var(--font-mono); font-size:14px; min-width:16px; text-align:center;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-actions{display:flex; gap:var(--sp-3); margin-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-btn{
    flex:1; padding:13px 18px; border-radius:999px; font-family:var(--font-body); font-weight:600; font-size:14px;
    cursor:pointer; text-align:center; transition:all .2s ease; border:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-btn.primary{background:var(--lime); color:var(--accent-fg);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-btn.primary:hover{opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-btn.ghost{background:none; border:1.5px solid var(--hairline-strong); color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-btn.ghost:hover{border-color:var(--text-secondary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-status{font-family:var(--font-mono); font-size:11px; color:var(--rasmus); margin:-8px 0 var(--sp-4) 0; min-height:14px; transition:opacity .25s ease; opacity:0.85;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-status:empty{opacity:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-included{margin-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-included-label{font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-included-item{
    display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--hairline); font-size:var(--text-sm);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-included-item:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-included-item .dot{width:5px; height:5px; border-radius:50%; background:var(--rasmus); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-specs{display:flex; flex-wrap:wrap; gap:var(--sp-5); padding-top:var(--sp-4); border-top:1px solid var(--hairline); margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-spec-label{font-family:var(--font-mono); font-size:10px; color:var(--text-tertiary); display:block;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-spec-val{font-size:13px; color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-commerce-shipping{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary);}

  /* a plain typographic list — the "several items" case, still not a grid of boxes */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list{margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item{
    display:flex; justify-content:space-between; align-items:baseline;
    padding:var(--sp-2) 0; border-bottom:1px solid var(--hairline);
    font-family:var(--font-mono); font-size:13px;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item:first-child{padding-top:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item .idx{color:var(--text-tertiary); width:20px; flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item .name{flex:1; color:var(--text-primary); margin-left:var(--sp-2);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-list-item .dur{color:var(--text-tertiary);}

  /* clickable entity — a name inline in the prose that expands in place, never a popup/page */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity{
    background:none; border:none; padding:0; cursor:pointer; font:inherit;
    color:var(--rasmus); text-decoration:underline; text-decoration-style:dotted;
    text-underline-offset:3px;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity:hover{color:var(--text-primary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity-panel{
    max-height:0; overflow:hidden; opacity:0; transition:all .35s ease;
    border-left:2px solid var(--hairline-strong); margin:var(--sp-3) 0; padding-left:var(--sp-4);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity-panel.open{max-height:200px; opacity:1;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity-panel .name{font-family:var(--font-display); font-weight:700; font-size:var(--text-lg); margin-bottom:6px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-entity-panel .bio{font-size:var(--text-base); color:var(--text-secondary); line-height:1.6;}

  /* a minimal table — hairlines only, no cell borders, no zebra */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-table{width:100%; border-collapse:collapse; margin-bottom:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-table th{font-family:var(--font-mono); font-size:11px; letter-spacing:0.04em; text-transform:uppercase;
    color:var(--text-tertiary); text-align:left; font-weight:400; padding-bottom:var(--sp-2); border-bottom:1px solid var(--hairline-strong);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-table td{padding:var(--sp-2) 0; border-bottom:1px solid var(--hairline); font-size:var(--text-base);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-table td:last-child,
:is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-table th:last-child{text-align:right;}

  /* gallery — a horizontal strip, still no card frames, just images and air */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-gallery{
    display:flex; gap:var(--sp-3); overflow-x:auto; scrollbar-width:none; margin-bottom:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-gallery::-webkit-scrollbar{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-gallery-item{flex-shrink:0; width:200px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-gallery-item img{width:100%; height:150px; object-fit:cover; border-radius:var(--radius-md); display:block; margin-bottom:8px; animation:heroKenBurns 8s ease-out forwards;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-gallery-item .cap{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary);}

  /* a proper visual timeline — distinct from the plain table */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestones{background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-5); margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone{display:flex; gap:var(--sp-4); position:relative; padding-bottom:var(--sp-5);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone:last-child{padding-bottom:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone-rail{display:flex; flex-direction:column; align-items:center; flex-shrink:0; width:10px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone-dot{width:8px; height:8px; border-radius:50%; background:var(--lime); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone-line{flex:1; width:1px; background:var(--hairline-strong); margin-top:4px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone:last-child .canvas-milestone-line{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone-year{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); margin-bottom:2px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-milestone-text{font-size:var(--text-base); color:var(--text-primary); line-height:1.5;}

  /* ---- Recap row — compact label/value facts, distinct from the big achievement stats ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-recap{
    display:flex; gap:var(--sp-6); margin-bottom:var(--sp-5); padding-bottom:var(--sp-4);
    border-bottom:1px solid var(--hairline);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-recap-item .l{font-family:var(--font-mono); font-size:10px; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-tertiary); display:block; margin-bottom:4px;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-recap-item .v{font-family:var(--font-body); font-weight:600; font-size:var(--text-base); color:var(--text-primary);}

  /* ---- Partners — text-only, editorial, never logo/trademark artwork ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-partners{background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-5); margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-partner-row{
    display:flex; justify-content:space-between; align-items:baseline;
    padding:var(--sp-3) 0; border-bottom:1px solid var(--hairline);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-partner-row:first-child{padding-top:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-partner-row .name{font-family:var(--font-display); font-weight:700; font-size:var(--text-lg);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-partner-row .role{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); text-align:right;}

  /* ---- Source / Trust badge — the source is part of the experience, not metadata ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source{
    display:inline-flex; align-items:center; gap:7px; font-family:var(--font-mono); font-size:11px;
    color:var(--text-tertiary); margin-bottom:var(--sp-5);
    opacity:0; transform:translateY(6px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-dot.athlete{background:var(--rasmus);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-dot.editorial{background:var(--community);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-dot.external{background:var(--ai);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-dot.partner{background:var(--partner);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-avatar{width:16px; height:16px; border-radius:50%; object-fit:cover; flex-shrink:0; border:1px solid var(--rasmus);}

  /* Athlete source header — flat horizontal strip (no filled/rounded card) */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner{
    display:flex;
    align-items:center;
    gap:12px;
    position:relative;
    width:100%;
    box-sizing:border-box;
    background:transparent !important;
    background-color:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    border-bottom:1px solid var(--hairline-on-light, rgba(15, 23, 42, 0.10)) !important;
    padding:10px 0 14px;
    margin:0 0 var(--sp-5);
    opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner:has(+ .canvas-chapter){
    margin-bottom:0;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner::before{
    content:"";
    width:7px; height:7px; border-radius:50%;
    background:var(--lime);
    flex-shrink:0;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner-img{
    width:40px; height:40px; border-radius:50%; object-fit:cover; object-position:center 20%;
    flex-shrink:0; border:none !important;
    filter:grayscale(1);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner > div{
    min-width:0; flex:1;
    padding-right:2.75rem; /* room for pin when chapter is pulled into this row */
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner-label{
    font-family:var(--font-body); font-weight:700; font-size:17px;
    color:var(--text-on-light-primary, #0F172A); line-height:1.2;
    letter-spacing:-0.01em;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner-sub{
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--text-on-light-tertiary, #71717A); margin-top:4px; line-height:1.35;
  }

  /* Pin stays on far right of the same header row (chapter chrome hidden) */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    height:40px;
    margin:-54px 0 var(--sp-5);
    padding:0;
    border:none;
    background:transparent;
    pointer-events:none;
    opacity:1;
    transform:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-chapter-dot,
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-chapter-label{
    display:none;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-pin-toggle{
    position:static;
    pointer-events:auto;
    opacity:0.55;
    color:var(--text-on-light-tertiary, #71717A);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-pin-toggle:hover,
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-pin-toggle:focus-visible,
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-banner + .canvas-chapter .canvas-pin-toggle.pinned{
    opacity:1;
    color:var(--text-on-light-primary, #0F172A);
  }

  /* editorial content is a quiet tier below athlete-verified — present, never competing */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-editorial-tag{
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--text-tertiary); background:var(--surface); border:1px solid var(--hairline);
    border-radius:999px; padding:6px 12px; margin-bottom:var(--sp-4);
    opacity:0; transform:translateY(6px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-editorial-tag .dot{width:6px; height:6px; border-radius:50%; background:var(--community); flex-shrink:0;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-source-combines{display:block; margin-top:4px; padding-left:14px; color:var(--text-tertiary);}

  /* ---- Quote Block ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-quote{
    margin:var(--sp-6) 0; padding-left:var(--sp-5); border-left:2px solid var(--lime);
    opacity:0; transform:translateY(8px); transition:all .5s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-quote-text{font-family:var(--font-display); font-weight:700; font-size:var(--text-xl); line-height:1.3; margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-quote-by{font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary);}

  /* ---- Collection Block — Pinterest, not a grid of cards ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-collection{column-count:2; column-gap:var(--sp-3);
    background:var(--surface); border-radius:var(--radius-lg); padding:var(--sp-5); margin-bottom:var(--sp-6);
    opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-collection-item{break-inside:avoid; margin-bottom:var(--sp-3);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-collection-item img{width:100%; border-radius:var(--radius-md); display:block; overflow:hidden; animation:heroKenBurns 8s ease-out forwards;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-collection-item .cap{font-family:var(--font-mono); font-size:10px; color:var(--text-tertiary); margin-top:6px;}

  /* ---- Conversation Block ---- */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-conversation{margin-bottom:var(--sp-6); opacity:0; transform:translateY(8px); transition:all .5s ease;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-conv-q{
    font-family:var(--font-body); font-weight:600; font-size:var(--text-lg); margin-bottom:var(--sp-3);
    overflow-wrap:anywhere; word-break:break-word; white-space:pre-wrap;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-conv-a{
    border-left:2px solid var(--hairline-strong); padding-left:var(--sp-4); font-size:var(--text-base); color:var(--text-secondary); line-height:1.7; margin-bottom:var(--sp-3);
    overflow-wrap:anywhere; word-break:break-word;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-conv-followup{margin-top:var(--sp-4);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-item{
    display:block; text-align:left; width:100%; background:none; border:none; cursor:pointer;
    font-family:var(--font-body); font-size:var(--text-base); color:var(--text-primary);
    padding:var(--sp-2) 0; border-bottom:1px solid var(--hairline); transition:color .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-item:last-child{border-bottom:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-item:hover{color:var(--rasmus);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-related-item::before{content:'→ '; color:var(--text-tertiary);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-reveal{opacity:1 !important; transform:translateY(0) scale(1) !important;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-loading{
    display:flex; align-items:center; gap:10px;
    margin-bottom:var(--sp-6); opacity:0;
    animation:canvasThinkFade .4s ease forwards;
  }
  @keyframes canvasThinkFade{to{opacity:1;}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-loading-icon{
    width:15px; height:15px; flex-shrink:0; color:var(--rasmus);
    animation:canvasThinkSpin 1.4s linear infinite;
  }
  @keyframes canvasThinkSpin{to{transform:rotate(360deg);}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-loading-label{
    font-family:var(--font-body); font-size:13px; color:var(--text-tertiary);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-loading-label .cursor{
    display:inline-block; width:1px; height:12px; background:var(--text-tertiary);
    margin-left:2px; vertical-align:middle;
    animation:canvasThinkCursor .8s steps(1) infinite;
  }
  @keyframes canvasThinkCursor{50%{opacity:0;}}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .feed-header{padding-top:var(--sp-2);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-block{
    width:100%; background:var(--bg);
    padding:var(--sp-3) var(--sp-5) var(--sp-5) var(--sp-5);
    border-top:1px solid var(--hairline);
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .chips{display:flex; gap:var(--sp-2); margin-bottom:var(--sp-3); overflow-x:auto; scrollbar-width:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .chips::-webkit-scrollbar{display:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .chip{
    font-family:var(--font-mono); font-size:11px; white-space:nowrap;
    padding:6px 12px; border:1px solid var(--hairline-strong); border-radius:999px;
    color:var(--text-secondary); background:var(--surface); transition:all .2s ease;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .chip:hover{color:var(--text-primary); border-color:var(--text-secondary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .chip.active{color:var(--accent-fg); border-color:var(--lime); background:var(--lime);}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-box{
    display:flex; align-items:center; gap:var(--sp-3);
    background:var(--surface); border:1px solid var(--hairline-strong);
    border-radius:14px; padding:var(--sp-3) var(--sp-4);
    box-shadow:var(--shadow-soft);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-box input{
    flex:1; background:none; border:none; outline:none; color:var(--text-primary);
    font-family:var(--font-body); font-size:var(--text-base);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-box input::placeholder{color:var(--text-tertiary);}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-send{
    width:30px; height:30px; border-radius:50%; background:var(--lime);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:opacity .2s ease; cursor:pointer;
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-send::after{content:'↑'; color:var(--accent-fg); font-size:14px; font-weight:600;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-send.is-loading{opacity:0.6; pointer-events:none;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-send.is-loading::after{content:''; width:12px; height:12px; border-radius:50%;
    border:2px solid rgba(2, 11, 25, 0.35); border-top-color:var(--accent-fg); animation:spin .6s linear infinite;}
  @keyframes spin{to{transform:rotate(360deg);}}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .prompt-hint{
    font-family:var(--font-mono); font-size:10px; color:var(--text-tertiary);
    margin-top:var(--sp-2); letter-spacing:0.04em;
  }

  /* ================= MODAL / EXPANDED CARD ================= */
  .modal-scrim{
    position:fixed; inset:0; background:rgba(2, 11, 25, 0.72); backdrop-filter:blur(4px);
    z-index:50; display:flex; align-items:flex-end; justify-content:center;
    opacity:0; pointer-events:none; transition:opacity .3s ease;
  }
  .modal-scrim.open{opacity:1; pointer-events:auto;}
  body.modal-open{overflow:hidden;}
  @media (min-width:640px){ .modal-scrim{align-items:center;} }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .modal-sheet{
    width:100%; max-width:600px; max-height:86vh; overflow-y:auto;
    background:var(--brandos-surface); border:1px solid var(--hairline-strong);
    border-radius:20px 20px 0 0;
    padding:var(--sp-6) var(--sp-5) var(--sp-8) var(--sp-5);
    transform:translateY(24px); transition:transform .35s cubic-bezier(.2,.8,.2,1);
  }
  @media (min-width:640px){ :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .modal-sheet{border-radius:16px; margin-bottom:var(--sp-6);} }
  .modal-scrim.open .modal-sheet{transform:translateY(0);}

  /* ================= FEED OVERLAY — reading surface awakens from the landing ================= */
  .feed-overlay{
    position:fixed; inset:0; z-index:40;
    display:flex; align-items:stretch; justify-content:center;
    pointer-events:none; visibility:hidden;
  }
  .feed-overlay.open{pointer-events:auto; visibility:visible;}
  /* URL entry (?conversation= / ?brandos=1): land inside Digital Home with no slide-up. */
  html.brandos-entry-pending .feed-overlay.open .feed-overlay-scrim,
  html.brandos-entry-pending .feed-overlay.open .feed-overlay-sheet{
    transition:none !important;
  }
  html.brandos-entry-pending .feed-overlay.open .feed-overlay-sheet{
    transform:translateY(0);
    opacity:1;
  }
  .feed-overlay-scrim{
    position:absolute; inset:0;
    background:rgba(2, 11, 25, 0.55); backdrop-filter:blur(2px);
    opacity:0; transition:opacity .45s ease;
  }
  .feed-overlay.awakening .feed-overlay-scrim{
    background:rgba(2, 11, 25, 0.42);
  }
  .feed-overlay.open .feed-overlay-scrim{opacity:1;}
  .feed-overlay-sheet{
    position:relative; z-index:1;
    width:100%; max-width:var(--feed-reading-max);
    height:100vh; height:100dvh; max-height:100dvh;
    background:var(--bg);
    border-radius:0;
    display:flex; flex-direction:column;
    transform:translateY(100%);
    transition:transform .45s cubic-bezier(.2,.8,.2,1);
    box-shadow:none;
    overflow:hidden;
    isolation:isolate;
    --feed-gutter:var(--sp-6);
    --feed-section-space:var(--sp-7);
    --feed-reading-max:640px;
  }
  .feed-overlay.open .feed-overlay-sheet{transform:translateY(0);}
  .feed-overlay-body{
    flex:1 1 auto; min-height:0; width:100%; max-width:100%;
    overflow-x:hidden; overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    overflow-anchor:none;
  }

  /* ---- Feed editorial rhythm — one column surface, comfortable gutters ---- */
  #feedOverlay .topbar{
    position:relative; flex-shrink:0; max-width:100%;
    padding:max(var(--sp-4), calc(var(--sp-3) + var(--safe-top))) var(--feed-gutter) var(--sp-1);
  }
  #feedOverlay .topbar-inner{max-width:none; width:100%;}
  #feedOverlay .canvas-pinned-outer{
    position:relative; flex-shrink:0; top:auto;
    max-width:100%; overflow:hidden;
  }
  #feedOverlay .canvas-pinned{
    max-width:none; width:100%;
    padding:var(--sp-3) var(--feed-gutter);
    overflow-x:hidden; flex-wrap:wrap;
  }
  #feedOverlay .canvas-timeline{
    width:100%; max-width:100%; margin:0 auto;
    padding:0 var(--feed-gutter) var(--sp-8);
    overflow-x:hidden;
  }

  /* ---- Chapter opening — editorial first screen ---- */
  #feedOverlay .topbar{
    border-bottom-color:transparent;
    padding-bottom:var(--sp-1);
  }
  #feedOverlay .new-chapter-btn{
    font-size:12px; font-weight:500; color:var(--text-tertiary);
    border-color:var(--hairline); background:transparent;
    padding:5px 12px;
  }
  #feedOverlay .new-chapter-btn:hover{
    color:var(--text-secondary); border-color:var(--hairline-strong);
    background:transparent;
  }
  #feedOverlay .canvas-block > .canvas-user-msg{
    margin-left:auto; margin-right:0;
    width:fit-content; max-width:min(85%, 42ch);
    font-family:var(--font-body); font-style:normal; font-weight:500;
    font-size:var(--text-base); color:var(--text-primary); line-height:1.5;
    background:var(--surface);
    border:1px solid var(--hairline);
    border-radius:14px; box-shadow:none;
    padding:var(--sp-3) var(--sp-4);
    margin-bottom:var(--sp-5);
  }
  #feedOverlay .canvas-chapter{
    margin-bottom:var(--sp-3);
  }
  #feedOverlay .canvas-chapter-label{
    color:var(--text-tertiary);
  }
  #feedOverlay .canvas-block .canvas-pin-toggle{
    opacity:0.45;
    transition:opacity .2s ease, color .2s ease;
  }
  #feedOverlay .canvas-block:hover .canvas-pin-toggle,
  #feedOverlay .canvas-block:focus-within .canvas-pin-toggle,
  #feedOverlay .canvas-pin-toggle:hover,
  #feedOverlay .canvas-pin-toggle:focus-visible,
  #feedOverlay .canvas-pin-toggle.pinned{
    opacity:1;
  }
  @media (hover:none){
    #feedOverlay .canvas-block .canvas-pin-toggle{opacity:0.58;}
  }
  #feedOverlay .canvas-title{
    font-size:clamp(1.75rem, 6vw, 2.625rem) !important;
    line-height:1.12; letter-spacing:-0.02em;
    margin-top:var(--sp-2); margin-bottom:var(--sp-5);
  }
  @media (min-width:641px){
    #feedOverlay .canvas-title{font-size:clamp(2rem, 4.5vw, 2.625rem) !important;}
  }

  #feedOverlay .canvas-intro{
    margin-bottom:var(--sp-6);
    line-height:1.65;
  }
  #feedOverlay .canvas-intro + .canvas-gallery,
  #feedOverlay .canvas-intro + .canvas-media,
  #feedOverlay .canvas-intro + .canvas-milestones,
  #feedOverlay .canvas-intro-2 + .canvas-gallery,
  #feedOverlay .canvas-intro-2 + .canvas-media{
    margin-top:var(--sp-2);
  }
  #feedOverlay .canvas-media,
  #feedOverlay .canvas-event-hero{
    margin-left:0; margin-right:0;
    border-radius:var(--radius-lg);
  }
  #feedOverlay .canvas-media{
    margin-bottom:var(--feed-section-space);
    height:260px;
  }
  #feedOverlay .canvas-media img,
  #feedOverlay .canvas-media video{border-radius:var(--radius-lg);}
  #feedOverlay .canvas-media audio{width:100%; display:block;}
  #feedOverlay .canvas-event-hero{margin-bottom:var(--feed-section-space);}
  #feedOverlay .canvas-event-hero .canvas-media{margin:0; height:360px;}
  #feedOverlay .canvas-gallery{
    margin-bottom:var(--feed-section-space);
    gap:var(--sp-4);
    padding-bottom:var(--sp-1);
  }
  #feedOverlay .canvas-gallery-item img{border-radius:var(--radius-lg);}
  #feedOverlay .canvas-milestones,
  #feedOverlay .canvas-music-story,
  #feedOverlay .canvas-story-module,
  #feedOverlay .canvas-commerce,
  #feedOverlay .canvas-table,
  #feedOverlay .canvas-list,
  #feedOverlay .canvas-stats,
  #feedOverlay .canvas-event-meta,
  #feedOverlay .canvas-related{
    margin-bottom:var(--feed-section-space);
  }
  #feedOverlay .canvas-block{margin-bottom:var(--sp-9);}
  #feedOverlay .canvas-block.light{margin-bottom:var(--sp-8);}
  #feedOverlay .canvas-ask-dock{
    max-width:100%; overflow:hidden;
    padding:var(--sp-3) var(--feed-gutter) var(--sp-3);
    box-shadow:none;
    border-top:1px solid var(--hairline);
  }
  #feedOverlay .brandos-ask-stack:not(:has(.brandos-saved-strip:not([hidden]))) .canvas-ask-dock{
    padding-bottom:max(var(--sp-4), var(--safe-bottom));
  }
  #feedOverlay .canvas-ask-hint{margin-top:var(--sp-4);}

  /* ---- Epilogue: quote → feedback → divider → keep exploring ---- */
  #feedOverlay .canvas-quote:has(+ .canvas-relevance){margin-bottom:0;}
  #feedOverlay .canvas-relevance{
    margin-top:var(--sp-4); margin-bottom:0;
    padding:0; border:none;
  }
  #feedOverlay .canvas-relevance-label{
    font-size:10px; font-weight:400;
    letter-spacing:0.05em; opacity:0.8;
  }
  #feedOverlay .canvas-relevance-thanks{
    margin-top:var(--sp-2);
    font-size:10px; letter-spacing:0.04em; opacity:0.8;
  }
  #feedOverlay .canvas-related{
    margin-top:var(--sp-5); padding-top:var(--sp-5);
    border-top:1px solid var(--hairline);
  }

  #feedOverlay .canvas-commerce-gallery,
  #feedOverlay .canvas-collection-row,
  #feedOverlay .chips{
    max-width:100%; overflow-x:hidden;
  }
  @media (max-width:480px){
    .feed-overlay-sheet{--feed-gutter:var(--sp-5); --feed-section-space:var(--sp-6);}
    #feedOverlay .canvas-media{height:220px;}
    #feedOverlay .canvas-event-hero .canvas-media{height:280px;}
  }
  body.feed-overlay-open{
    overflow:hidden; overflow-x:hidden;
    position:fixed; width:100%; left:0; right:0;
  }
  /* ---- Mobile: landing recedes when conversation opens ---- */
  @media (max-width:639px){
    :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) #feedLanding.awakening .feed-landing-inner{
      opacity:0; visibility:hidden; pointer-events:none;
      transition:opacity .4s ease, visibility .4s ease;
    }
  }

  /* ---- Desktop: full-height column surface (no floating card) ---- */
  @media (min-width:640px){
    .feed-overlay{align-items:stretch; justify-content:center;}
    .feed-overlay-scrim{
      background:rgba(2, 11, 25, 0.38);
      backdrop-filter:blur(1px);
    }
    .feed-overlay.awakening .feed-overlay-scrim{
      background:rgba(2, 11, 25, 0.42);
    }
    .feed-overlay-sheet{
      border-radius:0;
      width:100%;
      max-width:var(--feed-reading-max);
      height:100vh; height:100dvh; max-height:100dvh;
      margin-bottom:0;
      transform:translateY(100%);
      opacity:1;
      transition:transform .45s cubic-bezier(.2,.8,.2,1);
      box-shadow:none;
    }
    .feed-overlay.open .feed-overlay-sheet{transform:translateY(0); opacity:1;}
    body.feed-overlay-open #appRoot,
    body.feed-overlay-open #appRoot #feedLanding,
    body.feed-overlay-open #appRoot #feedLanding .feed-landing-inner{
      opacity:1; visibility:visible; filter:none;
    }
    body.feed-overlay-open #appRoot .feed-landing-ask{display:flex;}
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .modal-close{
    display:flex; justify-content:flex-end; margin-bottom:var(--sp-4);
  }
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .modal-close button{
    font-family:var(--font-mono); font-size:11px; color:var(--text-tertiary); text-transform:uppercase;
    letter-spacing:0.06em; border:1px solid var(--hairline); padding:6px 12px; border-radius:999px;
  }

  /* ================= EMPTY / LOADING ================= */
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .empty-state{
    padding:var(--sp-9) var(--sp-5); text-align:center; color:var(--text-tertiary);
    animation:emptyStateIn .4s ease both;
  }
  @keyframes emptyStateIn{from{opacity:0; transform:translateY(4px);}to{opacity:1; transform:translateY(0);}}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .empty-state .mark{font-family:var(--font-display); font-weight:700; font-size:var(--text-xl); color:var(--text-secondary); display:block; margin-bottom:var(--sp-3); letter-spacing:-0.01em;}
  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .empty-state p{font-size:var(--text-sm); max-width:34ch; margin:0 auto;}

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .brandos-attribution{
    text-align:center; padding:var(--sp-6) var(--sp-5) var(--sp-8);
    font-family:var(--font-mono); font-size:10px; letter-spacing:0.04em;
    color:var(--text-tertiary); opacity:0.85;
  }
  :is(.digital-home-body, #appRoot) .brandos-legal-nav{
    display:flex; flex-wrap:wrap; justify-content:center; gap:var(--sp-3) var(--sp-5);
    margin-bottom:var(--sp-3);
  }
  :is(.digital-home-body, #appRoot) .brandos-legal-nav a{
    color:var(--text-tertiary); text-decoration:none;
  }
  :is(.digital-home-body, #appRoot) .brandos-legal-nav a:hover,
  :is(.digital-home-body, #appRoot) .brandos-legal-nav a:focus-visible{
    color:var(--text-secondary); outline:none;
  }
  :is(.digital-home-body, #appRoot) .brandos-legal-copy{
    margin:0;
  }
  :is(.digital-home-body, #appRoot) .brandos-legal-sep{
    color:var(--text-tertiary); opacity:0.6; user-select:none;
  }
  :is(.digital-home-body, #appRoot, #modalScrim) .brandos-legal-notice{
    margin:var(--sp-4) 0 0; font-family:var(--font-mono); font-size:10px;
    line-height:1.5; letter-spacing:0.02em; color:var(--text-tertiary); text-align:center;
  }
  :is(.digital-home-body, #appRoot, #modalScrim) .brandos-legal-notice a{
    color:var(--text-tertiary); text-decoration:underline; text-underline-offset:2px;
  }
  :is(.digital-home-body, #appRoot, #modalScrim) .brandos-legal-notice a:hover,
  :is(.digital-home-body, #appRoot, #modalScrim) .brandos-legal-notice a:focus-visible{
    color:var(--text-secondary); outline:none;
  }

  /* ================= Rasmus athlete theme — landing shell ================= */
  #appRoot{
    background:var(--brandos-bg);
    color:var(--text-primary);
  }

  :is(#appRoot) #feedLanding{
    background:var(--brandos-bg);
  }
  :is(#appRoot) #feedLanding.brandos-landing-awaiting-topic .feed-landing-ask{
    display:none;
  }
  :is(#appRoot) .app.locked #feedLanding{
    background:var(--brandos-surface);
    border-top:1px solid var(--hairline);
  }
  :is(#appRoot) .feed-landing-ask{
    background:var(--brandos-surface);
    border-color:var(--hairline-strong);
    box-shadow:var(--shadow-soft);
  }
  :is(#appRoot) .feed-chip{
    background:transparent;
    border-color:var(--hairline-strong);
    color:var(--text-secondary);
  }
  :is(#appRoot) .feed-chip:hover{
    border-color:var(--lime);
    color:var(--text-primary);
    background:rgba(22, 34, 53, 0.72);
  }

  /* ================= Feed theming — entire BrandOS conversation experience ================= */
  /*
   * The feed is part of BrandOS, not a separate UI. Same Rasmus tokens from landing
   * through conversation: navy chrome, warm reading surface, lime accent only
   * where interaction demands it. Landing → feed must feel seamless.
   */

  /* ---- Feed shell: conversation sheet + scroll body ---- */
  .feed-overlay-sheet{
    background:var(--brandos-surface-reading);
    color:var(--text-on-light-primary);
    --text-primary:var(--text-on-light-primary);
    --text-secondary:var(--text-on-light-secondary);
    --text-tertiary:var(--text-on-light-tertiary);
    --hairline:var(--hairline-on-light);
    --hairline-strong:var(--hairline-on-light-strong);
    --surface:var(--brandos-surface-neutral);
    --bg:var(--brandos-surface-reading);
    --lime:var(--brandos-accent);
    --rasmus:var(--brandos-accent);
  }

  #feedOverlay .feed-overlay-body,
  #feedOverlay .canvas-timeline{
    background:var(--brandos-surface-reading);
    color:var(--text-on-light-primary);
  }

  /* ---- Dark chrome: topbar, pinned bar, prompt dock, answer card ---- */
  #feedOverlay .topbar,
  #feedOverlay .canvas-pinned-outer,
  #feedOverlay .canvas-ask-dock,
  #feedOverlay .brandos-answer-card,
  #feedOverlay .brandos-saved-strip,
  #feedOverlay .brandos-relationship-reveal{
    --text-primary:#F7F4EF;
    --text-secondary:rgba(247, 244, 239, 0.72);
    --text-tertiary:rgba(247, 244, 239, 0.48);
    --hairline:rgba(247, 244, 239, 0.10);
    --hairline-strong:rgba(247, 244, 239, 0.18);
    --surface:var(--brandos-surface);
    --bg:var(--brandos-surface);
    background:var(--brandos-surface);
    color:var(--text-primary);
  }

  #feedOverlay .topbar{
    border-bottom:1px solid var(--hairline);
  }
  #feedOverlay .topbar-context{
    color:var(--lime);
  }
  #feedOverlay .canvas-pinned-outer{
    border-bottom-color:var(--hairline);
  }
  #feedOverlay .canvas-ask-dock{
    box-shadow:none;
    border-top:1px solid var(--hairline);
  }

  /* ---- Prompt dock + mini-player interactive states ---- */
  #feedOverlay .canvas-ask{
    background:rgba(247, 244, 239, 0.05);
    border-color:var(--hairline-strong);
    box-shadow:none;
  }
  #feedOverlay .canvas-ask textarea{
    color:var(--text-primary);
  }
  #feedOverlay .canvas-ask textarea::placeholder{
    color:var(--text-tertiary);
  }
  #feedOverlay .canvas-ask:focus-within{
    border-color:var(--lime);
    box-shadow:0 0 0 1px rgba(198, 227, 71, 0.18);
  }
  #feedOverlay .canvas-ask-hint{
    color:var(--text-tertiary);
  }

  #feedOverlay .canvas-pin-chip{
    background:rgba(247, 244, 239, 0.08);
    border-color:var(--hairline-strong);
    color:var(--text-secondary);
  }
  #feedOverlay .canvas-pin-chip:hover{
    border-color:var(--lime);
    color:var(--text-primary);
  }
  #feedOverlay .new-chapter-btn:hover{
    border-color:var(--lime);
    color:var(--text-primary);
  }

  /* ---- Feed typography ---- */
  #feedOverlay .canvas-title,
  #feedOverlay .canvas-intro,
  #feedOverlay .canvas-intro-2,
  #feedOverlay .canvas-conv-q{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .canvas-chapter-label,
  #feedOverlay .canvas-module-label,
  #feedOverlay .canvas-related-label,
  #feedOverlay .canvas-gallery-item .cap,
  #feedOverlay .canvas-collection-item .cap,
  #feedOverlay .canvas-milestone-year,
  #feedOverlay .canvas-quote-by,
  #feedOverlay .canvas-commerce-subtitle,
  #feedOverlay .canvas-relevance-label,
  #feedOverlay .canvas-relevance-thanks,
  #feedOverlay .canvas-loading-label{
    color:var(--text-on-light-tertiary);
  }
  #feedOverlay .canvas-conv-a,
  #feedOverlay .canvas-product-desc,
  #feedOverlay .canvas-commerce-desc,
  #feedOverlay .canvas-music-story-text,
  #feedOverlay .canvas-no-answer-text,
  #feedOverlay .canvas-decision-text{
    color:var(--text-on-light-secondary);
  }

  /* ---- Relationship layer open — feed stays put, subtle dim ---- */
  #feedOverlay.brandos-relationship-open .feed-overlay-body{
    opacity:0.72;
    transition:opacity .35s ease;
  }
  #feedOverlay .feed-overlay-body.brandos-feed-paused{
    pointer-events:none;
    touch-action:none;
    overscroll-behavior:none;
  }

  /* ---- Chapter labels + timeline ---- */
  #feedOverlay .canvas-chapter-dot,
  #feedOverlay .canvas-milestone-dot,
  #feedOverlay .canvas-product-feature .dot,
  #feedOverlay .canvas-commerce-included-item .dot,
  #feedOverlay .canvas-music-performance-item .dot{
    background:var(--lime);
  }
  #feedOverlay .canvas-milestone-line{
    background:var(--hairline-on-light-strong);
  }
  #feedOverlay .canvas-music-story-label,
  #feedOverlay .canvas-source-banner-sub,
  #feedOverlay .canvas-commerce-status,
  #feedOverlay .reply-status.sent{
    color:var(--lime);
  }
  #feedOverlay .canvas-source-banner-sub{
    color:var(--text-on-light-tertiary);
  }

  /* ---- User messages + story cards ---- */
  #feedOverlay .canvas-block > .canvas-user-msg,
  #feedOverlay .canvas-user-msg{
    background:var(--brandos-surface-neutral);
    border-color:var(--hairline-on-light);
    color:var(--text-on-light-primary);
  }

  #feedOverlay .canvas-product,
  #feedOverlay .canvas-commerce,
  #feedOverlay .canvas-milestones,
  #feedOverlay .canvas-partners,
  #feedOverlay .canvas-music-story,
  #feedOverlay .canvas-no-answer,
  #feedOverlay .canvas-decision,
  #feedOverlay .canvas-collection,
  #feedOverlay .canvas-story-module,
  #feedOverlay .brandos-invite,
  #feedOverlay .canvas-editorial-tag{
    background:var(--brandos-surface-neutral);
    border:1px solid var(--hairline-on-light);
  }
  /* Source banner is a header strip — never a filled card (overrides any rasmus-dim legacy) */
  #feedOverlay .canvas-source-banner{
    background:transparent !important;
    background-color:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    border-bottom:1px solid var(--hairline-on-light) !important;
  }
  #feedOverlay .canvas-editorial-tag{
    border-color:var(--hairline-on-light);
  }

  #feedOverlay .canvas-music-placeholder{
    background:var(--brandos-surface-neutral);
    border-color:var(--hairline-on-light-strong);
  }

  /* ---- Gallery + video surfaces ---- */
  #feedOverlay .canvas-media,
  #feedOverlay .canvas-media-placeholder,
  #feedOverlay .canvas-media-external{
    background:var(--brandos-surface-neutral);
    border-color:var(--hairline-on-light-strong);
  }
  #feedOverlay .canvas-media-external:hover{
    border-color:var(--text-on-light-secondary);
    background:var(--brandos-surface-reading);
  }
  #feedOverlay .canvas-gallery-item img,
  #feedOverlay .canvas-collection-item img,
  #feedOverlay .canvas-commerce-gallery img{
    border:1px solid var(--hairline-on-light);
  }

  /* ---- Quote blocks ---- */
  #feedOverlay .canvas-quote{
    border-left-color:var(--lime);
  }
  #feedOverlay .canvas-quote-text{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .canvas-conv-a{
    border-left-color:var(--hairline-on-light-strong);
  }

  /* ---- Related questions + section dividers ---- */
  #feedOverlay .canvas-related,
  #feedOverlay .canvas-recap,
  #feedOverlay .canvas-list-item,
  #feedOverlay .canvas-event-meta-row,
  #feedOverlay .canvas-partner-row,
  #feedOverlay .canvas-commerce-included-item,
  #feedOverlay .canvas-music-performance-item,
  #feedOverlay .canvas-table th,
  #feedOverlay .canvas-table td,
  #feedOverlay .canvas-product-feature{
    border-color:var(--hairline-on-light);
  }
  #feedOverlay .canvas-related-item{
    color:var(--text-on-light-primary);
    border-bottom-color:var(--hairline-on-light);
  }
  #feedOverlay .canvas-related-item:hover{
    color:var(--lime);
  }
  #feedOverlay .canvas-related-item::before{
    color:var(--text-on-light-tertiary);
  }

  /* ---- Interactive states across feed ---- */
  #feedOverlay .canvas-pin-toggle.pinned,
  #feedOverlay .canvas-loading-icon{
    color:var(--lime);
  }
  #feedOverlay .canvas-relevance-btn:hover{
    border-color:var(--hairline-on-light-strong);
    background:var(--brandos-surface-neutral);
    color:var(--text-on-light-secondary);
  }
  #feedOverlay .canvas-relevance-btn.selected{
    border-color:var(--lime);
    color:var(--lime);
  }
  #feedOverlay .canvas-entity{
    color:var(--lime);
  }
  #feedOverlay .canvas-entity:hover{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .canvas-teaser-cta:hover{
    border-color:var(--lime);
    color:var(--text-on-light-primary);
  }
  #feedOverlay .chip:hover{
    border-color:var(--hairline-on-light-strong);
    color:var(--text-on-light-primary);
  }
  #feedOverlay .chip.active{
    background:var(--lime);
    border-color:var(--lime);
    color:var(--accent-fg);
  }

  :is(.digital-home-body, #appRoot, #feedOverlay, #modalScrim) .canvas-story-cta{
    background:var(--lime);
    color:var(--accent-fg);
  }

  /* ---- Modal (expanded cards from feed) ---- */
  :is(.modal-scrim) .modal-sheet{
    background:var(--brandos-surface);
    color:var(--text-primary);
    --text-primary:#F7F4EF;
    --text-secondary:rgba(247, 244, 239, 0.72);
    --text-tertiary:rgba(247, 244, 239, 0.48);
    --hairline:rgba(247, 244, 239, 0.10);
    --hairline-strong:rgba(247, 244, 239, 0.18);
    --surface:var(--brandos-bg);
  }

  /* ================= Answer notification card (MVP — dev data only) ================= */
  /*
   * Ask stack lives outside the transformed feed-overlay-sheet so the dock stays
   * pinned to the visual viewport. Inside the sheet, Android Chrome can leave
   * 100dvh taller than the visible area after native video fullscreen — clipping
   * the flex-column dock at the bottom.
   */
  #feedOverlay:not(.open) .brandos-ask-stack{
    display:none !important;
  }
  #feedOverlay .brandos-ask-stack{
    position:fixed;
    bottom:0;
    z-index:2;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    flex-shrink:0;
    box-sizing:border-box;
    margin:0;
    padding-bottom:0;
    pointer-events:none;
    /* left, width, bottom synced from #feedOverlaySheet in app.js */
  }
  #feedOverlay .brandos-ask-stack > *{
    pointer-events:auto;
  }
  @keyframes brandosRelationshipEmerge{
    from{opacity:0; transform:translateY(10px) scale(0.985);}
    to{opacity:1; transform:translateY(0) scale(1);}
  }
  @keyframes brandosRelationshipCollapse{
    from{opacity:1; transform:translateY(0) scale(1);}
    to{opacity:0; transform:translateY(8px) scale(0.985);}
  }
  #feedOverlay .brandos-answer-card{
    transform-origin:bottom center;
    animation:brandosRelationshipEmerge .42s cubic-bezier(.22,.9,.32,1) both;
  }
  #feedOverlay .brandos-relationship-reveal{
    transform-origin:bottom center;
  }
  #feedOverlay .brandos-answer-card,
  #feedOverlay .brandos-relationship-reveal{
    position:relative;
    z-index:3;
  }
  #feedOverlay .brandos-relationship-reveal--closing{
    animation:brandosRelationshipCollapse .28s cubic-bezier(.4,0,.2,1) forwards;
    pointer-events:none;
  }
  #feedOverlay .brandos-answer-card,
  #feedLanding .brandos-landing-answer-card{
    position:relative;
    background:var(--brandos-surface);
    border:1px solid var(--hairline-strong);
    border-radius:16px;
    padding:var(--sp-4);
    color:var(--text-primary);
    text-align:left;
    width:100%;
    margin:0 0 var(--sp-4);
    box-sizing:border-box;
  }
  #feedLanding .brandos-landing-answer-card{
    border-bottom:1px solid var(--hairline-strong);
    transform-origin:center center;
    animation:brandosRelationshipEmerge .42s cubic-bezier(.22,.9,.32,1) both;
  }
  #feedLanding .brandos-landing-answer-card::before{
    content:'';
    position:absolute;
    inset:-1px;
    border-radius:16px;
    box-shadow:0 0 0 1px rgba(198, 227, 71, 0.22), 0 8px 28px rgba(198, 227, 71, 0.12);
    opacity:0;
    pointer-events:none;
  }
  #feedLanding .brandos-landing-answer-card.brandos-answer-card--glow::before{
    animation:brandosAnswerCardGlow 3.5s ease-out .35s forwards;
  }
  #feedOverlay .brandos-answer-card{
    border-bottom:none;
    border-radius:16px 16px 0 0;
    padding:var(--sp-4) var(--sp-4) var(--sp-3);
    margin:0;
  }
  #feedOverlay .brandos-answer-card::before{
    content:'';
    position:absolute;
    inset:-1px;
    border-radius:16px 16px 0 0;
    box-shadow:0 0 0 1px rgba(198, 227, 71, 0.22), 0 -8px 28px rgba(198, 227, 71, 0.12);
    opacity:0;
    pointer-events:none;
  }
  #feedOverlay .brandos-answer-card.brandos-answer-card--glow::before{
    animation:brandosAnswerCardGlow 3.5s ease-out .35s forwards;
  }
  @keyframes brandosAnswerCardGlow{
    0%{opacity:1;}
    100%{opacity:0;}
  }
  #feedOverlay .brandos-answer-card.brandos-answer-card--opening{
    animation:brandosAnswerCardOpen .42s cubic-bezier(.4,0,.2,1) forwards;
  }
  @keyframes brandosAnswerCardOpen{
    to{opacity:0; transform:translateY(-8px) scale(0.98);}
  }
  #feedOverlay .brandos-answer-card__dev{
    font-family:var(--font-mono);
    font-size:9px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--lime);
    opacity:0.85;
    margin-bottom:var(--sp-3);
  }
  #feedOverlay .brandos-answer-card__badge,
  #feedLanding .brandos-answer-card__badge{
    display:flex;
    align-items:center;
    gap:var(--sp-2);
    margin-bottom:var(--sp-3);
  }
  #feedOverlay .brandos-answer-card__avatar,
  #feedLanding .brandos-answer-card__avatar{
    width:32px;
    height:32px;
    border-radius:50%;
    object-fit:cover;
    flex-shrink:0;
    border:1px solid var(--hairline-strong);
    background:var(--brandos-bg);
  }
  #feedOverlay .brandos-answer-card__badge-text,
  #feedLanding .brandos-answer-card__badge-text{
    font-family:var(--font-mono);
    font-size:12px;
    letter-spacing:0.04em;
    line-height:1.35;
    margin:0;
  }
  #feedOverlay .brandos-answer-card__badge-text b,
  #feedLanding .brandos-answer-card__badge-text b{
    color:var(--lime);
    font-weight:600;
  }
  #feedOverlay .brandos-answer-card__badge-text span,
  #feedLanding .brandos-answer-card__badge-text span{
    color:var(--text-secondary);
  }
  #feedOverlay .brandos-answer-card__question,
  #feedLanding .brandos-answer-card__question{
    font-size:var(--text-sm);
    color:rgba(247, 244, 239, 0.92);
    line-height:1.55;
    margin-bottom:var(--sp-3);
    padding-left:var(--sp-3);
    border-left:2px solid var(--hairline-strong);
  }
  #feedOverlay .brandos-answer-card__question-label,
  #feedLanding .brandos-answer-card__question-label{
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:0.05em;
    display:block;
    margin-bottom:6px;
    color:rgba(247, 244, 239, 0.78);
  }
  #feedOverlay .brandos-answer-card__blur,
  #feedLanding .brandos-answer-card__blur{
    filter:blur(6px);
    user-select:none;
    pointer-events:none;
    font-size:var(--text-base);
    line-height:1.55;
    color:var(--text-primary);
    margin-bottom:var(--sp-4);
  }
  #feedOverlay .brandos-answer-card__open,
  #feedLanding .brandos-answer-card__open{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:var(--sp-2);
    width:100%;
    background:var(--rasmus-dim);
    border:1px solid var(--hairline-strong);
    border-radius:10px;
    padding:12px;
    cursor:pointer;
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--lime);
    transition:background .2s ease, border-color .2s ease;
  }
  #feedOverlay .brandos-answer-card__open:hover,
  #feedLanding .brandos-answer-card__open:hover{
    background:var(--rasmus-dim);
    border-color:var(--lime);
  }
  #feedOverlay .brandos-answer-card__open svg,
  #feedLanding .brandos-answer-card__open svg{
    width:12px;
    height:12px;
    flex-shrink:0;
  }
  #feedOverlay .brandos-ask-stack .canvas-ask-dock{
    position:relative;
    z-index:2;
    margin:0;
    width:100%;
    padding:var(--sp-3) var(--feed-gutter) var(--sp-3);
    border-radius:0;
    border:none;
    border-top:1px solid var(--hairline-strong);
    box-shadow:none;
    transition:border-color .35s ease, padding-bottom .2s ease;
  }
  #feedOverlay .brandos-ask-stack--relationship-active .canvas-ask-dock{
    box-shadow:none;
    border-top-color:rgba(198, 227, 71, 0.22);
  }
  #feedOverlay .brandos-ask-stack--relationship-active .canvas-ask-hint{
    opacity:0.42;
    transition:opacity .3s ease;
  }
  #feedOverlay .brandos-answer-card__dev{
    display:none;
  }
  #feedOverlay .brandos-saved-strip{
    position:relative;
    z-index:1;
    flex-shrink:0;
    background:var(--brandos-surface);
    border:1px solid var(--hairline-strong);
    border-top:1px solid var(--hairline);
    border-radius:0;
    padding:8px var(--feed-gutter) max(10px, var(--safe-bottom));
    color:var(--text-primary);
  }
  #feedOverlay .brandos-saved-strip__head,
  #feedOverlay .brandos-saved-strip__row{
    opacity:1;
  }
  #feedOverlay .brandos-ask-stack--relationship-active .brandos-saved-strip__head,
  #feedOverlay .brandos-ask-stack--relationship-active .brandos-saved-strip__row{
    opacity:0.92;
  }
  #feedOverlay .brandos-saved-strip__head{
    display:flex;
    align-items:center;
    gap:6px;
    margin-bottom:8px;
  }
  #feedOverlay .brandos-saved-strip__title,
  #feedOverlay .brandos-saved-strip__count{
    font-family:var(--font-mono);
    font-size:10px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:rgba(247, 244, 239, 0.94);
  }
  #feedOverlay .brandos-saved-strip__row{
    display:flex;
    gap:12px;
    overflow-x:auto;
    padding-bottom:2px;
    scrollbar-width:none;
  }
  #feedOverlay .brandos-saved-strip__row::-webkit-scrollbar{ display:none; }
  #feedOverlay .brandos-saved-strip__item{
    flex-shrink:0;
    width:40px;
    background:none;
    border:none;
    padding:0;
    cursor:pointer;
    color:inherit;
    opacity:1;
    transition:opacity .2s ease;
  }
  #feedOverlay .brandos-saved-strip__item:hover,
  #feedOverlay .brandos-saved-strip__item--active{
    opacity:1;
  }
  #feedOverlay .brandos-saved-strip__avatar{
    display:block;
    width:36px;
    height:36px;
    border-radius:50%;
    margin:0 auto 4px;
    background:var(--brandos-bg);
    border:1px solid rgba(198, 227, 71, 0.28);
    position:relative;
  }
  #feedOverlay .brandos-saved-strip__type{
    position:absolute;
    bottom:-1px;
    right:-1px;
    width:14px;
    height:14px;
    border-radius:50%;
    background:var(--brandos-surface);
    border:1.5px solid var(--brandos-surface);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--lime);
  }
  #feedOverlay .brandos-saved-strip__type svg{
    width:7px;
    height:7px;
  }
  #feedOverlay .brandos-saved-strip__label{
    font-size:10px;
    color:rgba(247, 244, 239, 0.92);
    line-height:1.3;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #feedOverlay .brandos-saved-strip__item--active .brandos-saved-strip__avatar{
    border-color:var(--lime);
    box-shadow:0 0 0 1px rgba(198, 227, 71, 0.35);
  }
  #feedOverlay .brandos-relationship-reveal{
    position:relative;
    z-index:1;
    background:var(--brandos-surface-reading);
    border:1px solid var(--hairline-on-light);
    border-bottom:none;
    border-radius:16px 16px 0 0;
    padding:var(--sp-5) var(--sp-4) var(--sp-4);
    color:var(--text-on-light-primary);
    max-height:min(52vh, 420px);
    overflow-y:auto;
  }
  #feedOverlay .brandos-relationship-reveal--open{
    box-shadow:0 -8px 24px rgba(0, 0, 0, 0.12);
  }
  #feedOverlay .brandos-relationship-reveal__close{
    position:absolute;
    top:10px;
    right:10px;
    width:28px;
    height:28px;
    border:none;
    border-radius:50%;
    background:rgba(2, 11, 25, 0.06);
    color:var(--text-on-light-secondary);
    font-size:18px;
    line-height:1;
    cursor:pointer;
    z-index:1;
  }
  #feedOverlay .brandos-relationship-reveal__close:hover{
    background:rgba(2, 11, 25, 0.1);
    color:var(--text-on-light-primary);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal{
    padding-top:var(--sp-1);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__chapter-label{
    color:var(--text-on-light-tertiary);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__question{
    color:rgba(2, 11, 25, 0.78);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__chapter-label{
    color:rgba(2, 11, 25, 0.58);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__answer{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__replay,
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__save{
    color:var(--text-on-light-secondary);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__replay:hover,
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__save:hover{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .brandos-relationship-reveal .brandos-personal-reveal__save--active{
    color:var(--lime);
  }
  #feedOverlay .brandos-personal-reveal__avatar-wrap{
    position:relative;
    width:56px;
    height:56px;
    margin:0 auto var(--sp-4);
  }
  #feedOverlay .brandos-personal-reveal__avatar-glow{
    position:absolute;
    inset:-10px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(198, 227, 71, 0.28), transparent 70%);
    animation:brandosPersonalAvatarBreathe 3.2s ease-in-out infinite;
  }
  @keyframes brandosPersonalAvatarBreathe{
    0%,100%{ opacity:0.55; transform:scale(1); }
    50%{ opacity:1; transform:scale(1.06); }
  }
  #feedOverlay .brandos-personal-reveal__avatar{
    position:relative;
    display:block;
    width:56px;
    height:56px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid rgba(198, 227, 71, 0.45);
    margin:0 auto;
    background:var(--brandos-bg);
  }
  #feedOverlay .brandos-personal-reveal__chapter{
    display:flex;
    align-items:center;
    gap:var(--sp-2);
    margin-bottom:var(--sp-3);
  }
  #feedOverlay .brandos-personal-reveal__chapter-label{
    font-family:var(--font-mono);
    font-size:10px;
    letter-spacing:0.1em;
  }
  #feedOverlay .brandos-personal-reveal__question{
    font-size:var(--text-sm);
    font-style:italic;
    line-height:1.55;
    margin-bottom:var(--sp-4);
    opacity:0.85;
  }
  #feedOverlay .brandos-personal-reveal__answer{
    font-size:clamp(1.05rem, 2.8vw, 1.25rem);
    line-height:1.55;
    font-weight:500;
    margin-bottom:var(--sp-4);
  }
  #feedOverlay .brandos-personal-reveal__word{
    display:inline-block;
    opacity:0;
    filter:blur(4px);
    transform:translateY(6px);
    animation:brandosPersonalWordIn var(--brandos-word-fade, 400ms) cubic-bezier(.22,.9,.32,1) both;
  }
  @keyframes brandosPersonalWordIn{
    from{ opacity:0; filter:blur(4px); transform:translateY(6px); }
    to{ opacity:1; filter:blur(0); transform:translateY(0); }
  }
  #feedOverlay .brandos-personal-reveal__actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    opacity:0;
    transition:opacity .45s ease;
  }
  #feedOverlay .brandos-personal-reveal__actions--visible{
    opacity:1;
  }
  #feedOverlay .brandos-personal-reveal__replay,
  #feedOverlay .brandos-personal-reveal__save{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:none;
    border:none;
    cursor:pointer;
    font-family:var(--font-mono);
    font-size:10.5px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--text-on-light-secondary);
    padding:0;
  }
  #feedOverlay .brandos-personal-reveal__replay:hover,
  #feedOverlay .brandos-personal-reveal__save:hover{
    color:var(--text-on-light-primary);
  }
  #feedOverlay .brandos-personal-reveal__replay svg,
  #feedOverlay .brandos-personal-reveal__save svg{
    width:14px;
    height:14px;
  }
  #feedOverlay .brandos-personal-reveal__save--active{
    color:var(--lime);
  }
  #feedOverlay .brandos-personal-reveal__save--active svg{
    fill:var(--lime);
  }
  #feedOverlay .brandos-ask-stack:has(.brandos-relationship-reveal.brandos-relationship-reveal--open) .brandos-answer-card{
    display:none !important;
  }
  #feedOverlay .brandos-ask-stack:has(.brandos-answer-card:not([hidden])) .canvas-ask-dock,
  #feedOverlay .brandos-ask-stack:has(.brandos-relationship-reveal.brandos-relationship-reveal--open) .canvas-ask-dock{
    border-radius:0;
    border-top:none;
  }
  #feedOverlay .brandos-ask-stack:has(.brandos-saved-strip:not([hidden])) .canvas-ask-dock{
    border-radius:0;
    border-bottom:none;
    padding-bottom:var(--sp-3);
  }
  #feedOverlay .brandos-ask-stack:not(:has(.brandos-saved-strip:not([hidden]))) .canvas-ask-dock{
    padding-bottom:max(var(--sp-4), var(--safe-bottom));
  }
  #feedOverlay .brandos-ask-stack .canvas-ask{
    margin:0;
  }
  #feedOverlay .brandos-ask-stack .canvas-ask-hint{
    padding:0;
  }

  /* ================= Phase 2A — mobile-first responsive (≤640px only) ================= */
  @media (max-width:640px), ((orientation:landscape) and (max-height:500px)){
    html, body, #appRoot, .feed-overlay{
      overflow-x:clip;
      max-width:100%;
    }

    :is(#appRoot) .feed{
      padding-left:var(--brandos-feed-gutter-inline);
      padding-right:var(--brandos-feed-gutter-inline);
      padding-bottom:calc(var(--sp-8) + var(--safe-bottom));
    }
    :is(#appRoot) .feed-landing-inner{
      padding-left:max(var(--sp-4), var(--safe-left));
      padding-right:max(var(--sp-4), var(--safe-right));
    }
    :is(#appRoot) .feed-landing-title,
    :is(#appRoot) .app.locked .feed-landing-title{
      font-size:clamp(1.375rem, 5.5vw, 1.75rem) !important;
      line-height:1.2;
    }
    :is(#appRoot) .feed-landing-philosophy{
      font-size:clamp(0.875rem, 3.6vw, 1rem);
      line-height:1.45;
    }
    :is(#appRoot) .feed-landing-ask{
      padding:6px 6px 6px max(16px, var(--safe-left));
    }
    :is(#appRoot, #feedOverlay) .canvas-ask-send{
      width:var(--touch-target-min);
      height:var(--touch-target-min);
      min-width:var(--touch-target-min);
      min-height:var(--touch-target-min);
    }

    .feed-overlay-sheet{
      --feed-gutter:max(var(--sp-4), var(--safe-left), var(--safe-right));
      --feed-section-space:var(--sp-6);
      width:100%;
      max-width:100%;
    }
    #feedOverlay .topbar{
      padding-top:max(var(--sp-4), calc(var(--sp-3) + var(--safe-top)));
      padding-left:var(--feed-gutter);
      padding-right:var(--feed-gutter);
    }
    #feedOverlay .canvas-timeline{
      padding-left:var(--feed-gutter);
      padding-right:var(--feed-gutter);
    }
    #feedOverlay .canvas-intro{
      font-size:clamp(0.9375rem, 3.8vw, 1.125rem);
      line-height:1.65;
    }
    #feedOverlay .canvas-block{
      scroll-margin-top:calc(var(--topbar-height, 60px) + var(--safe-top) + 12px);
    }

    #feedOverlay .canvas-ask-dock{
      padding:var(--sp-3) var(--feed-gutter) var(--sp-3);
    }
    #feedOverlay .brandos-ask-stack:not(:has(.brandos-saved-strip:not([hidden]))) .canvas-ask-dock{
      padding-bottom:max(var(--sp-4), calc(var(--sp-3) + var(--safe-bottom)));
    }
    #feedOverlay .brandos-ask-stack{
      margin-left:0;
      margin-right:0;
      padding-bottom:0;
    }
    #feedOverlay .canvas-ask{
      padding:var(--sp-2) var(--sp-3);
      gap:var(--sp-2);
    }
    #feedOverlay .canvas-ask textarea{
      font-size:clamp(0.9375rem, 3.6vw, 1rem);
      padding:10px 0;
    }

    :is(#appRoot) .brandos-attribution{
      padding-bottom:calc(var(--sp-8) + var(--safe-bottom));
    }
  }

  @media (max-width:390px){
    .feed-overlay-sheet{--feed-gutter:max(var(--sp-4), var(--safe-left), var(--safe-right));}
    :is(#appRoot){--brandos-feed-gutter:var(--sp-4);}
  }

  @media (max-width:640px) and (orientation:landscape) and (max-height:500px),
  ((orientation:landscape) and (max-height:500px)){
    :is(#appRoot) #brandHero{
      height:min(68vh, 44vh);
    }
    :is(#appRoot) #feedLanding{
      min-height:auto;
      padding:var(--sp-6) 0 var(--sp-5);
    }
    :is(#appRoot) .app.locked #feedLanding{
      padding:var(--sp-3) 0;
    }
    .feed-overlay-sheet{
      height:100vh; height:100dvh; max-height:100dvh;
    }
    #feedOverlay .canvas-ask-dock{
      padding-top:var(--sp-2);
      padding-bottom:var(--sp-3);
    }
    #feedOverlay .brandos-ask-stack:not(:has(.brandos-saved-strip:not([hidden]))) .canvas-ask-dock{
      padding-bottom:max(var(--sp-3), calc(var(--sp-2) + var(--safe-bottom)));
    }
  }

/* Editorial architecture v1 — reading mode (.brandos-editorial-arch-v1) */
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');

.brandos-editorial-arch-v1 .ea-category{
  --ea-bg:#F7F3EC;
  --ea-text:#0F172A;
  --ea-text-2:#3F3F46;
  --ea-text-3:#71717A;
  --ea-divider:#E7E1D7;
  background:var(--ea-bg);
  color:var(--ea-text);
  border-radius:20px;
  padding:28px 20px 36px;
  margin-top:8px;
}

.brandos-editorial-arch-v1 .ea-category-header{
  position:relative;
  margin-bottom:20px;
}

.brandos-editorial-arch-v1 .ea-eyebrow{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
}
.brandos-editorial-arch-v1 .ea-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--lime);
  flex-shrink:0;
}
.brandos-editorial-arch-v1 .ea-eyebrow span:last-child{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--ea-text-3);
}

.brandos-editorial-arch-v1 .ea-category-title{
  font-family:'Anton',sans-serif;
  font-weight:400;
  font-size:clamp(28px, 7vw, 38px);
  line-height:1.05;
  text-transform:uppercase;
  letter-spacing:0.005em;
}

.brandos-editorial-arch-v1 .ea-category-header--selection-above{
  margin-bottom:0;
}

.brandos-editorial-arch-v1.brandos-content-match[data-selection-above="true"] .ea-sequence .ea-personal-answer{
  padding-top:12px;
}

.brandos-editorial-arch-v1 .ea-sequence{
  display:flex;
  flex-direction:column;
}

.brandos-editorial-arch-v1 .ea-item{
  padding:24px 0;
  border-bottom:8px solid #EFEAE0;
}
.brandos-editorial-arch-v1 .ea-item:last-child{
  border-bottom:none;
  padding-bottom:8px;
}

.brandos-editorial-arch-v1 .ea-headline{
  font-family:'Anton',sans-serif;
  font-weight:400;
  font-size:clamp(22px, 5.5vw, 32px);
  line-height:1.08;
  text-transform:uppercase;
  letter-spacing:0.005em;
  margin-bottom:12px;
  color:var(--ea-text);
}

.brandos-editorial-arch-v1 .ea-dek{
  font-size:14.5px;
  line-height:1.6;
  color:var(--ea-text-2);
  margin-bottom:18px;
  max-width:34ch;
}

.brandos-editorial-arch-v1 .ea-body{
  font-size:16px;
  line-height:1.75;
  color:var(--ea-text-2);
  margin-bottom:14px;
  max-width:38ch;
}
.brandos-editorial-arch-v1 .ea-body:last-child{margin-bottom:0;}

.brandos-editorial-arch-v1 .ea-quote{
  margin:18px 0;
  padding:20px 0;
  border-top:1px solid var(--ea-divider);
  border-bottom:1px solid var(--ea-divider);
}
.brandos-editorial-arch-v1 .ea-quote .canvas-quote-text{
  font-family:'Anton',sans-serif;
  font-size:22px;
  line-height:1.25;
  color:var(--ea-text);
}

.brandos-editorial-arch-v1 .ea-knowledge-section .canvas-table,
.brandos-editorial-arch-v1 .ea-knowledge-section .canvas-milestones{
  margin-top:16px;
}

.brandos-editorial-arch-v1 .ea-soft-card{
  background:#fff;
  border-radius:20px;
  padding:16px;
  box-shadow:0 8px 30px rgba(0,0,0,0.05);
  margin-top:12px;
}

.brandos-editorial-arch-v1 .canvas-pin-toggle{
  position:absolute;
  top:0;
  right:0;
}

.brandos-editorial-arch-v1 .canvas-related{
  margin-top:24px;
  padding-top:8px;
}

/* Personal Answer videos: preserve native aspect ratio (9:16 vertical, 16:9 horizontal, etc.) */
.brandos-editorial-arch-v1 .ea-personal-answer .canvas-media,
#feedOverlay .brandos-editorial-arch-v1 .ea-personal-answer .canvas-media,
#feedOverlay .brandos-content-match .ea-personal-answer .canvas-media{
  height:auto;
  overflow:visible;
  max-width:min(100%, 360px);
  margin-left:0;
  margin-right:auto;
}

.brandos-editorial-arch-v1 .ea-personal-answer .canvas-media video,
#feedOverlay .brandos-editorial-arch-v1 .ea-personal-answer .canvas-media video,
#feedOverlay .brandos-content-match .ea-personal-answer .canvas-media video{
  width:100%;
  height:auto;
  max-height:min(70vh, 640px);
  object-fit:contain;
  display:block;
  background:#000;
}

.canvas-content-explore-lead{
  font-size:15px;
  color:var(--text-secondary);
  margin:0 0 16px;
  line-height:1.5;
}

.canvas-send-question-secondary{
  display:block;
  width:100%;
  margin-top:20px;
  padding:12px 0;
  border:none;
  border-top:1px solid var(--border);
  background:transparent;
  color:var(--text-secondary);
  font-size:14px;
  text-align:center;
  cursor:pointer;
  line-height:1.45;
}
.canvas-send-question-secondary:hover{
  color:var(--text);
}
.canvas-send-question-secondary:disabled{
  opacity:0.6;
  cursor:default;
}