main.app{--gutter:clamp(1.25rem, 5vw, 3.5rem);--tile:#f5f5f5;--tile-hover:#eee;--line:#ececec;--soft:#9a9a9a;box-sizing:border-box;min-height:100dvh;padding:0 var(--gutter) calc(7rem + env(safe-area-inset-bottom));padding-left:max(var(--gutter), env(safe-area-inset-left));padding-right:max(var(--gutter), env(safe-area-inset-right));color:#222;font-size:14px;line-height:1.5;display:block}.app a{color:inherit;text-decoration:none}.app p{margin:0}.app-bar{justify-content:space-between;align-items:center;height:72px;display:flex}.app-bar .mark{background:#c9a86c;border-radius:5px;width:20px;height:20px}.app-bar nav{gap:.5rem;display:flex}.app h1.trail{letter-spacing:-.01em;overflow-wrap:anywhere;margin:3rem 0 3.5rem;font-size:clamp(1.5rem,4vw,2.25rem);font-weight:500;line-height:1.2}.trail .sep{color:#c4c4c4;margin:0 .4em;font-weight:400}.info{max-width:760px;display:grid}.info section{border-top:1px solid var(--line);grid-template-columns:160px minmax(0,1fr);gap:1rem 2rem;padding:2rem 0;display:grid}.info section:first-child{border-top:0;padding-top:0}.info h2{color:var(--soft);margin:0;font-size:13px;font-weight:400}.stack{align-content:start;gap:1.5rem;min-width:0;display:grid}.info dl{grid-template-columns:auto minmax(0,1fr);gap:.75rem 1.5rem;margin:0;display:grid}.info dt{color:var(--soft)}.info dd{overflow-wrap:anywhere;margin:0}.row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.app input,.app textarea,.app select{box-sizing:border-box;width:100%;min-height:40px;font:inherit;color:inherit;background:#fff;border:1px solid #e2e2e2;border-radius:6px;padding:.55rem .75rem;font-size:14px;transition:border-color .15s}.app input:focus,.app textarea:focus,.app select:focus{border-color:#bbb;outline:none}.app textarea{resize:none;line-height:1.5}.button{min-height:36px;font:inherit;color:#222;white-space:nowrap;cursor:pointer;background:#f0f0f0;border:0;border-radius:6px;justify-content:center;justify-self:start;align-items:center;padding:0 1rem;font-size:13px;transition:background .15s;display:inline-flex}.button:hover{background:#e4e4e4}.button.primary{color:#fff;background:#111}.button.primary:hover{background:#333}.button.quiet{min-height:0;color:var(--soft);background:0 0;padding:0}.button.quiet:hover{color:#222;background:0 0}.form{gap:.75rem;max-width:360px;display:grid}.muted{color:var(--soft)}.empty{color:var(--soft);text-align:center;grid-column:1/-1;padding:4rem 0}.reading{white-space:pre-wrap;max-width:640px;margin-top:3rem;font-size:16px;line-height:1.7}.view-switch{justify-content:center;gap:.25rem;margin:-1.5rem 0 3rem;display:flex}.view-icon{color:#cfcfcf;cursor:pointer;background:0 0;border:0;place-items:center;width:36px;height:36px;padding:0;transition:color .2s;display:grid}.view-icon:hover,.view-icon.active{color:#111}.wall{gap:5rem 3rem;display:grid}.wall-cards{grid-template-columns:minmax(0,560px);justify-content:center}.wall-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1100px;margin:0 auto}.wall-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:4rem 2.5rem}.block{min-width:0;display:block}.block-face{box-sizing:border-box;aspect-ratio:1;background:var(--tile);color:#444;flex-direction:column;padding:10%;font-size:12px;line-height:1.6;transition:background .2s;display:flex;position:relative;overflow:hidden}a.block:hover .block-face{--tile:var(--tile-hover)}.block-face:after{content:"";background:linear-gradient(transparent, var(--tile));pointer-events:none;height:30%;position:absolute;inset:auto 0 0}.wall-cards .block-face{padding:9%;font-size:15px}.wall-grid-3 .block-face{padding:9%;font-size:11px}.byline{color:#222;white-space:nowrap;text-overflow:ellipsis;flex:none;align-items:center;gap:.5rem;margin-bottom:1.25em;font-size:12px;display:flex;overflow:hidden}.wall-cards .byline{font-size:13px}.byline img,.byline .initial{object-fit:cover;border-radius:50%;flex:none;width:22px;height:22px}.byline .initial{color:#fff;text-transform:uppercase;background:#c9a86c;place-items:center;font-size:10px;display:grid}.block-text{white-space:pre-wrap;overflow-wrap:anywhere;min-height:0}.block-caption,.block-meta{letter-spacing:.01em;color:#333;text-align:center;text-overflow:ellipsis;white-space:nowrap;margin-top:1rem;font-size:12px;overflow:hidden}.block-meta{color:var(--soft);margin-top:.2rem}.avatar{color:#fff;text-transform:uppercase;cursor:pointer;background:#c9a86c;border:0;border-radius:50%;flex:none;place-items:center;width:64px;height:64px;padding:0;font-size:22px;display:grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.compose{right:max(clamp(1rem, 4vw, 2.5rem), env(safe-area-inset-right));bottom:max(clamp(1rem, 4vw, 2.5rem), env(safe-area-inset-bottom));z-index:10;height:44px;font:inherit;color:#222;cursor:pointer;background:#f0f0f0;border:0;border-radius:22px;align-items:center;padding:0 1rem;font-size:14px;transition:background .2s;display:inline-flex;position:fixed;box-shadow:0 2px 10px #00000014}.compose:hover{background:#e4e4e4}.compose>span:first-child{font-size:18px;line-height:1}.compose-label{opacity:0;white-space:nowrap;max-width:0;transition:max-width .35s cubic-bezier(.2,.8,.2,1),opacity .25s,margin-left .35s cubic-bezier(.2,.8,.2,1);display:inline-block;overflow:hidden}.compose.open .compose-label{opacity:1;max-width:6rem;margin-left:.45rem}.composer{box-sizing:border-box;width:min(520px,100vw - 2rem);font-family:var(--font-areal), system-ui, sans-serif;border:0;border-radius:12px;padding:1.5rem;box-shadow:0 12px 48px #0000001f}.composer::backdrop{background:#ffffffbf}.composer .form{max-width:none}.composer-row{justify-content:space-between;gap:.75rem;display:flex}.composer-row select{width:auto}@media (max-width:900px){.wall-grid-3{gap:3rem 1.5rem}}@media (max-width:640px){.app-bar{height:60px}.app h1.trail{margin:1.75rem 0 2.25rem}.trail a{z-index:1;margin:-.5rem 0;padding:.5rem 0;display:inline-block;position:relative}.info section{grid-template-columns:minmax(0,1fr);gap:1rem;padding:1.75rem 0}.form{max-width:none}.app input,.app textarea,.app select{min-height:44px;font-size:16px}.button{min-height:44px}.form>.button{justify-self:stretch}.view-switch{margin:-1rem 0 2rem}.view-icon{width:44px;height:44px}.app-bar .mark{position:relative}.app-bar .mark:after{content:"";position:absolute;inset:-12px}.auth-card .button.quiet{min-height:44px;padding:0 1rem}.wall{gap:3rem}.wall-cards{grid-template-columns:minmax(0,1fr)}.wall-grid-2{gap:2rem .875rem}.wall-grid-3{gap:1.5rem .5rem}.wall-grid-2 .block-face,.wall-grid-3 .block-face{padding:8%;font-size:10px}.wall-grid-2 .byline,.wall-grid-3 .byline{font-size:10px}.wall-grid-3 .byline{margin-bottom:.5em}.wall-grid-3 .byline img,.wall-grid-3 .byline .initial{width:16px;height:16px;font-size:8px}.wall-grid-3 .block-caption{margin-top:.5rem;font-size:10px}.wall-grid-3 .block-meta{font-size:10px}.composer{width:100vw;max-width:100vw;padding:1.25rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;margin:auto 0 0}}@media (prefers-reduced-motion:reduce){.compose-label{transition:none}}.info section>:only-child{grid-column:1/-1}.app.auth{flex-direction:column;display:flex}.auth-card{gap:1rem;width:100%;max-width:340px;margin:auto;padding:2rem 0 10vh;display:grid}.auth-card h1{letter-spacing:-.01em;text-align:center;margin:0 0 1rem;font-size:22px;font-weight:500}.auth-card .form{max-width:none}.auth-card .muted{text-align:center}.auth-card .button.quiet{justify-self:center}.button.wide{justify-self:stretch;width:100%;min-height:44px}.divider{color:#b5b5b5;align-items:center;gap:.75rem;font-size:12px;display:flex}.divider:before,.divider:after{content:"";background:var(--line);flex:1;height:1px}.settings{gap:3.5rem;max-width:720px;display:grid}.settings section{grid-template-columns:140px minmax(0,1fr);gap:0 2.5rem;display:grid}.settings h2{color:var(--soft);margin:0;padding-top:1.1rem;font-size:13px;font-weight:400}.fields{border-top:1px solid var(--line);display:grid}.field-form{display:contents}.field{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:1.5rem;min-height:60px;padding:.75rem 0;display:flex}.field.top{align-items:flex-start}.field.top>span{padding-top:.6rem}.field.end{border-bottom:0;justify-content:flex-end}.field>span:first-child{flex:none;min-width:4.5rem}.field input,.field textarea{flex:1;max-width:380px}.field .value{color:#666;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (max-width:640px){.settings{gap:2.5rem}.settings section{grid-template-columns:minmax(0,1fr)}.settings h2{padding:0 0 .75rem}.field{gap:1rem}.field input,.field textarea{max-width:none}.field.end .button{flex:1}}.app-bar .me{color:#fff;text-transform:uppercase;width:32px;height:32px;transition:transform .35s var(--ease), box-shadow .35s var(--ease);background:#c9a86c;border-radius:50%;place-items:center;font-size:13px;display:grid;position:relative;overflow:visible}.app-bar .me:after{content:"";position:absolute;inset:-6px}.app-bar .me img{object-fit:cover;border-radius:50%;width:100%;height:100%}.app-bar .me:hover{transform:scale(1.06);box-shadow:0 0 0 3px #f0f0f0}@media (max-width:640px){.app-bar .me{width:36px;height:36px;margin-right:-4px}}main.app{--ease:cubic-bezier(.22, 1, .36, 1)}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}.app h1.trail,.auth-card,.settings section,.info,.reading{animation:rise .7s var(--ease) both}.settings section:nth-child(2){animation-delay:60ms}.settings section:nth-child(3){animation-delay:.12s}.wall .block{animation:rise .7s var(--ease) both;animation-delay:calc(var(--i,0) * 45ms + 80ms)}.block-face{transition:background .3s var(--ease), transform .45s var(--ease)}a.block:active .block-face{transform:scale(.985)}.button,.compose,.view-icon{transition:background .25s var(--ease), color .25s var(--ease), transform .3s var(--ease)}.button:active,.compose:active,.view-icon:active{transform:scale(.96)}.compose{animation:rise .6s var(--ease) .3s both}.compose-label{transition:max-width .5s var(--ease), opacity .35s var(--ease), margin-left .5s var(--ease)}.composer{opacity:0;transition:opacity .35s var(--ease), transform .45s var(--ease), overlay .45s allow-discrete, display .45s allow-discrete;transform:translateY(12px)scale(.98)}.composer[open]{opacity:1;transform:none}@starting-style{.composer[open]{opacity:0;transform:translateY(12px)scale(.98)}}.composer::backdrop{opacity:0;transition:opacity .35s var(--ease), overlay .45s allow-discrete, display .45s allow-discrete}.composer[open]::backdrop{opacity:1}@starting-style{.composer[open]::backdrop{opacity:0}}@media (max-width:640px){.composer{transform:translateY(100%)}@starting-style{.composer[open]{transform:translateY(100%)}}}::view-transition-group(*){animation-duration:.55s;animation-timing-function:cubic-bezier(.22,1,.36,1)}::view-transition-old(*){object-fit:cover;height:100%}::view-transition-new(*){object-fit:cover;height:100%}@media (prefers-reduced-motion:reduce){.app *,.app ::backdrop,.app.auth .auth-card{transition:none!important;animation:none!important}}
