@layer properties,theme,base;@layer components{dialog.article{z-index:60;width:100%;max-width:none;height:100dvh;max-height:none;color:var(--color-ink);background:#16181c8c;border:0;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}dialog.article[open]{flex-direction:column;justify-content:flex-end;display:flex}dialog.article::backdrop{background:0 0}:where(html:has(dialog.article[open])){overflow:hidden}.article-scrim{background:0 0;border:0;position:absolute;inset:0}.article-panel{z-index:1;overscroll-behavior:contain;max-height:86dvh;padding:16px 16px calc(28px + env(safe-area-inset-bottom));background:var(--color-page);border-radius:22px 22px 0 0;outline:1px solid #0000;flex-direction:column;gap:14px;transition:translate .18s cubic-bezier(.2,0,0,1);display:flex;position:relative;overflow-y:auto;box-shadow:0 -10px 40px #16181c40}@starting-style{dialog.article[open] .article-panel{translate:0 24px}}.article-x{border:1px solid var(--color-line);background:var(--color-page);width:44px;height:44px;color:var(--color-ink);cursor:pointer;border-radius:22px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.article-title{font-family:var(--pair-display);letter-spacing:-.02em;text-wrap:balance;font-size:26px;font-weight:800;line-height:1.15}.article-title:focus{outline:none}@media (min-width:640px){dialog.article[open]{justify-content:center;align-items:center;padding:24px}.article-panel{border-radius:24px;width:min(720px,100%);max-height:80dvh;padding:24px;box-shadow:0 30px 80px #0006}@starting-style{dialog.article[open] .article-panel{translate:0 8px}}}@media (scripting:none){dialog.article[open]:has(~dialog.article[open]){visibility:hidden}.article-wrap{display:none!important}}}@layer utilities;
