.ec-case-desk{container-type:inline-size;min-width:0}.ec-case-folder{--ec-folder-pad: var(--ec-space-3);--ec-folder-gap: var(--ec-space-5);position:relative;display:grid;gap:var(--ec-space-5);margin-top:1.5rem;padding:var(--ec-space-5) var(--ec-folder-pad) var(--ec-space-5);border:1px solid var(--ec-color-folder-edge);border-radius:0 var(--ec-radius-medium) var(--ec-radius-medium);background:var(--ec-color-folder);box-shadow:0 1px #ffffff59 inset,0 10px 24px #00000059;color:var(--ec-color-ink)}.ec-case-folder:before{position:absolute;bottom:100%;left:-1px;width:min(11rem,45%);height:1.5rem;border:1px solid var(--ec-color-folder-edge);border-bottom:0;border-radius:var(--ec-radius-medium) var(--ec-radius-medium) 0 0;background:var(--ec-color-folder);clip-path:polygon(0 0,88% 0,100% 100%,0 100%);content:""}.ec-case-folder>*{min-width:0}@media(min-width:36rem){.ec-case-desk{padding:var(--ec-space-5) var(--ec-space-4) var(--ec-space-4);border-radius:var(--ec-radius-small);background:repeating-linear-gradient(172deg,transparent 0 .9rem,rgba(0,0,0,.14) .9rem 1rem,transparent 1rem 2.3rem),linear-gradient(90deg,var(--ec-color-desk),var(--ec-color-desk-grain),var(--ec-color-desk));box-shadow:0 8px 24px #0000002e}.ec-case-folder{--ec-folder-pad: var(--ec-space-4)}}@container (min-width: 40rem){.ec-case-folder--open{--ec-folder-crease: calc( var(--ec-folder-pad) + (100% - 2 * var(--ec-folder-pad) - var(--ec-folder-gap)) * .4 + var(--ec-folder-gap) / 2 );grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:var(--ec-folder-gap);border-radius:var(--ec-radius-medium);background:linear-gradient(90deg,transparent calc(var(--ec-folder-crease) - .75rem),rgba(0,0,0,.16) var(--ec-folder-crease),rgba(255,255,255,.18) calc(var(--ec-folder-crease) + 1px),transparent calc(var(--ec-folder-crease) + .75rem)),linear-gradient(90deg,var(--ec-color-folder-back) var(--ec-folder-crease),var(--ec-color-folder) var(--ec-folder-crease))}.ec-case-folder--open:before{left:auto;right:calc(100% - var(--ec-folder-crease) + 1rem);background:var(--ec-color-folder-back)}}.ec-case-sheet{position:relative;padding:var(--ec-space-5) var(--ec-space-3) var(--ec-space-4);border:1px solid rgba(140,118,88,.35);border-radius:2px;background:var(--ec-color-sheet);box-shadow:0 1px 1px #0000001f,0 6px 14px #00000038;color:var(--ec-color-ink)}.ec-case-sheet :is(h2,h3,h4){font-family:var(--ec-font-family-heading)}.ec-case-sheet--clip:before{position:absolute;top:-.85rem;right:1.75rem;width:.95rem;height:2.75rem;border:.18rem solid var(--ec-color-paperclip);border-radius:.6rem;content:"";box-shadow:1px 2px 2px #00000038;transform:rotate(6deg)}.ec-case-sheet--clip:after{position:absolute;top:-.55rem;right:2rem;width:.45rem;height:1.9rem;border:.18rem solid var(--ec-color-paperclip);border-bottom:0;border-radius:.3rem .3rem 0 0;content:"";transform:rotate(6deg)}@media(min-width:36rem){.ec-case-sheet{padding-inline:var(--ec-space-4)}}.ec-case-photo{position:relative;margin:0;box-shadow:0 1px 1px #00000026,0 8px 18px #00000047}.ec-case-photo>img,.ec-case-photo>iframe{display:block;width:100%;height:auto}.ec-case-photo--polaroid{padding:.6rem .6rem 2rem;border:1px solid var(--ec-color-photo-border);background:var(--ec-color-surface);transform:rotate(-1.25deg)}.ec-case-photo--polaroid:before{position:absolute;z-index:1;top:-.45rem;left:50%;width:1rem;height:1rem;border:1px solid rgba(0,0,0,.3);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 6%,var(--ec-color-pin-red) 38% 100%);box-shadow:0 2px 4px #00000061;content:"";transform:translate(-50%)}.ec-case-photo--screen{padding:.5rem;border-radius:var(--ec-radius-small);background:#1b1b1b}.ec-case-tape{position:relative}.ec-case-photo--screen:before,.ec-case-photo--screen:after,.ec-case-tape:before,.ec-case-tape:after{position:absolute;top:-.2rem;width:1.35rem;height:.35rem;border:.12rem solid var(--ec-color-paperclip);border-bottom:0;border-radius:1px;background:#c4c9cc;content:""}.ec-case-photo--screen:before,.ec-case-tape:before{left:1.25rem;transform:rotate(-8deg)}.ec-case-photo--screen:after,.ec-case-tape:after{right:1.25rem;transform:rotate(7deg)}.ec-case-tape:before,.ec-case-tape:after{z-index:1;top:-.3rem;width:1.85rem;height:.5rem}@media(hover:hover)and (pointer:fine){.ec-case-photo--polaroid{transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s cubic-bezier(.16,1,.3,1)}.ec-case-photo--polaroid:hover{box-shadow:0 1px 1px #00000026,0 14px 26px #00000052;transform:rotate(0) translateY(-3px)}}.ec-case-notebook{--ec-notebook-line: 1.6rem;--ec-notebook-margin: 3.5rem;position:relative;padding:var(--ec-space-5) var(--ec-space-3) var(--ec-space-4) var(--ec-notebook-margin);border:1px solid rgba(81,91,98,.25);border-radius:2px 2px var(--ec-radius-small) var(--ec-radius-small);background:linear-gradient(90deg,transparent calc(var(--ec-notebook-margin) - .75rem),var(--ec-color-notebook-margin) calc(var(--ec-notebook-margin) - .75rem) calc(var(--ec-notebook-margin) - .75rem + 1px),transparent calc(var(--ec-notebook-margin) - .75rem + 1px)) 0 0/100% 100% no-repeat,var(--ec-color-notebook);box-shadow:0 1px 1px #0000001f,0 6px 14px #00000038;color:var(--ec-color-ink)}.ec-case-notebook:before{position:absolute;top:-.7rem;right:var(--ec-space-3);left:var(--ec-space-3);height:1.6rem;background:radial-gradient(ellipse .32rem .72rem at 50% 50%,transparent 52%,var(--ec-color-paperclip) 56% 78%,transparent 82%) 0 0/1.5rem 100% repeat-x;content:""}.ec-case-notebook:after{position:absolute;top:.45rem;right:var(--ec-space-3);left:var(--ec-space-3);height:.5rem;background:radial-gradient(circle at 50% 50%,var(--ec-color-desk) 0 .2rem,transparent .23rem) 0 0/1.5rem 100% repeat-x;content:""}.ec-case-notebook :is(h2,h3,h4){font-family:var(--ec-font-family-heading)}.ec-case-notebook__lines{background:linear-gradient(to bottom,transparent calc(var(--ec-notebook-line) - 1px),var(--ec-color-notebook-rule) calc(var(--ec-notebook-line) - 1px)) 0 0/100% var(--ec-notebook-line);line-height:var(--ec-notebook-line)}.ec-case-stamps{display:flex;flex-wrap:wrap;gap:var(--ec-space-2) var(--ec-space-3);margin:0;padding:0;list-style:none}.ec-case-stamp{display:inline-flex;min-height:1.75rem;align-items:center;padding:.1rem .5rem;border:3px double currentColor;border-radius:2px;color:var(--ec-color-link);font-family:var(--ec-font-family-heading);font-size:var(--ec-font-size-small);font-weight:700;letter-spacing:.04em;text-decoration:none;text-transform:uppercase;transform:rotate(-2deg)}.ec-case-stamps>li:nth-child(3n+2) .ec-case-stamp{transform:rotate(1.5deg)}.ec-case-stamps>li:nth-child(3n) .ec-case-stamp{transform:rotate(-.75deg)}.ec-case-stamp--dashed{border-style:dashed;border-width:2px}a.ec-case-stamp:hover{color:var(--ec-color-link-hover);text-decoration:underline;text-underline-offset:.2em}@media(prefers-reduced-motion:reduce){.ec-case-photo--polaroid{transition:none}.ec-case-photo--polaroid:hover{transform:rotate(-1.25deg)}}
