/* Blueprint v3 P7 part 5: the deep reading (assets/js/lifegraph-deep-view.v1.js).
   Quiet Instrument (appendix K): neutral bands, the member's band one step
   lighter, an ivory marker; numbered badges tell tests apart and lab colour
   only tells labs apart. Text stays at 4.5:1 or more on #111d29. */
.lgd{--lgd-ivory:#f3eedc;--lgd-band:#2c3b47;--lgd-band-2:#344653;--lgd-mine:#7d8f9b;--lgd-line:#314550;--lgd-muted:#b7cbd1}
.lgd h4{font-size:24px;margin:0 0 10px}.lgd h5{font:600 16px/1.4 system-ui,sans-serif;margin:14px 0 6px}
.lgd p{margin:8px 0}.lgd ul{margin:6px 0}.lgd li{margin:6px 0}
.lgd>h3{margin:4px 0 6px;font-size:clamp(24px,3.4vw,30px);overflow-wrap:anywhere}
.lgd section{padding:18px 0;border-top:1px solid var(--lgd-line)}
.lgd p,.lgd li{max-width:70ch;overflow-wrap:break-word}
.lgd-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:28px;height:28px;margin-right:10px;border-radius:50%;background:var(--lgd-lab,#b7cbd1);color:#0b1a24;font:700 16px/1 system-ui,sans-serif;vertical-align:middle}
.lgd-top{display:grid;gap:4px 32px;align-items:center;margin:12px 0 4px}
.lgd-chord{margin:0}
.lgd-chord-svg{display:block;width:240px;height:240px;margin:0 auto}
.lgd-chord-svg text{font:700 32px system-ui,sans-serif;fill:#0b1a24}
.lgd-ribbon{fill-opacity:.62}
.lgd-chord figcaption{font-size:16px;color:var(--lgd-muted)}
.lgd-chord figcaption p{margin:8px 0 0}
.lgd .lgd-key{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;margin:8px 0 0;padding:0}
.lgd .lgd-key li{display:flex;align-items:center;margin:0;color:#e7efed;font-size:16px}
.lgd-label{margin:0 0 6px;font:600 16px/1.4 system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--lgd-muted)}
.lgd-answer-text{margin:0;font:400 22px/1.45 'Fraunces',Georgia,serif;color:#f5f6ef}
.lgd-note{padding:10px 14px;border-left:3px solid #68818c;background:#162430}
.lgd .lgd-gauges ul{list-style:none;display:grid;grid-template-columns:1fr;gap:4px 32px;margin:0;padding:0}
.lgd .lgd-gauge{margin:0;padding:6px 0 2px}
.lgd-gauge h5{display:flex;align-items:center;margin:2px 0 4px}
.lgd-strip{margin:0 0 6px}
.lgd-strip-text{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:0 0 4px}
.lgd-strip-text strong{font:700 19px/1.2 'Plus Jakarta Sans',system-ui,sans-serif;color:#f5f6ef}
.lgd-strip-text span:nth-of-type(2){color:var(--lgd-muted);font-size:16px}
.lgd-strip-text small{margin-left:auto;color:var(--lgd-muted);font-size:16px}
.lgd-scale{position:relative;height:22px}
.lgd-bands{position:absolute;left:0;right:0;top:5px;display:flex;gap:2px;height:12px}
.lgd-band{display:block;height:100%;background:var(--lgd-band)}
.lgd-band:nth-child(even){background:var(--lgd-band-2)}
.lgd-band:first-child{border-radius:6px 0 0 6px}.lgd-band:last-child{border-radius:0 6px 6px 0}
.lgd .lgd-band-mine{background:var(--lgd-mine)}
.lgd-marker{position:absolute;top:0;width:4px;height:22px;margin-left:-2px;border-radius:2px;background:var(--lgd-ivory);box-shadow:0 0 0 2px #111d29}
.lgd-ends{display:flex;justify-content:space-between;gap:12px;margin:0;font-size:16px;color:var(--lgd-muted)}
.lgd-caption{margin:12px 0 0;font-size:16px;color:var(--lgd-muted)}
.lgd .lgd-explanations li{margin:10px 0}
.lgd-tag{display:inline-block;padding:1px 10px;border:1px solid #49616b;border-radius:999px;font-size:16px;line-height:1.6;color:#e7efed;white-space:nowrap}
.lgd .lgd-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px;padding:0}
.lgd .lgd-tags li{margin:0}
.lgd-cards .lgd-card{padding:18px 0}
.lgd-card-test{display:flex;align-items:center;margin:0 0 6px}
.lgd-card-test small{display:block;color:var(--lgd-muted);font-size:16px}
.lgd-anchor{color:#f5f6ef;font-weight:500}
.lgd-question{margin:12px 0;padding:2px 0 2px 14px;border-left:2px solid #5ec4c9;font:400 18px/1.5 'Fraunces',Georgia,serif;color:#f5f6ef}
.lgd-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.lgd-drawer{margin-top:4px}
.lgd .lgd-drawer>summary{display:flex;align-items:center;min-height:44px;box-sizing:border-box;font-weight:600}
.lgd-study{margin:8px 0 16px;padding-left:14px;border-left:2px solid #49616b}
.lgd-study p{margin:6px 0}
.lgd-cite{font-size:16px;color:var(--lgd-muted)}
.lgd .lgd-cite a{display:inline-block;padding:10px 0;color:#77c58b}
.lgd .lgd-values{list-style:none;padding:0;margin:4px 0 0}
.lgd .lgd-values li{margin:6px 0;font-size:16px}
.lgd-values strong{color:#f5f6ef}.lgd-values span:last-of-type{color:var(--lgd-muted)}
.lgd-values small{display:block;color:var(--lgd-muted);font-size:16px}
.lgd-plan{font:400 20px/1.5 'Fraunces',Georgia,serif;color:#f5f6ef}
.lgd-cites{padding-left:20px}
.lgd-limit{color:#e7efed}
.lgd-caveat{padding-left:14px;border-left:2px solid #49616b;color:#e7efed}
/* Inside the app the workspace sets reading headings to plain text; the deep
   reading keeps its section and card headlines in the serif. */
#app .lgd section>h4,#app .lgd .lgd-card>h4{font:400 21px/1.3 var(--lgw-serif,'Fraunces',Georgia,serif);margin:0 0 8px}
#app .lgd .lgd-card>h4{font-size:22px}
@media(min-width:760px){
  .lgd-top{grid-template-columns:260px minmax(0,1fr)}
  .lgd-chord-svg{width:260px;height:260px}
  .lgd .lgd-gauges ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lgd .lgd-key{grid-template-columns:1fr}
}
@media(min-width:1000px){
  .lgd-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;border-top:1px solid var(--lgd-line)}
  .lgd-cards .lgd-card{border-top:0}
  .lgd-cards .lgd-card:nth-child(n+3){border-top:1px solid var(--lgd-line)}
  .lgd-pattern{columns:2;column-gap:32px}
  .lgd-pattern>h4{column-span:all}
  .lgd-pattern h5{break-after:avoid}
  .lgd-pattern ul,.lgd-pattern p{break-inside:avoid}
}
@media(max-width:600px){.lgd h4{font-size:22px}.lgd-answer-text{font-size:20px}.lgd-question{font-size:18px}.lgd-plan{font-size:18px}}
@media(forced-colors:active){.lgd-badge,.lgd-band,.lgd-marker{forced-color-adjust:none;border:1px solid CanvasText}.lgd-band-mine{background:Highlight}}
/* P7 part 14: the locked preview for a free account the deep reading admits
   (lifegraph-deep-view.v1.js preview). A labelled skeleton: each part named,
   drawn bars in place of text, never blurred words. The card itself is the
   locked card's (lifegraph-membership.v1.css). */
.lgd-preview{--lgd-muted:#b7cbd1;--lgd-line:#314550;--lgd-band:#2c3b47}
.lgd-preview .lgd-preview-parts{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:8px}
.lgd-preview .lgd-preview-parts>li{margin:0;display:grid;gap:8px;padding:10px 12px;border:1px solid var(--lgd-line);border-radius:12px;min-width:0}
.lgd-preview .lgd-label{margin:0;font-size:16px}
.lgd-preview .lgd-preview-cards{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.lgd-preview .lgd-preview-cards>li{margin:0;display:grid;gap:4px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);min-width:0}
.lgd-preview-name{font-weight:600;color:var(--text,#e8ecf2)}
.lgd-preview-cards small{color:var(--lgd-muted);font-size:16px}
.lgd-bars{display:grid;gap:6px}
.lgd-bar{display:block;height:8px;border-radius:4px;background:var(--lgd-band)}
.lgd-bar+.lgd-bar{width:62%}
@media(min-width:600px){.lgd-preview .lgd-preview-cards{grid-template-columns:1fr 1fr}}
@media(forced-colors:active){.lgd-bar{forced-color-adjust:none;background:GrayText}}
