@layer components.memorial.message{.memorial-message{display:flex;flex-flow:column;background-color:#000a;border-radius:.5em;padding:.5em;.signature{text-align:right;font-size:.75em;img{display:inline-block;width:1.5em;height:1.5em;border-radius:50%;vertical-align:middle}}blockquote{display:grid;grid-template:"lq text ." auto ". text ." auto ". text rq" auto / auto auto auto;justify-content:start;margin:1em 2em .5em;&:before,&:after{font-size:2em;line-height:0;position:relative}>p{grid-area:text;margin:0}&:before{grid-area:lq;content:"“";top:.2em}&:after{grid-area:rq;content:"”";top:.25em}}}}@layer components.memorial.wall{.memorial-wall{overflow:hidden scroll;mask-image:linear-gradient(#000 90%,transparent);>ul{display:flex;flex-flow:column;padding:0 0 5em;margin:0;list-style:none;gap:.5em;>li{overflow:clip;min-height:0;opacity:1;transition:opacity 1s,height 1s,grid-template-rows 1s;@supports (interpolate-size: allow-keywords){interpolate-size:allow-keywords;height:auto}@supports (not (interpolate-size: allow-keywords)){display:grid;grid-template-rows:1fr;>div{min-height:0}}@starting-style{opacity:0;@supports (interpolate-size: allow-keywords){height:0}@supports (not (interpolate-size: allow-keywords)){grid-template-rows:0fr}}width:fit-content;align-self:flex-start;&:nth-last-child(2n){align-self:flex-end}}}}}@layer components.memorial.composer{@keyframes compose-instructions-fade-in{0%{opacity:0}to{opacity:1}}@keyframes compose-instructions-fade-out{0%{opacity:1}to{opacity:0}}.composer{@media(width<=30rem){font-size:.9em}display:grid;grid-template:"." 1fr / 1fr;place-content:center;place-items:center;.auth{position:unset;button{font-size:.5em}}.instructions,.picker{grid-area:1/1;border-radius:1em;padding:1em}.instructions{font-size:1.5em;margin:auto;opacity:0;animation:compose-instructions-fade-out .25s 1 normal forwards;pointer-events:none;background-color:#fff2;color:#fff;text-align:center;&.visible{animation:compose-instructions-fade-in 2s 1 normal forwards;pointer-events:all}}.send{position:relative;display:flex;place-content:center;anchor-name:--send;button{font-size:inherit}.bubble{position-anchor:--send;@supports not (position-area: right){transform:translateY(calc(-100% - 1em))}}}.picker{opacity:0;pointer-events:none;min-height:0;overflow:clip;transition:opacity 1s,height 1s,grid-template-rows 1s;@supports (interpolate-size: allow-keywords){interpolate-size:allow-keywords;height:0}@supports (not (interpolate-size: allow-keywords)){display:grid;grid-template-rows:0fr;>div{min-height:0}}@starting-style{opacity:0;@supports (interpolate-size: allow-keywords){height:0}@supports (not (interpolate-size: allow-keywords)){grid-template-rows:0fr}}&.visible{opacity:1;@supports (interpolate-size: allow-keywords){height:auto}@supports (not (interpolate-size: allow-keywords)){grid-template-rows:1fr}pointer-events:all;background-color:#000d}}.controls{display:grid;grid-template:"left buttons right" auto "backspace backspace backspace " 2em / 2em 1fr 2em;gap:.25em;button{font-size:.6em}.backspace{grid-area:backspace;justify-self:end;width:4em;height:100%}}.words{list-style:none;padding:0;margin:0;font-size:1.25em;display:grid;grid-template-columns:repeat(auto-fit,minmax(4em,1fr));grid-auto-rows:2em;gap:.25em;min-width:min(90vw,10em);max-width:min(90vw,30em);button{width:100%;height:100%}}kbd{background-color:#eee;border-radius:.3em;border:.1em solid #b4b4b4;box-shadow:0 .1em .1em #0003,0 .2em #ffffffb3 inset;color:#333;display:inline-block;font-size:1.25em;font-weight:700;line-height:1;padding:.2em .4em;white-space:nowrap}}}@layer page{.in-memoriam{font-size:1.5em;.florence{position:fixed;inset:0;z-index:-1;display:flex;flex-direction:column;place-items:center;place-content:center;p{margin:0}.name{font-size:1.5em}}.bee{position:fixed;bottom:-1em;right:-1em;z-index:-2;width:min(50vw,5em);height:min(50vh,5em);display:grid;place-items:center;place-content:center;>*{grid-area:1/1;width:100%;height:100%}p{margin:0;font-size:.5em}}.continue{position:fixed;left:.25em;top:.25em;z-index:1;border-image-source:url(https://static.jadseya.com/assets/button-short.Cob8YPH7.png);border-image-slice:25% 30% 25% 15% fill;border-image-width:1.25em 3em 1.25em 1.25em;color:var(--secondary);font-family:Deneane,serif;text-decoration:none;border-radius:.25em;padding:1.25em 1.5em 1.25em 1em;&:hover{border-image-source:url(https://static.jadseya.com/assets/button-short-hover.B-2dEiO5.png)}}.overlay{position:fixed;inset:4em 1em 1em;z-index:1;display:grid;grid-template:"wall" 1fr "composer" auto / 1fr;gap:1em}}}