@font-face{font-family:"Courier Prime";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/courier-prime.woff2") format("woff2")}
@font-face{font-family:"Albert Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/albert-sans.woff2") format("woff2")}
:root{color-scheme:dark;--base:#131415;--edge:#929292;--bubble:#404040;--mint:#6becae;--progress:#7bdcb5;--phone-width:min(400px,calc(100vw - 48px));--phone-height:max(570px,calc(var(--phone-width)*1.8));--message-font-size:9px;--message-gap:22px;--detail-top:max(28px,env(safe-area-inset-top));--viewport-height:100vh}
*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-gutter:stable;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--base);color:#fff;font-family:"Courier Prime",monospace;font-size:10px;line-height:1.3}a{color:var(--mint);text-underline-offset:2px}a:hover{color:white}a:focus-visible,button:focus-visible{outline:2px solid var(--mint);outline-offset:4px}button{font:inherit;color:inherit}p,h1,h2,figure{margin:0}button,a{-webkit-tap-highlight-color:transparent}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.timeline{width:var(--phone-width);max-width:calc(100% - 32px);margin:60.72px auto 80px;padding:0}.phone{display:flex;flex-direction:column;width:100%;height:var(--phone-height);min-height:0;overflow:hidden;border:solid var(--edge);border-width:2px 7px 3px 1px;border-radius:40px 45px 50px 45px;padding:15px 21px;margin:0 auto 35px;scroll-margin-top:35px}.phone>.dots,.phone>.status,.phone>.chat-header,.phone>.composer{flex-shrink:0}.dots{display:flex;gap:3px;justify-content:center;font-size:13px;line-height:16.9px;margin:5px 0 7px;color:var(--edge)}.status{display:flex;justify-content:space-between;align-items:center;margin:1px 0;color:var(--edge);font-size:11px;line-height:14.3px;white-space:nowrap}.status-side{display:flex;align-items:center}.status-side:first-child{gap:8px}.status-side:last-child{gap:2px}.status .battery-value{min-width:0}.status-icon{font-size:7px}.random-time{font-variant-numeric:tabular-nums;display:inline-block;min-width:5ch}.battery-value{display:inline-block;min-width:3ch;text-align:right;font-variant-numeric:tabular-nums}.chat-header{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:11px 5px 8px;border-bottom:1px solid var(--bubble);font-size:clamp(14px,calc(14px + (100vw - 320px)*.00441),17px);line-height:1.3}.chat-header h1,.chat-header h2{font:inherit;font-weight:200;text-align:center}.chat-header h1 a,.chat-header h2 a{color:#fff;text-decoration:none}.plain-control{background:none;border:0;padding:0;text-decoration:none;color:white;font:inherit;cursor:pointer}.messages{flex:1;min-height:0;margin:21px 0;display:flex;flex-direction:column;gap:var(--message-gap);overflow:visible}.messages:focus-visible{outline:1px solid var(--mint);outline-offset:3px}.messages>*{flex-shrink:0}.message{display:flex;align-items:flex-start;gap:11px;min-width:0}.avatar{width:31px;height:31px;object-fit:cover;border-radius:50%;flex:0 0 31px}.bubble{font-size:var(--message-font-size);min-width:0;flex:1;background:var(--bubble);padding:17px;border-radius:0 17px 19px 17px}.food-photo{display:block;width:100%;height:auto}.photo-link{display:block}.progress{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px;font-size:var(--message-font-size);margin-top:8px;line-height:13px;flex-shrink:0}.green{color:var(--progress)}.progress-amount{display:inline-block;min-width:9ch;white-space:nowrap;font-variant-numeric:tabular-nums}.progress-value{font-variant-numeric:tabular-nums}.link-message{font-size:var(--message-font-size);line-height:1.3}.link-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px;margin-top:3px;font-size:inherit}.post-link{font-size:inherit;text-decoration:none}.composer{display:flex;gap:11px;align-items:center;margin:21px 0 15px;padding-top:11px}.composer-symbol{width:31px;flex:0 0 31px;text-align:center;font-size:clamp(17px,2.7vw,27px);line-height:1.3}.composer-input{border:1px solid var(--edge);border-radius:30px;padding:9px 9px 5px;flex:1;color:var(--edge);font-size:12px;white-space:nowrap;min-width:0}.composer-up{flex:0 0 17px;width:17px;text-align:right}.prose{font-size:var(--message-font-size);line-height:1.7;overflow-wrap:anywhere}.prose p+p,.prose ul,.prose ol,.prose blockquote{margin-top:12px}.prose img{max-width:100%;height:auto}.prose pre{overflow:auto}.prose table{display:block;overflow:auto}.prose blockquote{border-left:2px solid var(--mint);margin-left:0;padding-left:10px}.post-date{font-size:var(--message-font-size);color:var(--edge);text-align:center;margin:12px 0 0}.detail-back{display:block;margin:0 0 20px;font-size:11px}.pagination{width:400px;max-width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:0 auto 35px;font-size:13px;line-height:1.6}.pagination a{text-decoration:none}.pagination [aria-current]{color:white}.lock{padding-inline:15px}.lock>*{width:100%;max-width:350px;flex-shrink:0;margin-left:auto;margin-right:auto}.lock-symbol{margin-top:7px;text-align:center;font-family:system-ui,sans-serif;font-size:clamp(14px,calc(14px + (100vw - 320px)*.00147),15px);line-height:1.3}.charged{display:flex;justify-content:center;gap:0;align-items:baseline;margin-top:5px;font-size:clamp(14px,calc(14px + (100vw - 320px)*.00147),15px);line-height:1.3}.charged .battery-value{font-size:clamp(14px,calc(14px + (100vw - 320px)*.00441),17px);line-height:1.3}.lock-clock{display:block;width:100%;min-width:0;text-align:center;font-family:"Albert Sans",sans-serif;font-size:clamp(44.96px,calc(44.96px + (100vw - 320px)*.06182),87px);line-height:1.3;letter-spacing:-1px}.lock-space{flex:1;min-height:0;height:auto;margin-top:7px}.notifications{display:grid;gap:7px;margin-top:7px}.notification{border:solid var(--bubble);border-width:1px 2px;border-radius:17px;padding:7px 8px 3px 15px;font-size:11px;display:flex;gap:4px;align-items:center;min-height:32px}.notification .emoji{font-family:system-ui,sans-serif;font-size:clamp(14px,calc(14px + (100vw - 320px)*.00882),20px);line-height:1.3}.notification a{font-size:15px}.notification .home-link{font-size:11px}.swipe{display:block;text-align:center;color:white;text-decoration:none;font-size:11px;line-height:14.3px;margin:39px 0 3px}.lock.end .swipe{margin-top:39px}.end-link{font-size:15px}.fallback-note{max-width:400px;color:var(--edge);font-size:11px}.broken-page{font-size:14px;line-height:1.8}
@media(max-width:380px){.phone{padding-inline:16px}.avatar{width:27px;height:27px;flex-basis:27px}.bubble{padding:14px}.message{gap:9px}.composer{gap:7px}.composer-symbol{width:27px;flex-basis:27px}.chat-header{padding-inline:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Feed phones stay still; only the page scrolls. Reserve the date message before fitting the photo. */
.timeline:not(.detail) .post-phone .messages{display:grid;grid-template-rows:minmax(0,max-content) max-content;align-content:start}
.timeline:not(.detail) .post-phone .messages>.message:first-child{min-height:0;height:100%;max-height:100%;align-self:stretch}
.timeline:not(.detail) .post-phone .messages>.message:first-child .bubble{min-height:0;height:fit-content;max-height:100%;display:flex;flex-direction:column;align-self:flex-start}
.timeline:not(.detail) .photo-link{min-height:0;display:flex;flex:0 1 auto}
.timeline:not(.detail) .food-photo{min-height:0;object-fit:contain}
.messages .bubble :is(a,p,span,code,li,th,td,h1,h2,h3,h4,h5,h6){font-size:inherit}
/* A detail page has one stationary frame with an independently scrollable screen. */
html.detail-page,html.detail-page body{height:100%;overflow:hidden;overscroll-behavior:none}
html.detail-page body{display:flow-root}
.timeline.detail{margin:var(--detail-top) auto 0}
.timeline.detail .phone{height:min(var(--phone-height),calc(var(--viewport-height) - var(--detail-top) - max(16px,env(safe-area-inset-bottom))));margin-bottom:0}
.timeline.detail .messages{margin-bottom:8px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:var(--edge) transparent;-webkit-overflow-scrolling:touch}
.timeline.detail .composer{margin-top:8px;padding-top:0}
@supports(height:100svh){:root{--viewport-height:100svh}}
@supports(height:100dvh){html.detail-page{--viewport-height:100dvh}}
