:root{--paper:#f2efe5}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--paper)}.canvas{position:relative;width:100%;height:100svh;overflow:hidden;background-image:radial-gradient(#8f99854d .65px,transparent .65px);background-size:25px 25px}.canvas:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.2;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' fill='%23777777' opacity='.4' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}#composition{position:absolute;inset:0 0 auto;width:100%;height:calc(100% - 160px);display:block}
.poem{position:absolute;bottom:47px;left:16px;right:16px;width:max-content;max-width:calc(100% - 32px);margin:auto;text-align:center;color:#626c5e;font:italic 14px/1.7 Georgia,serif;letter-spacing:.015em;text-decoration:none;z-index:2;transition:color .25s ease}.poem span{display:block}.poem:hover{color:#344b3a}.poem:hover span:last-child{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.poem:focus-visible{outline:1px solid #657b60;outline-offset:8px}@media(max-height:500px){#composition{height:calc(100% - 124px)}.poem{bottom:20px;font-size:12px;line-height:1.6}}@media(prefers-reduced-motion:reduce){.poem{transition:none}}



.poem .email-address{margin-top:9px;font:normal 11px/18px Arial,sans-serif;letter-spacing:.025em;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;color:#44583e}@media(max-height:500px){.poem .email-address{margin-top:6px}}

#composition{cursor:pointer}#composition:focus,#composition:focus-visible{outline:none}#composition{-webkit-tap-highlight-color:transparent}


@media(max-width:600px) and (min-height:501px){#composition{height:calc(100% - 200px)}.poem{bottom:28px;font-size:13px;line-height:1.7}}

.canvas{--art-height:calc(100svh - 75px)}#composition{height:var(--art-height)}.poem{top:calc(var(--art-height)*.5 + min(var(--art-height),95.5224vw)*.414 + 12px);bottom:auto}.poem .email-address{margin-top:0}
.print-button{position:absolute;right:calc(50% - min(var(--art-height),95.5224vw)*.4 - 43px);top:calc(var(--art-height)*.5 + min(var(--art-height),95.5224vw)*.35625 + 12px);bottom:auto;z-index:4;width:38px;height:38px;display:grid;place-items:center;border:1px solid #65745c30;border-radius:50%;color:#526149;background:#e5e7db80;cursor:pointer;transition:background-color .5s cubic-bezier(.4,0,.2,1),color .5s cubic-bezier(.4,0,.2,1),border-color .5s cubic-bezier(.4,0,.2,1)}.print-button:hover{background:#000;color:#f2efe5;border-color:#000}.print-button:focus-visible{outline:1px solid #657b60;outline-offset:3px}.print-sheet{display:none}@page{size:A4 portrait;margin:15mm}@media print{html,body{width:auto;height:auto;overflow:visible;background:white!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}.canvas{display:none!important}.print-sheet{display:flex!important;box-sizing:border-box;width:180mm;height:266mm;flex-direction:column;justify-content:center;align-items:center;gap:7mm;break-inside:avoid;page-break-inside:avoid;background:#f2efe5!important}.print-sheet>svg{display:block;width:174mm;height:auto;aspect-ratio:670/640;flex:none;overflow:visible}.print-sheet>p{margin:0;color:#44583e;font:10pt Arial,sans-serif;letter-spacing:.025em}}

.print-button>svg{width:19px;height:19px;stroke-width:1.6}

@media(prefers-reduced-motion:reduce){.print-button{transition:none}}
