@layer components{.case-desk{isolation:isolate;background:var(--color-ink);min-height:100dvh;color:var(--color-cream);overscroll-behavior:none;position:relative}.case-backdrop-room{z-index:-1;pointer-events:none;position:fixed;inset:0}.case-backdrop-room:after{content:"";background:radial-gradient(40% 36% at 4% 96%, color-mix(in srgb, color-mix(in srgb, var(--color-highlight) 55%, var(--color-manila)) 16%, transparent), transparent 70%), color-mix(in srgb, var(--color-ink) 55%, transparent);position:absolute;inset:0}@media (min-width:1024px){.case-backdrop-room:after{background:radial-gradient(34% 32% at 4% 96%, color-mix(in srgb, color-mix(in srgb, var(--color-highlight) 55%, var(--color-manila)) 16%, transparent), transparent 70%), linear-gradient(90deg, color-mix(in srgb, var(--color-ink) 62%, transparent), color-mix(in srgb, var(--color-ink) 40%, transparent) 55%, color-mix(in srgb, var(--color-ink) 30%, transparent))}}.case-backdrop-desk{--desk-h:clamp(10rem, 28svh, 17rem);z-index:-1;display:none;position:fixed;inset:auto 0 0}@media (min-width:1024px){.case-backdrop-desk{display:block}}.case-safe{padding-left:max(1.25rem, env(safe-area-inset-left));padding-right:max(1.25rem, env(safe-area-inset-right))}.case-desk :where(a,button,input,select,summary,[role=tab]):focus-visible{outline:3px solid var(--color-highlight);outline-offset:3px}.case-desk .case-paper :where(a,button,input,select,summary,[role=tab]):focus-visible,.case-news :where(a,button):focus-visible{outline:3px solid var(--color-ink);outline-offset:3px}.case-paper{background:var(--color-cream);color:var(--color-ink)}.case-press{transition:transform .14s var(--ease-out-strong), background-color .14s var(--ease-out-strong)}.case-press:active{transform:scale(.97)}.case-tab{clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);background:var(--color-manila-deep);color:var(--color-ink)}.case-tab[aria-selected=true]{background:var(--color-manila)}.case-folder{background:var(--color-manila);color:var(--color-ink)}.case-step-num{background:var(--color-ink);width:1.75rem;height:1.75rem;color:var(--color-cream);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;place-items:center;font-weight:700;line-height:1;display:inline-grid}.case-ui-label{border:1px solid color-mix(in srgb, var(--color-ink) 45%, transparent);background:var(--color-cream);white-space:nowrap;padding:0 .3em;font-weight:700}.case-envelope{background:var(--color-kraft);color:var(--color-ink);transition:background-color .2s var(--ease-out-strong);position:relative}.case-envelope-stitch{border:2px dashed color-mix(in srgb, var(--color-ink) 30%, transparent);pointer-events:none;transition:border-color .2s var(--ease-out-strong);position:absolute;inset:10px}.case-envelope-flap{background:color-mix(in srgb, var(--color-kraft) 78%, var(--color-ink));clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;height:6rem;transition:transform .36s var(--ease-out-strong);pointer-events:none;position:absolute;inset:0 0 auto}.case-envelope-seal{background:var(--color-tabloid);width:2.8rem;height:2.8rem;box-shadow:inset 0 0 0 4px color-mix(in srgb, var(--color-tabloid) 70%, var(--color-ink));transition:transform .36s var(--ease-out-strong), opacity .2s var(--ease-out-strong);pointer-events:none;border-radius:999px;margin-left:-1.4rem;position:absolute;top:4.6rem;left:50%}.case-envelope[data-state=dragging]{background:color-mix(in srgb, var(--color-kraft) 85%, var(--color-cream))}.case-envelope[data-state=dragging] .case-envelope-stitch{border-color:var(--color-ink)}.case-envelope:is([data-state=dragging],[data-state=reading]) .case-envelope-flap{transform:perspective(700px)rotateX(72deg)}.case-envelope:is([data-state=dragging],[data-state=reading]) .case-envelope-seal{opacity:0;transform:translateY(-2.4rem)scale(.85)}.case-progress{background:color-mix(in srgb, var(--color-ink) 18%, transparent);height:.625rem;overflow:hidden}.case-progress>span{background:var(--color-tabloid);transform-origin:0;height:100%;transition:transform .16s linear;display:block}.case-mugshot{background:var(--color-ink);position:relative;overflow:hidden}.case-placard{background:var(--color-ink);color:var(--color-cream);text-align:center;letter-spacing:.04em;line-height:1.6;position:absolute;inset:auto 0 0}.case-me-stamp{border:2px solid var(--color-tabloid);background:var(--color-cream);color:var(--color-tabloid);padding:0 .3rem;font-weight:700;line-height:1.4;position:absolute;top:.35rem;right:.3rem;rotate:8deg}.case-name-input{border:0;border-bottom:2px solid var(--color-ink);width:100%;min-height:2.75rem;color:var(--color-ink);background:0 0;border-radius:0}.case-name-input[aria-invalid=true]{border-bottom-color:var(--color-tabloid);background:color-mix(in srgb, var(--color-tabloid) 8%, transparent)}.case-select{appearance:none;border:2px solid var(--color-ink);background:linear-gradient(45deg, transparent 50%, var(--color-ink) 50%) calc(100% - 1.05rem) 50% / .4rem .4rem no-repeat, linear-gradient(-45deg, transparent 50%, var(--color-ink) 50%) calc(100% - .65rem) 50% / .4rem .4rem no-repeat, var(--color-cream);min-height:2.75rem;color:var(--color-ink);border-radius:0;padding:0 2.25rem 0 .75rem}@media (prefers-reduced-motion:reduce){.case-press,.case-envelope-flap,.case-envelope-seal,.case-progress>span{transition-duration:0s}.case-press:active{transform:none}}}
