/* Canvas floater frames. Approved paintings and their animation viewport stay intact. */
#main [data-practice-art]{container-type:inline-size;overflow:visible;aspect-ratio:auto;background:transparent;box-shadow:none;
 --frame-face:#80664d;--frame-top:#a58c6f;--frame-left:#93785c;--frame-right:#594430;--frame-bottom:#4b392a;--frame-depth:#3b3026;--gallery-light:#fff1d73b}
/* Frame finishes belong to the painting and wall palette. Practices 3 and 8 retain gold. */
#main [data-practice-art=E01]{--frame-face:#535e4e;--frame-top:#929b86;--frame-left:#737f68;--frame-right:#3e4937;--frame-bottom:#30392c;--frame-depth:#2c3428;--gallery-light:#ffffed59}
#main [data-practice-art=E02]{--frame-face:#a9b5a9;--frame-top:#d7dccb;--frame-left:#c0cbb9;--frame-right:#78877c;--frame-bottom:#5d6c62;--frame-depth:#46544c;--gallery-light:#eaf8e52e}
#main [data-practice-art=E03]{--frame-face:#534435;--frame-top:#8e7c63;--frame-left:#74604a;--frame-right:#3c3025;--frame-bottom:#2e261f;--frame-depth:#29231b;--gallery-light:#fff3d759}
#main [data-practice-art=E04]{--frame-face:#626e60;--frame-top:#a4ad98;--frame-left:#82907a;--frame-right:#475343;--frame-bottom:#384532;--frame-depth:#303a2c;--gallery-light:#f6ffe94d}
#main [data-practice-art=E05]{--frame-face:#435648;--frame-top:#88967b;--frame-left:#657c61;--frame-right:#354535;--frame-bottom:#29382a;--frame-depth:#253124;--gallery-light:#fff0dc59}
#main [data-practice-art=E06]{--frame-face:#526b70;--frame-top:#9aafb0;--frame-left:#7d9597;--frame-right:#3c545b;--frame-bottom:#2f434a;--frame-depth:#293d42;--gallery-light:#efffff5c}
#main [data-practice-art=E08]{--frame-face:#454d49;--frame-top:#8e9991;--frame-left:#69756c;--frame-right:#343d37;--frame-bottom:#29322c;--frame-depth:#242c27;--gallery-light:#ffffff69}
#main [data-practice-art=E09]{--frame-face:#a1b1b1;--frame-top:#dce5df;--frame-left:#c0ceca;--frame-right:#7a9192;--frame-bottom:#5e7779;--frame-depth:#455e60;--gallery-light:#e7fffb2e}
#main [data-practice-art=E10]{--frame-face:#c9c6b3;--frame-top:#f1ecdb;--frame-left:#ddd7c3;--frame-right:#a69c88;--frame-bottom:#8a7d6b;--frame-depth:#655747;--gallery-light:#fff1d738}
#main [data-practice-art=E11]{--frame-face:#bfc7b9;--frame-top:#e7eada;--frame-left:#d5ddcb;--frame-right:#919f8e;--frame-bottom:#71806f;--frame-depth:#505f50;--gallery-light:#f0f9e52e}
#main .start-practice-card [data-practice-art]{aspect-ratio:auto;box-shadow:none}
#main [data-practice-art] .canvas-floater{
 --rim:clamp(2px,1.25cqi,7px);--recess:clamp(1.5px,.85cqi,5px);
 position:relative;display:block;box-sizing:border-box;width:100%;min-width:0;
 padding:var(--recess);border:var(--rim) solid var(--frame-face);
 border-top-color:var(--frame-top);border-left-color:var(--frame-left);border-right-color:var(--frame-right);border-bottom-color:var(--frame-bottom);
 border-radius:1px;background:#242019;
 box-shadow:inset 0 1px 3px #000b,0 0 0 1px #211c1640,1px 2px 0 var(--frame-depth),
  0 7px 9px -6px #17130fb3,2px 16px 22px -13px #17130f70;
}
/* A fixed pool of gallery light on the wall, entirely outside the painted canvas. */
#main [data-practice-art] .canvas-floater::before{
 content:"";position:absolute;pointer-events:none;
 left:-7%;right:-7%;height:clamp(10px,3.8cqi,24px);bottom:calc(100% + var(--rim));
 background:radial-gradient(ellipse at 50% 100%,var(--gallery-light),transparent 72%);
}
#main [data-practice-art] .canvas-face{
 position:relative;display:block;width:100%;min-width:0;aspect-ratio:3/2;isolation:isolate;
 background:#b7a88c;box-shadow:1px 2px 1px #807059,2px 4px 4px #000a,0 0 0 1px #dacbb066;
}
/* Only the thin edge is lit; no sheen, tint or texture is placed over the painting. */
#main [data-practice-art] .canvas-face::after{
 content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
 box-shadow:inset 1px 1px 0 #fff3,inset -1px -2px 0 #30261938;
}
#main [data-practice-art] .canvas-face :is(img,.painting-stage){
 display:block;box-sizing:border-box;width:100%;max-width:none;min-width:0;height:auto;
 margin:0;padding:0;border:0;border-radius:0;box-shadow:none;aspect-ratio:3/2;
}
/* More-specific older hero rules must not offset the layered canvas inside its frame. */
#main[data-practice-world] :is(.chapter-heading,.guided-heading)>[data-practice-art] .canvas-face :is(img,.painting-stage){max-width:none;padding:0;margin:0;box-shadow:none}
#main[data-practice-world] :is(.chapter-heading,.guided-heading)>[data-practice-art]>.canvas-floater{flex:0 1 100%;min-width:0}
#main[data-practice-world] .guided-heading>[data-practice-art]>.canvas-floater{max-width:440px}
/* Tiny identity thumbnails keep a fine rim, rather than a heavy miniature frame. */
#main .chapter-art--thumb .canvas-floater{--rim:2px;--recess:1.5px;box-shadow:0 1px 0 var(--frame-depth),0 3px 5px -2px #17130f70}
#main .chapter-art--thumb .canvas-floater::before{display:none}
/* Give the complete frame breathing room beside the grounded layout's title card. */
@media(min-width:701px){#main[data-practice-composition=grounded] :is(.chapter-heading,.guided-heading):not(.program-page .guided-heading,.practice-recording .guided-heading,.practice-saved .guided-heading)>div:first-child{margin-left:1.25rem}}
@media(forced-colors:active){#main [data-practice-art] .canvas-floater{border-color:CanvasText;background:Canvas;box-shadow:none}#main [data-practice-art] .canvas-face::after,#main [data-practice-art] .canvas-floater::before{display:none}}
@media print{#main [data-practice-art] .canvas-floater{box-shadow:none}#main [data-practice-art] .canvas-floater::before{display:none}}

/* Gallery wall labels: a small board at viewing distance and a close-up on request. */
#main .art-placard{position:relative;z-index:4;width:clamp(44px,15%,78px);min-width:44px;margin:.4rem 0 0 auto;text-align:left;container-type:inline-size}
#main .start-practice-card>.art-placard{margin:.1rem 1.3rem 0 auto}
/* The hit target stays at least 44px high; only the smaller white board is visible. */
#main .art-placard .art-placard-label,#main[data-practice-world] .art-placard .art-placard-label{position:relative;display:block;width:100%;min-width:44px;min-height:44px;height:auto;aspect-ratio:5/3;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#252723;box-shadow:none;text-align:left;transform:none;cursor:zoom-in}
#main .art-placard .art-placard-label:is(:hover,:active),#main[data-practice-world] .art-placard .art-placard-label:is(:hover,:active){background:transparent;color:#252723;box-shadow:none;transform:none;border:0}
#main .art-placard .art-placard-label::before,#main .art-placard .art-placard-label::after{display:none}
#main .art-placard-label:focus-visible{outline:2px solid var(--interior-ink,var(--world-ink,#30392c));outline-offset:4px}
#main .art-placard-mini{position:absolute;top:50%;left:0;width:100%;aspect-ratio:5/3;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;padding:12%;overflow:hidden;background:#fafaf7;color:#252723;box-shadow:1px 1px 0 #d7d7d0,1px 2px 2px #1114;font:clamp(1.6px,3.1cqi,2.5px)/1.45 Arial,sans-serif;pointer-events:none;user-select:none}
#main .art-placard-mini .art-placard-title{font-weight:700;font-size:1.12em;line-height:1.2}
#main .art-placard-mini .art-placard-year{margin-top:.2em;font-size:.9em}
#main .art-placard-mini .art-placard-description{display:block;margin-top:1em;font-size:1em;line-height:1.4}
#main .art-placard-mini .art-placard-artist{margin-top:auto;align-self:flex-end;font:400 1em/1.3 Arial,sans-serif}
#main .art-placard-details{position:absolute;right:0;bottom:calc(100% + .7rem);display:flex;flex-direction:column;align-items:flex-start;box-sizing:border-box;width:320px;max-width:calc(100vw - 4rem);min-height:192px;padding:24px 26px;border:0;border-radius:0;background:#fafaf7;color:#252723;box-shadow:2px 2px 0 #d7d7d0,3px 6px 13px #1113;text-align:left;font:13px/1.55 Arial,sans-serif}
#main .art-placard-details[hidden]{display:none}
#main .art-placard-details::after{content:"";position:absolute;top:100%;left:0;right:0;height:.75rem}
#main .art-placard-details .art-placard-title{font:600 15px/1.3 Arial,sans-serif;letter-spacing:.01em;color:#252723}
#main .art-placard-details .art-placard-year{font:12px/1.5 Arial,sans-serif;margin-top:3px;color:#50534b}
#main .art-placard-details .art-placard-description{display:block;margin:17px 0 18px;font:13px/1.55 Arial,sans-serif;color:#252723}
#main .art-placard-details .art-placard-artist{margin-top:auto;align-self:flex-end;font:400 13px/1.5 Arial,sans-serif;color:#252723}
#main .start-practice-card:has(.art-placard-label[aria-expanded=true]),#main :is(.chapter-heading,.guided-heading):has(.art-placard-label[aria-expanded=true]){overflow:visible;z-index:6}
#main[data-practice-world] :is(.chapter-heading,.guided-heading)>[data-practice-art]:has(.art-placard){flex-direction:column;align-items:stretch}
#main[data-practice-world] :is(.chapter-heading,.guided-heading)>[data-practice-art]>.canvas-floater{flex:0 0 auto}
#main[data-practice-world] .guided-heading>[data-practice-art]>.canvas-floater{align-self:center}
#main :is(.program-page,.practice-recording,.practice-saved) .guided-heading>[data-practice-art]>.art-placard{display:none}
@media(max-width:700px){#main .start-practice-card>.art-placard{margin-right:1rem}#main .art-placard-details{width:286px;padding:21px 23px}}
@media(forced-colors:active){#main .art-placard-mini,#main .art-placard-details{color:CanvasText;background:Canvas;border:1px solid CanvasText}#main .art-placard-details span{color:CanvasText}}
@media print{#main .art-placard{display:none}}