.lmc-root{--paper:#f7f4ef;--paper-sunk:#efebe3;--paper-raise:#fff;--ink:#1a1a1a;--ink-soft:#4a4a48;--ink-mute:#5a5752;--hairline:#1a1a1a26;--hairline-bold:#1a1a1a40;--accent:#2a8f65;--accent-light:#4fb286;--accent-ink:#1f6d4d;--accent-soft:#2a8f6514;--shadow-subtle:0 1px 3px #1a1a1a0f,0 1px 2px #1a1a1a0a;--shadow-lift:0 8px 24px #1a1a1a1a,0 2px 6px #1a1a1a0d;--font-sans:"Source Serif 4",Georgia,serif;--font-drama:"DM Serif Display",Georgia,serif;--font-mono:"Source Serif 4",Georgia,serif;font-family:var(--font-sans);color:var(--ink);background:0 0}.lmc-root *{box-sizing:border-box}.lmc-container{max-width:880px;margin:0 auto;padding:1.5rem}.lmc-hero{border-bottom:1px solid var(--hairline);background:var(--paper);padding:6rem 1.5rem 5rem}.lmc-badge{color:#1a1a1a;text-transform:uppercase;letter-spacing:.08em;background:0 0;border:none;border-radius:0;align-items:center;gap:6px;margin-bottom:1.5rem;padding:0;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;display:inline-flex}.lmc-badge:before{content:"";background:#2a8f65;width:6px;height:6px;display:inline-block}.lmc-h1{font-family:var(--font-drama);letter-spacing:-.01em;max-width:38rem;color:var(--ink);text-transform:none;margin:0 0 1.25rem;font-size:clamp(2.25rem,6vw,3.5rem);font-weight:400;line-height:1.05}.lmc-h1 em,.lmc-h1 i{font-family:var(--font-drama);color:#2a8f65;font-style:italic;font-weight:400}.lmc-sub{max-width:42rem;color:var(--ink-soft);margin:0 0 2rem;font-size:clamp(1.05rem,2vw,1.25rem);font-weight:400;line-height:1.55}.lmc-meta-chip{text-transform:uppercase;letter-spacing:.08em;color:#1a1a1a;background:0 0;border:none;border-radius:0;align-items:center;gap:6px;padding:0;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;display:inline-flex}.lmc-meta-chip:before{content:"";background:#2a8f65;width:6px;height:6px;display:inline-block}.lmc-meta{flex-wrap:wrap;gap:1.5rem;display:flex}.lmc-widget{max-width:880px;margin:5rem auto;padding:0 1.5rem}.lmc-card{background:var(--paper);border:1px solid var(--hairline);box-shadow:none;border-left:4px solid #2a8f65;border-radius:0;padding:2.5rem 2rem}.lmc-progress-row{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;display:flex}.lmc-progress-bar{background:var(--paper-sunk);border:1px solid var(--hairline);border-radius:4px;flex:auto;height:.4rem;position:relative;overflow:hidden}.lmc-progress-fill{background:var(--accent);width:0%;height:100%;transition:width .25s}.lmc-category{color:#1a1a1a;text-transform:uppercase;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;border-radius:0;align-items:center;gap:6px;max-width:100%;margin-bottom:1.25rem;padding:0;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;display:inline-flex;overflow:hidden}.lmc-category:before{content:"";background:#2a8f65;flex-shrink:0;width:6px;height:6px;display:inline-block}.lmc-question{font-family:var(--font-drama);letter-spacing:-.01em;color:var(--ink);text-transform:none;margin:0 0 1.75rem;font-size:clamp(1.45rem,3vw,2rem);font-weight:400;line-height:1.2}.lmc-question em,.lmc-question i{font-family:var(--font-drama);color:#2a8f65;font-style:italic;font-weight:400}.lmc-options{flex-direction:column;gap:.5rem;margin:0 0 1.75rem;padding:0;list-style:none;display:flex}.lmc-opt{cursor:pointer;background:var(--paper-raise);border:1px solid var(--hairline);color:var(--ink);border-radius:0;padding:1rem 1.15rem;font-size:1rem;font-weight:500;line-height:1.45;transition:background .15s,border-color .15s;display:block;position:relative}.lmc-opt:hover{border-color:var(--hairline-bold);background:#1a1a1a0a}.lmc-opt.selected{border-color:var(--hairline);color:var(--ink);background:0 0;border-left:4px solid #2a8f65;padding-left:calc(1.15rem - 3px);font-weight:600}.lmc-opt input[type=radio]{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.lmc-opt input[type=radio]:focus+span{outline-offset:4px;border-radius:0;outline:2px solid #2a8f65}.lmc-nav{border-top:1px solid var(--hairline);justify-content:space-between;gap:.75rem;padding-top:1.5rem;display:flex}.lmc-btn{color:#f7f4ef;letter-spacing:0;cursor:pointer;box-shadow:none;text-transform:none;background:#1a1a1a;border:none;border-radius:0;justify-content:center;align-items:center;gap:.5rem;padding:14px 28px;font-family:"Source Serif 4",Georgia,serif;font-size:17px;font-weight:600;text-decoration:none;transition:background 80ms;display:inline-flex}.lmc-btn:hover:not([disabled]){color:#f7f4ef;background:#000}.lmc-btn:focus-visible{outline-offset:2px;outline:2px solid #2a8f65}.lmc-btn[disabled]{background:var(--paper-sunk);color:var(--ink-mute);border:1px solid var(--hairline);cursor:not-allowed}.lmc-btn-secondary{color:var(--ink-soft);border:1px solid var(--hairline-bold);background:0 0;padding:12px 22px;font-family:"Source Serif 4",Georgia,serif;font-size:15px;font-weight:600}.lmc-btn-secondary:hover:not([disabled]){background:var(--paper-sunk);color:var(--ink)}.lmc-result{text-align:left;padding:1rem 0}.lmc-score-ring{width:200px;height:200px;margin:0 0 1.5rem;position:relative}.lmc-score-ring svg{transform:rotate(-90deg)}.lmc-score-ring circle{fill:none;stroke-width:8px}.lmc-score-ring .track{stroke:var(--paper-sunk)}.lmc-score-ring .arc{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset .6s}.lmc-score-ring .score-num{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.lmc-score-ring .score-num .num{font-family:var(--font-drama);letter-spacing:-.01em;color:var(--ink);font-feature-settings:"tnum" 1,"lnum" 1;font-variant-numeric:tabular-nums lining-nums;font-size:3.75rem;font-weight:400;line-height:1}.lmc-score-ring .score-num .suffix{color:var(--ink-mute);letter-spacing:.08em;text-transform:uppercase;margin-top:.5rem;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600}.lmc-tier-pill{color:#1a1a1a;text-transform:uppercase;letter-spacing:.08em;background:0 0;border:none;border-radius:0;align-items:center;gap:6px;margin-bottom:1.25rem;padding:0;font-family:"Source Serif 4",Georgia,serif;font-size:14px;font-weight:600;display:inline-flex}.lmc-tier-pill:before{content:"";background:#2a8f65;width:6px;height:6px;display:inline-block}.lmc-tier-pill.medium{background:var(--paper-sunk);color:var(--ink-soft);border-color:var(--hairline-bold)}.lmc-tier-pill.low{background:var(--paper-sunk);color:var(--ink-mute);border-color:var(--hairline-bold)}.lmc-result-lead{color:var(--ink-soft);max-width:42rem;margin:0 0 1.75rem;font-family:"Source Serif 4",Georgia,serif;font-size:1.125rem;font-weight:400;line-height:1.55}.lmc-capture{background:var(--ink);color:var(--paper);text-align:left;box-shadow:none;border-radius:0;margin:2.5rem 0;padding:4rem 2rem}.lmc-capture h3{font-family:var(--font-drama);letter-spacing:0;color:var(--paper);text-transform:none;margin:0 0 .6rem;font-size:1.5rem;font-weight:400;line-height:1.2}.lmc-capture h3 em,.lmc-capture h3 i{font-family:var(--font-drama);color:#2a8f65;font-style:italic;font-weight:400}.lmc-capture p{color:#f7f4efc7;margin:0 0 1.5rem;font-size:.95rem;line-height:1.55}.lmc-form{flex-wrap:wrap;gap:.5rem;display:flex}.lmc-form-input{min-width:0;color:var(--paper);font-size:1rem;font-family:var(--font-sans);background:#f7f4ef0f;border:1px solid #f7f4ef38;border-radius:4px;flex:240px;padding:.85rem 1rem}.lmc-form-input::placeholder{color:#f7f4ef73}.lmc-form-input:focus{border-color:var(--accent-light);background:#f7f4ef1a;outline:none;box-shadow:0 0 0 3px rgba(42,143,101,.18)}.lmc-note{color:var(--ink-mute);margin-top:.85rem;font-size:.82rem;line-height:1.5}.lmc-unlocked{margin-top:2rem}.lmc-category-block{border:1px solid var(--hairline);background:var(--paper-sunk);border-radius:4px;margin:1rem 0;padding:1.25rem 1.5rem}.lmc-category-block h4{letter-spacing:0;color:var(--ink);text-transform:none;margin:0 0 .5rem;font-family:"Source Serif 4",Georgia,serif;font-size:1.1rem;font-weight:600}.lmc-cat-bar{align-items:center;gap:1rem;margin-bottom:.85rem;display:flex}.lmc-cat-track{background:var(--paper-raise);border:1px solid var(--hairline);border-radius:4px;flex:auto;height:.4rem;overflow:hidden}.lmc-cat-fill{background:var(--accent);height:100%;transition:width .4s}.lmc-cat-pct{font-variant-numeric:tabular-nums;text-align:right;min-width:3rem;color:var(--ink);font-family:"Source Serif 4",Georgia,serif;font-size:.95rem;font-weight:600}.lmc-share{border-top:1px solid var(--hairline);flex-wrap:wrap;gap:.5rem;margin-top:2rem;padding-top:1.5rem;display:flex}.lmc-rec{background:var(--paper-sunk);color:var(--ink);border-left:2px solid #2a8f65;border-radius:0 4px 4px 0;margin:.75rem 0;padding:1rem 1.15rem;font-family:"Source Serif 4",Georgia,serif;font-size:1rem;line-height:1.55}.lmc-rec strong{text-transform:uppercase;letter-spacing:.08em;color:#2a8f65;margin-bottom:.4rem;font-family:"Source Serif 4",Georgia,serif;font-size:12px;font-weight:600;display:block}.lmc-toast{background:var(--ink);color:var(--paper);letter-spacing:0;border:1px solid var(--ink);box-shadow:var(--shadow-lift);z-index:100;opacity:0;pointer-events:none;border-radius:4px;padding:.85rem 1.25rem;font-family:"Source Serif 4",Georgia,serif;font-size:.95rem;font-weight:600;transition:opacity .25s,transform .25s;position:fixed;bottom:1.5rem;right:1.5rem;transform:translateY(10px)}.lmc-toast.show{opacity:1;pointer-events:auto;transform:translateY(0)}.lmc-intro{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--hairline);padding:5rem 1.5rem;position:relative;overflow:hidden}.lmc-intro-inner{flex-wrap:wrap;align-items:flex-start;gap:2.5rem;max-width:880px;margin:0 auto;display:flex;position:relative}.lmc-intro-avatar{border:1px solid var(--hairline);object-fit:cover;width:128px;height:128px;box-shadow:none;filter:saturate(.45)sepia(.18)contrast(1.1)brightness(.95);border-radius:4px;flex-shrink:0}.lmc-intro-body{flex:320px;min-width:0}.lmc-intro-badge{color:#1a1a1a;text-transform:uppercase;letter-spacing:.08em;background:0 0;border:none;border-radius:0;align-items:center;gap:6px;margin-bottom:1rem;padding:0;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;display:inline-flex}.lmc-intro-badge:before{content:"";background:#2a8f65;width:6px;height:6px;display:inline-block}.lmc-intro-h{font-family:var(--font-drama);letter-spacing:-.01em;color:var(--ink);text-transform:none;margin:0 0 .75rem;font-size:clamp(1.65rem,3.5vw,2.5rem);font-weight:400;line-height:1.1}.lmc-intro-h em,.lmc-intro-h i{font-family:var(--font-drama);color:#2a8f65;font-style:italic;font-weight:400}.lmc-intro-p{max-width:38rem;color:var(--ink-soft);margin:0 0 1.5rem;font-size:1.05rem;font-weight:400;line-height:1.55}.lmc-intro-points{color:var(--ink);flex-direction:column;gap:.65rem;margin:0 0 1.75rem;padding:0;font-size:.95rem;list-style:none;display:flex}.lmc-intro-points li{align-items:flex-start;gap:.85rem;line-height:1.5;display:flex}.lmc-intro-icon{background:var(--accent);color:#fff;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;margin-top:2px;font-family:"Source Serif 4",Georgia,serif;font-size:.78rem;font-weight:600;display:flex}.lmc-intro-icon.a,.lmc-intro-icon.b,.lmc-intro-icon.c{background:var(--accent);color:#fff}.lmc-intro-start{color:#f7f4ef;box-shadow:none;cursor:pointer;background:#1a1a1a;border:none;border-radius:0;align-items:center;gap:.5rem;padding:14px 28px;font-family:"Source Serif 4",Georgia,serif;font-size:17px;font-weight:600;text-decoration:none;transition:background 80ms;display:inline-flex}.lmc-intro-start:hover{color:#f7f4ef;background:#000}.lmc-intro-note{color:var(--ink-mute);max-width:32rem;margin-top:1rem;font-size:.82rem;line-height:1.5}@media (prefers-reduced-motion:reduce){.lmc-progress-fill,.lmc-opt,.lmc-btn,.lmc-cat-fill,.lmc-score-ring .arc,.lmc-toast{transition:none!important}}@media (width<=640px){.lmc-hero{padding:2.5rem 1.25rem 2rem}.lmc-card{padding:1.75rem 1.25rem}.lmc-nav{flex-direction:column-reverse}.lmc-btn{width:100%}.lmc-intro{padding:2.5rem 1.25rem}.lmc-intro-avatar{width:96px;height:96px}.lmc-score-ring{width:160px;height:160px}.lmc-score-ring .score-num .num{font-size:2.5rem}}
/* ─── 2026-05-25 — Start gate + slide transitions + result reveal ─────── */
/* Start gate: widget hidden until intro "Start" is clicked. Fades + lifts
into view. Reserves vertical space so the page doesn't jump on reveal. */
.lmc-widget {
transition: opacity 360ms cubic-bezier(0.22, 0.61, 0.36, 1),
transform 360ms cubic-bezier(0.22, 0.61, 0.36, 1);
will-change: opacity, transform;
}
.lmc-widget-gated { opacity: 0; transform: translateY(28px); pointer-events: none; min-height: 360px; }
.lmc-widget-gated > * { visibility: hidden; }
.lmc-widget-revealed { opacity: 1; transform: translateY(0); pointer-events: auto; }
/* Slide transitions: each question is wrapped in .lmc-slide. The card
becomes the stage. Outgoing slide drifts off in its travel direction
(forward = exit left, back = exit right); incoming slides in from the
opposite side, ~260ms. */
.lmc-card { position: relative; overflow: hidden; }
.lmc-slide {
opacity: 1;
transform: none;
transition: opacity 260ms cubic-bezier(0.22, 0.61, 0.36, 1),
transform 260ms cubic-bezier(0.22, 0.61, 0.36, 1);
will-change: opacity, transform;
}
.lmc-slide.lmc-in-fwd { opacity: 0; transform: translateX(32px); }
.lmc-slide.lmc-in-back { opacity: 0; transform: translateX(-32px); }
.lmc-slide.lmc-out-fwd { opacity: 0; transform: translateX(-32px); pointer-events: none; }
.lmc-slide.lmc-out-back{ opacity: 0; transform: translateX(32px); pointer-events: none; }
/* Result reveal — replaces the legacy left-bar tier card with a paper-clean
editorial hero: sage progress ring + huge italic score + tier headline. */
.lmc-result { padding: 0.5rem 0 0; }
.lmc-result-card { background: transparent !important; border: none !important; border-left: none !important; padding: 0 !important; overflow: visible !important; }
.lmc-score-hero {
position: relative;
display: grid;
grid-template-columns: auto 1fr;
gap: 3rem;
align-items: center;
padding: 3.25rem 0 3.5rem;
border-top: 1px solid rgba(26, 26, 26, 0.08);
border-bottom: 1px solid rgba(26, 26, 26, 0.08);
background: radial-gradient(ellipse 80% 100% at 18% 50%, rgba(42, 143, 101, 0.10), transparent 70%);
opacity: 0;
transform: translateY(24px);
animation: lmc-rise 620ms cubic-bezier(0.22, 0.61, 0.36, 1) 60ms forwards;
}
@media (max-width: 640px) {
.lmc-score-hero {
grid-template-columns: 1fr;
gap: 1.75rem;
padding: 2.25rem 0 2.5rem;
text-align: center;
justify-items: center;
background: radial-gradient(circle at 50% 30%, rgba(42, 143, 101, 0.10), transparent 65%);
}
}
.lmc-score-hero .lmc-score-ring {
width: 260px; height: 260px; margin: 0; position: relative; flex-shrink: 0;
}
@media (max-width: 980px) { .lmc-score-hero .lmc-score-ring { width: 220px; height: 220px; } }
@media (max-width: 640px) { .lmc-score-hero .lmc-score-ring { width: 200px; height: 200px; } }
.lmc-score-hero .lmc-score-ring svg { width: 100%; height: 100%; display: block; transform: rotate(-90deg); }
.lmc-score-hero .ring-track { fill: none; stroke: rgba(26, 26, 26, 0.08); stroke-width: 10; }
.lmc-score-hero .ring-fill {
fill: none; stroke: #2A8F65; stroke-width: 10; stroke-linecap: round;
transition: stroke-dashoffset 1400ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.lmc-score-hero .lmc-score-ring-center {
position: absolute; inset: 0;
display: flex; flex-direction: column; align-items: center; justify-content: center;
text-align: center;
}
.lmc-score-hero .lmc-score-number {
font-family: 'DM Serif Display', Georgia, serif;
font-style: italic; font-weight: 400;
font-size: 5.75rem; line-height: 1;
color: #2A8F65;
letter-spacing: -0.02em;
font-variant-numeric: tabular-nums;
}
@media (max-width: 980px) { .lmc-score-hero .lmc-score-number { font-size: 4.75rem; } }
@media (max-width: 640px) { .lmc-score-hero .lmc-score-number { font-size: 4.25rem; } }
.lmc-score-hero .lmc-score-denom {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 12px; font-weight: 600;
letter-spacing: 0.08em; text-transform: uppercase;
color: rgba(26, 26, 26, 0.5);
margin-top: 0.5rem;
}
.lmc-score-body { display: flex; flex-direction: column; gap: 0.85rem; min-width: 0; }
.lmc-score-eyebrow {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 13px; font-weight: 600;
letter-spacing: 0.08em; text-transform: uppercase;
color: #1A1A1A;
display: inline-flex; align-items: center; gap: 10px;
}
.lmc-score-eyebrow::before { content: ""; display: inline-block; width: 28px; height: 1px; background: #2A8F65; }
.lmc-score-headline {
font-family: 'DM Serif Display', Georgia, serif;
font-size: clamp(1.85rem, 3.6vw, 2.6rem);
font-weight: 400; line-height: 1.1;
letter-spacing: -0.01em;
color: #1A1A1A;
margin: 0;
}
.lmc-score-headline em {
font-family: 'DM Serif Display', Georgia, serif;
font-style: italic; font-weight: 400;
color: #2A8F65;
}
.lmc-score-note {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 1.05rem; line-height: 1.6;
color: #3D3D3B;
margin: 0; max-width: 34rem;
}
.lmc-score-note strong { color: #1A1A1A; font-weight: 600; }
/* Critical tier: swap sage for ink so the visual weight matches the message. */
.lmc-score-hero[data-tier="critical"] .ring-fill { stroke: #1A1A1A; }
.lmc-score-hero[data-tier="critical"] .lmc-score-number { color: #1A1A1A; }
.lmc-score-hero[data-tier="critical"] .lmc-score-eyebrow::before { background: #1A1A1A; }
.lmc-score-hero[data-tier="critical"] .lmc-score-headline em { color: #1A1A1A; }
/* Staggered fade-in for downstream result sections. Set --lmc-delay inline. */
.lmc-result-section {
opacity: 0;
transform: translateY(16px);
animation: lmc-rise 540ms cubic-bezier(0.22, 0.61, 0.36, 1) var(--lmc-delay, 240ms) forwards;
}
@keyframes lmc-rise { to { opacity: 1; transform: translateY(0); } }
/* Per-category bars: animate from 0 to score% when armed. */
.lmc-cat-fill { width: 0 !important; transition: width 900ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.lmc-cat-fill.lmc-cat-fill-armed { width: var(--lmc-cat-target, 0%) !important; }
/* The unlocked per-category section uses the staggered-rise pattern. */
.lmc-result .lmc-category-block {
background: transparent;
border: none;
border-top: 1px solid rgba(26, 26, 26, 0.08);
border-radius: 0;
padding: 1.5rem 0;
margin: 0;
opacity: 0;
transform: translateY(12px);
animation: lmc-rise 520ms cubic-bezier(0.22, 0.61, 0.36, 1) var(--lmc-delay, 0ms) forwards;
}
.lmc-result .lmc-category-block:first-of-type { border-top: none; }
.lmc-result .lmc-category-block h4 {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 13px; font-weight: 600;
letter-spacing: 0.08em; text-transform: uppercase;
margin: 0 0 0.75rem;
color: #1A1A1A;
}
.lmc-result .lmc-cat-bar { gap: 1.5rem; align-items: center; }
.lmc-result .lmc-cat-track {
background: rgba(26, 26, 26, 0.07);
border: none;
border-radius: 999px;
height: 6px;
flex: 1 1 auto;
overflow: hidden;
}
.lmc-result .lmc-cat-fill { background: #2A8F65; border-radius: 999px; }
.lmc-result .lmc-cat-pct {
font-family: 'DM Serif Display', Georgia, serif;
font-style: italic; font-weight: 400;
font-size: 1.5rem; color: #2A8F65;
min-width: 4ch; text-align: right;
font-variant-numeric: tabular-nums;
letter-spacing: -0.01em;
}
.lmc-result .lmc-rec {
background: transparent;
border-left: 2px solid rgba(42, 143, 101, 0.35);
border-radius: 0;
padding: 0.65rem 0 0.3rem 1rem;
margin: 1rem 0 0;
font-size: 0.96rem;
line-height: 1.55;
color: #3D3D3B;
}
.lmc-result .lmc-rec strong {
display: block;
font-family: 'Source Serif 4', Georgia, serif;
font-size: 12px; font-weight: 600;
letter-spacing: 0.08em; text-transform: uppercase;
color: #2A8F65;
margin-bottom: 0.4rem;
}
.lmc-result .lmc-rec ul { margin: 0.5rem 0 0; padding-left: 1.1rem; }
.lmc-result .lmc-rec li { margin-bottom: 0.3rem; }
.lmc-result .lmc-rec li::marker { color: #2A8F65; }
/* Per-category section header */
.lmc-result-unlock-h {
font-family: 'DM Serif Display', Georgia, serif;
font-size: clamp(1.5rem, 2.8vw, 1.85rem);
font-weight: 400;
letter-spacing: -0.01em;
margin: 0 0 1.25rem;
color: #1A1A1A;
}
.lmc-result-unlock-h em {
font-family: 'DM Serif Display', Georgia, serif;
font-style: italic; font-weight: 400;
color: #2A8F65;
}
/* Retake — de-emphasised text link, not a hard button */
.lmc-result .lmc-retake-wrap { margin-top: 2.5rem; }
.lmc-result .lmc-retake {
background: transparent; border: none; padding: 0;
font-family: 'Source Serif 4', Georgia, serif;
font-size: 0.9rem; color: #4D4A45;
cursor: pointer;
border-bottom: 1px solid rgba(26, 26, 26, 0.2);
padding-bottom: 2px;
transition: color 120ms, border-color 120ms;
}
.lmc-result .lmc-retake:hover { color: #2A8F65; border-bottom-color: #2A8F65; }
/* ─── 2026-05-26 — Start screen, progress bar, tap-highlight fix ──────── */
/* Disable the iOS/Android green tap-flash on options. The selected state
already gives a clear sage-bar indicator. */
.lmc-opt, .lmc-btn, .lmc-intro-start, .lmc-start-btn, .lmc-intro-reset-btn,
.lmc-retake, .lmc-opt input, .lmc-opt span {
-webkit-tap-highlight-color: transparent;
}
.lmc-opt:focus { outline: none; }
/* Start screen — visible by default before the first question. Same card
chrome as a question but with editorial weight and a single CTA. */
.lmc-start-slide { padding: 0.25rem 0; }
.lmc-start-eyebrow { margin-bottom: 1.5rem !important; }
.lmc-start-h {
font-family: 'DM Serif Display', Georgia, serif;
font-size: clamp(1.85rem, 4vw, 2.75rem);
font-weight: 400;
line-height: 1.1;
letter-spacing: -0.01em;
margin: 0 0 1rem;
color: #1A1A1A;
max-width: 30rem;
}
.lmc-start-h em {
font-family: 'DM Serif Display', Georgia, serif;
font-style: italic;
font-weight: 400;
color: #2A8F65;
}
.lmc-start-p {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 1.05rem;
line-height: 1.6;
color: #3D3D3B;
margin: 0 0 1.75rem;
max-width: 36rem;
}
.lmc-start-meta {
display: flex;
flex-wrap: wrap;
gap: 1.5rem 1.75rem;
margin: 0 0 2rem;
font-family: 'Source Serif 4', Georgia, serif;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #1A1A1A;
}
.lmc-start-meta-item { display: inline-flex; align-items: center; gap: 8px; }
.lmc-start-meta-dot { display: inline-block; width: 6px; height: 6px; background: #2A8F65; }
.lmc-start-nav {
border-top: 1px solid rgba(26, 26, 26, 0.08);
padding-top: 1.5rem;
justify-content: flex-start !important;
}
.lmc-start-btn {
padding: 16px 32px !important;
font-size: 18px !important;
}
/* Progress bar — sits at the top of every question slide. */
.lmc-progress { margin: 0 0 1.5rem; }
.lmc-progress-row {
display: flex; align-items: baseline; justify-content: space-between;
font-family: 'Source Serif 4', Georgia, serif;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(26, 26, 26, 0.55);
margin: 0 0 0.5rem;
background: transparent;
padding: 0;
border: none;
}
.lmc-progress-label { color: rgba(26, 26, 26, 0.75); }
.lmc-progress-pct { color: #2A8F65; font-variant-numeric: tabular-nums; }
.lmc-progress-track {
height: 3px;
background: rgba(26, 26, 26, 0.07);
border-radius: 999px;
overflow: hidden;
border: none;
flex: none;
}
.lmc-progress-fill {
height: 100%;
background: #2A8F65;
border-radius: 999px;
transition: width 360ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* Sr-only utility (some HTML wrappers don't ship this) */
.sr-only {
position: absolute !important; width: 1px !important; height: 1px !important;
padding: 0 !important; margin: -1px !important; overflow: hidden !important;
clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;
}
/* Reset progress link — surfaces in the intro only when localStorage has
saved answers. Quiet by default; sage on hover. */
.lmc-intro-reset {
font-family: 'Source Serif 4', Georgia, serif;
font-size: 0.88rem;
color: #4D4A45;
margin: 1rem 0 0;
line-height: 1.5;
}
.lmc-intro-reset-prefix { color: rgba(26, 26, 26, 0.5); margin-right: 0.35rem; }
.lmc-intro-reset-btn {
background: transparent;
border: none;
padding: 0;
font: inherit;
color: #4D4A45;
cursor: pointer;
border-bottom: 1px solid rgba(26, 26, 26, 0.22);
padding-bottom: 1px;
transition: color 120ms, border-color 120ms;
}
.lmc-intro-reset-btn:hover { color: #2A8F65; border-bottom-color: #2A8F65; }
.lmc-intro-reset-btn:focus-visible { outline: 2px solid #2A8F65; outline-offset: 3px; }
/* Reduced-motion respect */
@media (prefers-reduced-motion: reduce) {
.lmc-widget, .lmc-slide, .lmc-score-hero, .lmc-result-section,
.lmc-cat-fill, .lmc-category-block, .ring-fill {
transition: none !important; animation: none !important;
opacity: 1 !important; transform: none !important;
}
.lmc-widget-gated { opacity: 1; transform: none; pointer-events: auto; min-height: 0; }
.lmc-widget-gated > * { visibility: visible; }
.lmc-cat-fill { width: var(--lmc-cat-target, 0%) !important; }
}/* 2026-05-27 — Brand alignment with ivanmanfredi.com hero
- Sage highlight sweep behind italic pivot in start headline + intro headline
- More editorial portrait treatment
- Sage eyebrow color (matching hero) */
/* Highlight sweep — encodes the same wavy SVG path used on ivanmanfredi.com hero italic.
Applied to em/i inside the start headline and intro headline. */
.lmc-start-h em,
.lmc-start-h i,
.lmc-intro-h em,
.lmc-intro-h i {
position: relative;
font-style: italic;
color: #1A1A1A !important; /* override the green em color — sage lives in the sweep, not the text */
display: inline-block;
isolation: isolate;
padding: 0 0.04em;
}
.lmc-start-h em::after,
.lmc-start-h i::after,
.lmc-intro-h em::after,
.lmc-intro-h i::after {
content: "";
position: absolute;
left: -5%;
right: -5%;
top: 0.18em;
width: 110%;
height: 0.78em;
z-index: -1;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: 100% 100%;
pointer-events: none;
}
/* Sage eyebrow — match the small uppercase tag pattern on ivanmanfredi.com */
.lmc-start-eyebrow {
color: #2A8F65 !important;
font-weight: 700;
}
/* Portrait — bigger + editorial magazine treatment. */
.lmc-intro-avatar {
width: 168px !important;
height: 212px !important; /* ~3:4 portrait aspect like ivanmanfredi.com */
object-fit: cover;
object-position: top center;
border-radius: 12px !important;
border: 1px solid rgba(26, 26, 26, 0.12) !important;
box-shadow: 0 16px 40px rgba(26, 26, 26, 0.12), 0 4px 12px rgba(26, 26, 26, 0.08) !important;
filter: saturate(0.85) contrast(1.05) !important; /* keep human warmth, less heavy duotone */
}
@media (max-width: 640px) {
.lmc-intro-avatar {
width: 128px !important;
height: 160px !important;
}
}
/* Tight editorial headline metrics. The card has a generic `.lmc-card h2` rule
with `!important` for tag-style uppercase labels (0.08em letter-spacing). That
selector has specificity 0,2,1 — to beat it on the start headline (which IS
an h2 inside .lmc-card) we match the same specificity with `.lmc-card h2.lmc-start-h`
and use !important + later cascade order. */
.lmc-card h2.lmc-start-h,
.lmc-card h2.lmc-intro-h,
.lmc-intro h2.lmc-intro-h,
.lmc-root h2.lmc-start-h,
.lmc-root h2.lmc-intro-h {
font-family: 'DM Serif Display', Georgia, serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
line-height: 1.0 !important;
text-transform: none !important;
}
/* Page-title H1 inside the resource page (above the engine widget) gets the same
tight metrics + the italic-pivot sage sweep so we can add a highlight from the
data.json title without re-deploying the engine. */
.lmc-h1 {
letter-spacing: -0.02em !important;
line-height: 0.98 !important;
}
.lmc-h1 em,
.lmc-h1 i {
position: relative;
font-style: italic;
color: #1A1A1A !important;
display: inline-block;
isolation: isolate;
padding: 0 0.04em;
}
.lmc-h1 em::after,
.lmc-h1 i::after {
content: "";
position: absolute;
left: -5%;
right: -5%;
top: 0.18em;
width: 110%;
height: 0.78em;
z-index: -1;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: 100% 100%;
pointer-events: none;
}
/* Same for the in-quiz question headline (it's also h2 inside .lmc-card) */
.lmc-question {
font-family: 'DM Serif Display', Georgia, serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
text-transform: none !important;
}