/* ADR 0060: editorial 5:7 cards; imagery stays clear and copy stays top-left. */
#view-home .fv-hero { display:flex; flex-direction:column; align-items:center; gap:0; padding:18px 18px 20px; }
.fv-deck { width:min(84%,340px); margin:12px auto 22px; padding-right:14px; position:relative; isolation:isolate; }
.fv-deck::before { content:''; position:absolute; inset:18px 0 18px 14px; border:1px solid var(--line); border-radius:24px; transform:rotate(3deg); background:var(--surface); box-shadow:0 12px 26px #0002; z-index:-1; }
.fv-card { position:relative; isolation:isolate; width:100%; min-width:0; aspect-ratio:5/7; min-height:0; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:25px; padding:28px 24px; border:1px solid var(--line); border-radius:24px; background:var(--surface); color:var(--text); text-align:left; overflow:hidden; touch-action:pan-y pinch-zoom; }
.fv-empty { background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 4%,var(--surface)),var(--surface)); }
.fv-card-brand { display:block; flex:none; font-size:11px; letter-spacing:4px; color:inherit; }
.fv-card-brand::after { content:''; display:block; width:88px; height:1px; background:currentColor; opacity:.5; margin-top:12px; }
.fv-plus { display:grid; place-items:center; width:48px; height:48px; flex:none; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--accent); }
:is(.fv-hero,.mp-story,.mp-start-log) .fv-plus svg { width:24px; height:24px; }
.fv-card > .fv-plus { margin-top:auto; align-self:flex-end; }
.fv-hero svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; flex:none; }
.fv-card-copy { display:block; position:relative; }
.fv-card-copy > small { display:block; font-size:11px; line-height:1.6; margin-bottom:12px; color:inherit; }
.fv-card-copy > strong { display:block; font-size:clamp(28px,3vw,34px); font-weight:700; line-height:1.3; letter-spacing:-.8px; }
.fv-card-copy > span { display:block; font-size:12px; line-height:1.8; margin-top:16px; word-break:keep-all; }
.fv-card-photo,.fv-photo-shade { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.fv-photo-shade { z-index:-1; background:linear-gradient(180deg,#052431a8, #05243166 32%,transparent 62%); }
.fv-sport { color:#fff; background:#062432; text-shadow:0 1px 3px #001b2b55; }
.fv-start .fv-card-copy > span { color:var(--muted); }
.fv-create,.fv-browse,.fv-instructor { min-height:44px; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 12px; border:0; background:transparent; color:var(--text); font-size:13px; }
.fv-create { margin:0 auto 2px; font-size:15px; font-weight:650; }
.fv-hint { text-align:center; color:var(--muted); font-size:12px; line-height:1.8; margin:0; word-break:keep-all; }
.fv-links { display:flex; flex-wrap:wrap; justify-content:center; column-gap:16px; margin-top:14px; }
.fv-instructor { color:var(--accent); }
.fv-preview-note { text-align:center; font-size:11px; color:var(--muted); line-height:1.8; margin:12px 0 0; word-break:keep-all; }
.fv-tabs { width:min(100%,306px); display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; border:1px solid var(--line); border-radius:14px; background:var(--surface); margin:0 auto 14px; }
.fv-tabs button { min-height:44px; padding:9px; border:0; border-radius:10px; color:var(--text); background:transparent; font-size:13px; }
.fv-tabs:not(.choice-group) button[aria-pressed='true'] { color:var(--accent-text); background:var(--action-bg); font-weight:700; }
.mp-panel[data-stage='onboarding'] .mp-sport-options > button[aria-pressed='true'] { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
.mp-panel[data-stage='onboarding'] .mp-sport-options > button[aria-pressed='true'] small { color:var(--accent); }
.mp-starter-tabs { margin-bottom:18px; }
.mp-story.fv-owned { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:22px; padding:24px 20px; min-height:0; aspect-ratio:5/7; }
.mp-story.fv-start { color:var(--text); background:var(--surface); border:1px solid var(--line); }
.mp-story.fv-sport { color:#fff; }
.mp-story.fv-owned .fv-card-copy > strong { font-size:clamp(21px,11cqw,30px); }
.mp-story.fv-owned .fv-card-brand { position:static; }
.mp-story.fv-owned > .fv-plus { margin-top:auto; align-self:flex-end; }
.mp-first-art .mp-story.fv-owned { padding:8px; gap:8px; }
.mp-first-art .fv-card-brand,.mp-first-art .fv-card-copy > small,.mp-first-art .fv-card-copy > span { display:none; }
.mp-first-art .fv-card-copy > strong { font-size:12px!important; }
.mp-first-art .fv-plus { width:26px; height:26px; }
.mp-first-art .fv-plus svg { width:15px; height:15px; }
.mp-start-log .fv-log-placeholder { display:grid; place-items:center; width:64px; height:88px; border:1px solid var(--line); border-radius:9px; background:var(--bg); color:var(--accent); }
.mp-start-log .fv-log-placeholder svg { width:24px!important; height:24px!important; }
.mp-primary:disabled { background:var(--disabled-bg); border-color:transparent; color:var(--disabled-text); cursor:not-allowed; }
.mp-story.fv-owned .mp-story-level { color:inherit; font-size:11px; margin-top:0; }
.mp-instructor-launch { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; padding:16px; margin-top:16px; min-height:64px; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--text); text-align:left; font-size:14px; }
.mp-instructor-launch small { display:block; color:var(--muted); font-size:12px; margin-top:5px; }
.mp-instructor-launch svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; flex:none; }
@media(min-width:960px) { #view-home .fv-hero { justify-content:center; align-self:start; padding-top:12px; } .fv-deck { margin-top:0; } }
@media(max-width:959px) { #view-home .fv-hero { padding-top:calc(var(--mobile-header-top) + 86px); padding-inline:12px; } }
@media(max-width:359px) { .fv-deck { width:88%; } .fv-card { padding:24px 20px; gap:20px; } .fv-card-copy > strong { font-size:28px; } .fv-card-copy > span { font-size:11px; } .fv-links { column-gap:4px; } .fv-instructor,.fv-browse { font-size:12px; padding-inline:8px; } }
@media(prefers-reduced-motion:no-preference) { .fv-owned .fv-card-copy { animation:fv-card-in 220ms ease-out; } @keyframes fv-card-in { from { transform:translateY(6px); opacity:.6; } to { transform:translateY(0); opacity:1; } } }

/* Keep the existing wordmark and add the supplied brand symbol. */
.fv-brand-row { display:flex; align-items:center; gap:8px; }
.fv-brand-row > img { width:30px; height:19px; object-fit:contain; flex:none; }
.fv-start .fv-brand-row > img { display:none; }
.fv-start .fv-brand-row::before { content:''; width:30px; height:19px; flex:none; background:url('./assets/logo-dark.svg') center/contain no-repeat; }
:root[data-theme='light'] .fv-start .fv-brand-row::before { background-image:url('./assets/logo-light-teal.svg'); }
.mp-story.fv-owned { gap:16px; }
.mp-story.fv-owned .mp-story-level { margin-top:auto; padding:7px 9px; border-radius:8px; background:#031522c9; color:#fff; font-size:11px; line-height:1.5; }
.mp-story-level > small { display:block; color:#bed8df; font-size:9px; }
.mp-story button.fv-plus { cursor:pointer; padding:0; }
.mp-story.fv-owned { padding:20px 18px; gap:12px; }
.mp-story.fv-owned .fv-card-copy > small { font-size:10px; margin-bottom:8px; }
.mp-story.fv-owned .fv-card-copy > strong { font-size:clamp(20px,10cqw,26px); }
.mp-story.fv-owned .fv-card-copy > span { font-size:10px; line-height:1.6; margin-top:10px; }
.mp-story.fv-owned .mp-story-level { padding:6px 8px; font-size:10px; }