/* Shared presentation contracts: reading, surfaces, focus and saved work.
   Practice palette values remain in practice-worlds/continuity. */
:root{--experience-measure:68ch;--experience-gap:clamp(1.25rem,3vw,2.5rem);--experience-radius:8px;--experience-line:#c9c2b2;--experience-quiet:#f7f3eb;--experience-ink:#292f26}
#main :is(.program-page,.practice-recording,.practice-saved,.journal-entries,.plan-summary){text-wrap:pretty}
#main :is(.program-page,.practice-recording,.practice-saved) :is(h1,h2,h3){font-family:CutGallery,Archivo,sans-serif;font-weight:400;font-synthesis:none;text-wrap:balance}
#main :is(.program-page,.practice-recording,.practice-saved) h1{font-size:clamp(1.9rem,3.4vw,3.1rem);line-height:1.18}
#main :is(.program-page,.practice-recording,.practice-saved) h2{font-size:clamp(1.5rem,2.5vw,2rem);line-height:1.25}
#main :is(.program-page,.practice-recording,.practice-saved) h3{font-size:1.35rem;line-height:1.35}
#main :is(.program-page,.practice-recording,.practice-saved) p{max-width:var(--experience-measure);line-height:1.75}
#main :is(.program-page,.practice-recording,.practice-saved) .guided-heading{min-height:0;padding-block:1rem 2rem;margin-block:0 1.5rem}
#main :is(.practice-recording,.practice-saved) .guided-heading{display:grid;grid-template-columns:minmax(0,1fr) 144px;gap:1.5rem;text-align:left;align-items:center}
#main :is(.practice-recording,.practice-saved) .guided-heading>.chapter-art{width:144px;min-width:0;max-width:100%;margin:0;padding:0;box-shadow:none;border:0}
#main :is(.practice-recording,.practice-saved) .guided-heading>.chapter-art img{width:100%;height:auto;object-fit:contain;padding:0}
#main :is(.practice-recording,.practice-saved) .guided-heading::before,#main :is(.practice-recording,.practice-saved) .guided-heading::after{display:none}
#guided-save{max-width:780px;margin-inline:auto}#guided-save>.panel{padding:clamp(1.25rem,4vw,2.5rem)}
#guided-save :is(textarea,select,input:not([type=checkbox])){width:100%;box-sizing:border-box}#guided-save label{display:block;margin-top:1.5rem}#guided-save .check-line{display:flex;align-items:flex-start;gap:.6rem}
.save-summary{max-width:780px;margin:0 auto 2rem;padding:1.5rem;border-block:1px solid var(--interior-border,var(--experience-line))}
.save-summary blockquote{margin:1.2rem 0;padding-inline-start:1.2rem;border-inline-start:2px solid currentColor;white-space:pre-wrap;overflow-wrap:anywhere;font-size:1.12rem;line-height:1.8}
/* One surface/state foreground contract across all twelve worlds. */
#main[data-practice-world] .program-page{--program-line:var(--interior-border);--program-warm:var(--interior-plane)}
#main[data-practice-world] .program-page :is(.program-stage-strip li,.program-metrics strong,.program-metrics span,.program-source-question,dt,dd,legend,label,summary){color:var(--interior-ink)}
#main[data-practice-world] .program-page .program-stage-strip [aria-current=step]{background:var(--interior-primary);color:var(--interior-primary-ink);border-color:var(--interior-primary)}
#main[data-practice-world] .program-page :is(blockquote,.program-review-notes article){background:var(--interior-inset);color:var(--interior-ink);border-color:var(--interior-border)}
#main[data-practice-world] :is(.program-form,#guided-save) [role=alert]:not(:empty){color:var(--interior-ink);border:2px solid currentColor;border-inline-start-width:5px;padding:.8rem 1rem;background:var(--interior-inset)}
#main[data-practice-world] :is(button,input,select):disabled{opacity:1;color:var(--interior-muted);background:var(--interior-plane);border-style:dashed;cursor:not-allowed;box-shadow:none}
#main[data-practice-world] :is(button,a.button,summary,input,textarea,select):focus-visible{outline:3px solid var(--interior-ink);outline-offset:4px}
#main[data-practice-world] .program-page .program-next{border:1px solid var(--interior-border);border-inline-start:4px solid var(--interior-primary);padding:var(--experience-gap);margin-block:1.5rem 2rem}
.program-progress,.program-activity,.program-manage{border-block-start:1px solid var(--interior-edge,var(--experience-line));padding:.4rem 0}
.program-reviews>summary,.program-manage>summary,.program-progress>summary,.program-activity>summary{font-weight:600;line-height:1.6}
.program-page>.program-progress{margin-top:1rem}.program-stage-strip{margin:1rem 0}.program-page .program-columns{align-items:start}.program-page .program-columns>.panel{margin:0}
.program-page .program-metrics{margin-block:1rem}.program-page .program-session-brief{background:transparent!important;padding-inline:0}
/* Welcome: the tutorial stays first; saved work sits next to it. */
#main .start-welcome{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:clamp(1.5rem,3vw,3rem);align-items:start;margin-block:0 3rem;padding-bottom:2.5rem;border-bottom:1px solid var(--experience-line)}
#main .start-welcome .start-walkthrough{margin:0;padding:0;border:0;max-width:none}
#main .start-welcome .start-walkthrough-caption h2{font:400 clamp(1.5rem,2.3vw,2rem)/1.25 CutGallery,Archivo,sans-serif}
#main .start-welcome .start-walkthrough-caption p{font-size:.94rem;line-height:1.65;max-width:68ch}
#main .start-continue{border-left:1px solid var(--experience-line);padding-left:1.7rem}
#main .start-continue :is(.program-summary,.start-resume){margin:0 0 1.5rem;padding:1.3rem;background:#ebe9df;border:1px solid var(--experience-line);box-shadow:none}
#main .start-continue h2{font:400 1.45rem/1.3 CutGallery,Archivo,sans-serif}
#main .start-continue p{font-size:.94rem;line-height:1.65}
#main .start-continue .actions{gap:.55rem}#main .start-continue .actions>*{width:100%;font-size:.86rem;white-space:normal}
#main .start-walkthrough [hidden]{display:none!important}.walkthrough-visibility{font-size:.85rem;margin-top:1rem}
/* Gallery: whole artwork and one coordinated card, with one principal action. */
#main .start-practice-grid{gap:clamp(1.25rem,2.7vw,2.5rem)}
#main .start-practice-card{border-radius:4px 4px 10px 10px;box-shadow:0 12px 32px -27px #171b1660;border:1px solid color-mix(in srgb,var(--card-ink) 22%,var(--card-page));overflow:hidden;gap:0}
#main .start-practice-card .world-art-open{margin:0;padding:1.3rem 1.3rem .5rem;background:transparent;box-shadow:none;border:0;border-radius:0}
#main .start-practice-header{min-height:7.8rem;padding:1.15rem 1.5rem .5rem;border:0;background:transparent}
#main .start-practice-header h3{font-size:clamp(1.45rem,2vw,1.85rem);line-height:1.25;margin:.4rem 0}
#main .start-practice-focus{padding:.4rem 1.5rem .9rem;margin:0;min-height:4.5rem;font-size:.94rem;line-height:1.65}
#main .start-practice-about{margin:0 1.5rem 1rem;padding:0;border-top:1px solid var(--card-edge)}
#main .start-practice-about summary{border:0;border-radius:0;padding:.65rem 0;font-size:.85rem}
#main .start-practice-action{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;padding:0 1.5rem 1.5rem;margin:0;margin-top:auto}
#main .start-practice-action>.primary{grid-column:1/-1;min-height:48px;font-size:.95rem}
#main .start-practice-action>button:not(.primary){font-size:.78rem;line-height:1.45;min-height:48px;padding:.65rem .6rem;width:100%}
/* Programs shares the Start Here world card; only its destination differs. */
#main .program-library>article.program-practice-card{padding:0;background:var(--card-page);color:var(--card-ink);border:1px solid color-mix(in srgb,var(--card-ink) 22%,var(--card-page));border-radius:4px 4px 10px 10px;box-shadow:0 12px 32px -27px #171b1660}
#main .program-practice-card .chapter-art--choice{padding:0;margin:0;background:transparent;max-width:none;width:100%;min-width:0;aspect-ratio:3/2;border-radius:0}
#main .program-practice-card .chapter-art--choice img{aspect-ratio:3/2;object-fit:contain;border-radius:0}
#main .program-practice-card .start-practice-header h2{font:400 clamp(1.45rem,2vw,1.85rem)/1.25 CutGallery,Archivo,sans-serif;font-synthesis:none;color:inherit;letter-spacing:-.02em;text-wrap:balance;max-width:25ch;margin:.4rem 0}
#main .program-practice-card .start-practice-action{grid-template-columns:1fr}
@media(forced-colors:active){#main .program-library>article.program-practice-card{background:Canvas;color:CanvasText;border-color:CanvasText}}
/* Quiet, practice-specific details live at boundaries, never behind reading. */
body[data-practice-world]::before{opacity:.1}
#main[data-practice-world] .source-copy{background-image:none}
#main[data-practice-world=E01] .room-layout{max-width:1000px}#main[data-practice-world=E01] .practice-audio{border-block-style:double;border-block-width:3px}
#main[data-practice-world=E02] :is(.practice-audio,.program-next){border-radius:26px 4px 4px 4px}
#main[data-practice-world=THIRD-EYE] :is(.room-layout,.program-page,.practice-recording){background-image:none}
#main[data-practice-world=E03] :is(.program-next,.practice-audio){border-radius:3px;border-bottom-width:3px}
#main[data-practice-world=E04] .section-audio-option{border-left:1px solid var(--interior-border);padding-left:1rem}
#main[data-practice-world=E05] :is(.practice-audio,.program-next){border-radius:18px 18px 5px 5px}
#main[data-practice-world=E06] .room-layout{max-width:1000px}#main[data-practice-world=E06] .practice-audio{border-radius:30px 30px 6px 6px}
#main[data-practice-world=E07] .section-audio-option{border-left:2px solid var(--interior-border);padding-left:1rem}
body[data-practice-world=E08]::before{display:none}#main[data-practice-world=E08] :is(.practice-audio,.program-next){box-shadow:none;border-radius:2px}
#main[data-practice-world=E09] .program-next{border-radius:4px 22px 4px 4px}
#main[data-practice-world=E10] :is(.practice-audio,.program-next){border-radius:4px;border-top:2px solid var(--interior-border)}
#main[data-practice-world=E11] .closing-guidance{padding-block:1.8rem;border-block:1px solid var(--interior-edge)}
/* Saved information gets a reading surface, with controls consistently below. */
#main .record{padding:clamp(1.2rem,3vw,2.2rem);margin:1.5rem 0;border-radius:4px 12px 12px 4px;border:1px solid var(--experience-line);border-left:3px solid var(--world-accent,#68735e);background:#faf7f0;box-shadow:none;color:#292f26}
#main .record .record-heading{align-items:center;gap:1rem}#main .record .record-heading h3{font:400 clamp(1.3rem,2vw,1.65rem)/1.3 CutGallery,Archivo,sans-serif}
#main .record .observation-text{max-width:68ch;font-size:1.08rem;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;margin-block:1.5rem}
#main .record .record-next-time{border-block:1px solid #c9c2b2;padding-block:1rem;line-height:1.75;white-space:pre-wrap}
#main .record>.actions{border-top:1px solid #c9c2b2;padding-top:1.2rem;gap:.6rem}#main .record>.actions>*{font-size:.83rem}
#main .comparison-pair{align-items:start;gap:1.5rem}#main .plan-summary{padding:var(--experience-gap);border:1px solid var(--interior-border,var(--experience-line));border-radius:var(--experience-radius);box-shadow:none}
#main[data-practice-world] .record{background:var(--interior-plane);color:var(--interior-ink);border-color:var(--interior-border)}
#main[data-practice-world] .record :is(.record-next-time,.actions){border-color:var(--interior-border)}
#main :is(.scenic-heading,.entry-heading) h1{font-size:clamp(2rem,4vw,3.5rem)}
body>nav[aria-label=Companion]{grid-template-columns:repeat(7,minmax(0,1fr))}
@media(max-width:950px){#main .start-welcome{grid-template-columns:1fr}#main .start-continue{border-left:0;padding-left:0;display:grid;grid-template-columns:1fr 1fr;gap:1rem}#main .start-continue>.small{grid-column:1/-1}body>nav[aria-label=Companion]{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:600px){#main .start-continue{display:block}#main .start-practice-header{min-height:0}#main .start-practice-focus{min-height:0}#main :is(.practice-recording,.practice-saved) .guided-heading{grid-template-columns:minmax(0,1fr) 80px;gap:1rem}#main :is(.practice-recording,.practice-saved) .guided-heading>.chapter-art{width:80px}body>nav[aria-label=Companion]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(forced-colors:active){#main :is(.record,.program-next,.start-practice-card){border:1px solid CanvasText;box-shadow:none}#main .program-stage-strip [aria-current=step]{background:Highlight;color:HighlightText}}
@media print{.program-manage,.start-walkthrough,.record>.actions{display:none!important}#main :is(.record,.plan-summary,.save-summary){background:white!important;color:black!important;box-shadow:none;break-inside:avoid}.record-next-time{border-color:#777!important}}
/* Working screens use a compact identity header so the task remains in view. */
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading{display:grid;grid-template-columns:minmax(0,1fr) 160px;align-items:center;gap:1.5rem;min-height:0;padding:1.25rem 1.5rem;margin:1rem 0;background:transparent;border-bottom:1px solid var(--interior-edge);text-align:left}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>div:first-child{padding:0;max-width:none}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>[data-practice-art]{position:static;width:160px;min-width:0;max-width:100%;padding:0;margin:0;transform:none;box-shadow:none;border:0}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>[data-practice-art] img{padding:0;margin:0;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading::before,#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading::after{display:none}
body[data-practice-world=THIRD-EYE]{background-image:none}
@media(max-width:600px){#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading{grid-template-columns:minmax(0,1fr) 76px;padding:1rem 0;gap:1rem}#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>[data-practice-art]{width:76px}#main[data-practice-world] .program-page .guided-heading .eyebrow{padding:0;min-height:0}}
body[data-practice-world=THIRD-EYE]::before{background-image:var(--material-grain);opacity:.12}
#main[data-practice-world] .entry-heading h1{font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.2}
#main[data-practice-world] .entry-heading{padding:1.4rem;gap:1.5rem;border:0;border-bottom:1px solid var(--interior-edge);background:transparent}
#main[data-practice-world] .entry-heading>[data-practice-art]{z-index:1}
#main .journal-note{margin:1rem 0;border:1px solid var(--interior-border,var(--experience-line));border-radius:8px;background:var(--interior-plane,#faf7f0);padding:.5rem 1.2rem}
#main .journal-note .journal-note-date{color:var(--interior-muted,#41483d);font-size:.82rem;line-height:1.5}
#main .journal-note .journal-note-copy>strong{font:400 1.4rem/1.3 CutGallery,Archivo,sans-serif}
#main .journal-note .journal-note-excerpt{line-height:1.75;max-width:68ch}
#main .journal-note .journal-note-action{background:var(--interior-primary,#343d30);color:var(--interior-primary-ink,#fffaf2);border:1px solid currentColor}
#main .journal-note>.record{margin:.5rem 0 1rem;border-inline:0;border-radius:0;padding-inline:0}
body[data-practice-world]>footer a{background:transparent;color:var(--interior-ink);border:1px solid var(--interior-border)}
#main .plan-summary h3{font:400 clamp(1.45rem,2.5vw,2rem)/1.3 CutGallery,Archivo,sans-serif}
#main .plan-summary .plan-next-actions{margin:1.2rem 0 1.8rem}
/* Clear scenic composition placement on task headers, including reversed worlds. */
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>div:first-child{grid-column:1;grid-row:1;background:transparent;color:var(--interior-ink);width:auto;min-width:0}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>div:first-child :is(h1,.eyebrow){color:var(--interior-ink);background:transparent}
#main[data-practice-world] :is(.program-page,.practice-recording,.practice-saved) .guided-heading>[data-practice-art]{grid-column:2;grid-row:1}
