/* The same approved paintings, on the scrolling paper itself. No fixed
   canvas, blend mode, live blur, or animated text/paper surface. */
.handheldGarden{display:none;}
@media(max-width:999px),(max-height:600px),(pointer:coarse){
 #study .stFoot .ornamentSetting{display:inline-flex;}
 .handheldGarden{display:block;position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden;contain:layout paint;--hh-corner:58px;--hh-frame:url('living-frame-gold.png');--hh-top-size:101.052632% 565.745856%;--hh-top-y:10.913405%;--hh-bottom-size:101.052632% 575.280899%;--hh-bottom-y:38.770686%;}
 .handheldGarden[data-family=moon]{--hh-frame:url('living-frame-moon.png');--hh-top-size:101.052632% 644.025157%;--hh-top-y:68.208092%;--hh-bottom-size:101.052632% 628.220859%;--hh-bottom-y:93.379791%;}
 /* Only one border system on handhelds, from the very first paint. This
    also covers the static turn-face templates before JavaScript runs. */
 #readView .pframe{visibility:hidden;}
 .hhFrame{position:absolute;inset:7px;box-sizing:border-box;border:var(--hh-corner) solid transparent;border-image-source:var(--hh-frame);border-image-slice:30%;border-image-width:var(--hh-corner);border-image-repeat:round;clip-path:polygon(0 0,100% 0,100% 100%,calc(50% + 33px) 100%,calc(50% + 33px) calc(100% - 26px),calc(50% - 33px) calc(100% - 26px),calc(50% - 33px) 100%,0 100%);}
 .hhBand{position:absolute;left:40px;right:40px;height:27px;top:9px;background:url('horizontal-garlands.png') no-repeat 50% var(--hh-top-y)/var(--hh-top-size);}
 .hhBand.bottom{top:auto;bottom:9px;background-position:50% var(--hh-bottom-y);background-size:var(--hh-bottom-size);mask-image:linear-gradient(90deg,#000 0 35%,transparent 44% 56%,#000 65%);-webkit-mask-image:linear-gradient(90deg,#000 0 35%,transparent 44% 56%,#000 65%);}
 .hhSprite,.hhSpark{position:absolute;display:block;pointer-events:none;}
 .hhSprite{background-repeat:no-repeat;transform-origin:54% 94%;}
 .hhLeaf{background-image:url('olive-leaf-atlas.png');background-size:200% 200%;}
 .hhPetal{background-image:url('botanical-parts.png');background-size:491.7647% 425.0847%;background-position:36.2362% 1.7727%;}
 .hhSpark{width:11px;height:11px;background:radial-gradient(circle,#fff6dc 0%,rgba(var(--garden-a,218,187,115),.75) 18%,transparent 65%);}
 .hhSpark::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 44%,rgba(var(--garden-a,218,187,115),.7) 50%,transparent 56%);}
 .hhLight{position:absolute;top:54px;bottom:54px;width:12px;left:10px;overflow:hidden;border-radius:50%;}
 .hhLight.right{left:auto;right:10px;}
 .hhLight>i{display:block;position:absolute;inset:-35% 0;width:100%;background:radial-gradient(ellipse,rgba(var(--garden-a,218,187,115),.38),transparent 65%) 0 0/100% 170px,radial-gradient(ellipse,rgba(var(--garden-b,125,162,148),.44),transparent 66%) 0 87px/100% 237px;}
 .handheldGarden[data-family=moon] .hhLeaf{filter:grayscale(.45) hue-rotate(125deg) saturate(.65);}
 #readView .pg.hasHandheldGarden .runhead{padding-top:40px;padding-left:38px;padding-right:38px;}
 #readView .pg.hasHandheldGarden .pgInner{padding-left:42px;padding-right:42px;}
 #readView .pg.hasHandheldGarden .runhead span{background:linear-gradient(125deg,rgba(var(--washA,38,32,18),.97),rgba(var(--washB,18,23,27),.96));border-color:rgba(var(--garden-a,218,187,115),.6);color:#fff0d1;}
}
/* The painting contains transparent padding outside its foliage. Compensate
   for that padding at the page edge: a 1px box inset still left a bare paper
   strip outside the flowers. Enlarge and extend only the frame, retaining
   its inner clearance; the garden clips it to the existing paper surface. */
@media(max-width:700px),(orientation:landscape) and (max-height:600px) and (pointer:coarse){
 .handheldGarden{--hh-corner:88px;}
 .hhFrame{inset:-11px;clip-path:polygon(0 0,100% 0,100% 100%,calc(50% + 33px) 100%,calc(50% + 33px) calc(100% - 32px),calc(50% - 33px) calc(100% - 32px),calc(50% - 33px) 100%,0 100%);}
 .hhBand{top:-3px;height:33px;}
 .hhBand.bottom{top:auto;bottom:3px;}
}
@media(max-width:360px){
 .handheldGarden{--hh-corner:76px;}
 .hhFrame{inset:-10px;}
 #readView .pg.hasHandheldGarden .pgInner{padding-left:36px;padding-right:36px;}
}
@media(prefers-reduced-motion:reduce){.handheldGarden .hhSpark,.handheldGarden .hhFall,.handheldGarden .hhLight{visibility:hidden;}}
html.lite .handheldGarden .hhSpark,html.lite .handheldGarden .hhFall,html.lite .handheldGarden .hhLight{visibility:hidden;}
