/* pickle.li — the layout and tokens of mishanaer.com (a 300 pt column, 12 pt muted labels over 14 pt
   text, a solid Contact button), set in Inter like the app. */
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/Inter-Regular.ttf) format("truetype")}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/Inter-Medium.ttf) format("truetype")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/Inter-SemiBold.ttf) format("truetype")}
:root{color-scheme:light dark;--bg:#FDFDFC;--fg:rgba(17,17,17,.9);--muted:rgba(17,17,17,.4);--fill:rgba(17,17,17,.05);--line:rgba(17,17,17,.1);--solid:#111;--on-solid:#FDFDFC}
@media (prefers-color-scheme:dark){:root{--bg:#111;--fg:rgba(253,253,252,.9);--muted:rgba(253,253,252,.4);--fill:rgba(253,253,252,.05);--line:rgba(253,253,252,.1);--solid:#FDFDFC;--on-solid:#111}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 14px/19.6px Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;letter-spacing:-.14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
p,h1,h2,ul{margin:0}
main{width:min(100%,332px);padding:32px 16px calc(env(safe-area-inset-bottom) + 48px);display:flex;flex-direction:column;gap:24px}
main.page{width:min(100%,592px)}
@media (min-width:640px){main{padding-left:22px;padding-right:22px;width:344px}main.page{width:636px}}
.icon{width:72px;height:72px;border-radius:16px;background:var(--bg);color:var(--solid);border:1px solid var(--line);display:flex}
.icon svg{width:100%;height:100%}
.block{display:flex;flex-direction:column;gap:8px}
.label{font-size:12px;line-height:16px;font-weight:500;letter-spacing:-.12px;color:var(--muted)}
h1{font-size:24px;line-height:28px;font-weight:600;letter-spacing:-.24px}
h2{font-size:14px;line-height:19.6px;font-weight:600}
.muted{color:var(--muted)}
.prose{display:flex;flex-direction:column;gap:24px}
.prose section{display:flex;flex-direction:column;gap:8px}
.prose ul{padding-left:18px;display:flex;flex-direction:column;gap:6px}
.prose a,.link{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.items{display:flex;flex-direction:column;gap:12px}
.item{display:flex;align-items:center;gap:12px}
.item .tile{flex:none;width:26px;height:26px;border-radius:7px;background:var(--fill);display:flex;align-items:center;justify-content:center}
.item .tile svg{width:15px;height:15px}
.item .title{font-size:14px;line-height:19.6px}
.item .desc{font-size:12px;line-height:16.8px;font-weight:500;letter-spacing:-.12px;color:var(--muted)}
.contact{position:relative;display:flex;align-items:center;justify-content:center;height:40px;border-radius:10px;background:var(--solid);color:var(--on-solid);font-weight:500}
.contact kbd{position:absolute;right:8px;width:24px;height:24px;border-radius:8px;border:1px solid color-mix(in srgb,var(--on-solid) 20%,transparent);display:flex;align-items:center;justify-content:center;font:500 11px/1 Inter,system-ui,sans-serif;color:color-mix(in srgb,var(--on-solid) 70%,transparent)}
@media (hover:none){.contact kbd{display:none}}
.back{display:inline-flex;align-items:center;gap:6px}