:root{--paper:#e7e6e1;--surface:#f6f5f2;--ink:#1d2320;--ink-60:#5f6862;--rule:#c6c6bf;--c-orange:#d9601a;--c-green:#1e8a4e;--c-blue:#1b5fc4;--c-brown:#79471f;--f-d:"Space Grotesk",sans-serif;--f-b:"Public Sans",system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--f-b);-webkit-font-smoothing:antialiased;background:#d5d4ce}.chrome{color:#5f6862;justify-content:center;align-items:center;gap:6px;padding:14px;font-size:12px;display:flex}.chrome button{font:inherit;border:1px solid var(--rule);background:var(--surface);color:var(--ink-60);cursor:pointer;padding:6px 14px;font-weight:500}.chrome button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.stage{justify-content:center;padding:0 14px 40px;display:flex}.frame{width:100%;max-width:1180px}.stage[data-mode=phone] .frame{width:392px;height:min(792px,84vh);overflow:hidden;box-shadow:0 24px 60px #1d232047}.stage[data-mode=desktop] .frame{box-shadow:0 12px 40px #1d232024}.app{background:var(--paper);height:100%;color:var(--ink);flex-direction:column;display:flex;overflow:hidden;container:app/inline-size}.stage[data-mode=desktop] .app{height:auto;max-height:84vh;overflow-y:auto}.masthead{z-index:5;backdrop-filter:blur(12px);background:#e7e6e1c7;justify-content:space-between;align-items:center;padding:15px 18px;display:flex;position:absolute;inset:0 0 auto}.masthead:after{content:"";background:linear-gradient(90deg,var(--c-orange) 0 25%,var(--c-green) 25% 50%,var(--c-blue) 50% 75%,var(--c-brown) 75% 100%);opacity:.85;height:2px;position:absolute;bottom:0;left:0;right:0}.wordmark{font-family:var(--f-d);letter-spacing:-.02em;font-size:15px;font-weight:700}.navbtn{font:inherit;color:var(--ink-60);cursor:pointer;background:0 0;border:0;font-size:13px}.feed{scroll-snap-type:y mandatory;overscroll-behavior-y:contain;flex:1;overflow-y:scroll}.card{scroll-snap-align:start;scroll-snap-stop:always;flex-direction:column;height:100%;padding:62px 0 20px;display:flex}.media{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);flex:1;min-height:0;position:relative;overflow:hidden}.media svg{width:100%;height:100%;display:block}.ulabel{font-family:var(--f-d);color:var(--surface);background:var(--tone);padding:3px 7px;font-size:11px;font-weight:700;position:absolute;top:10px;left:12px}.body{padding:0 18px}.meta{color:var(--ink-60);gap:14px;margin-top:16px;font-size:12px;display:flex}.meta .sec{color:var(--tone);font-weight:500}h2{font-family:var(--f-d);letter-spacing:-.035em;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-top:7px;font-size:30px;font-weight:700;line-height:1.06;display:-webkit-box;overflow:hidden}.dek{color:var(--ink-60);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:9px;font-size:15px;line-height:1.5;display:-webkit-box;overflow:hidden}h1{font-family:var(--f-d);letter-spacing:-.035em;margin-bottom:20px;font-size:42px;font-weight:700;line-height:1.06}.content{color:var(--ink);padding:62px 18px 40px;font-size:16px;line-height:1.7}.content p{margin-bottom:1.5em}.content code{background:var(--surface);border-radius:3px;padding:2px 6px;font-family:Fira Code,monospace;font-size:.9em}.content pre{background:var(--surface);border-radius:6px;margin-bottom:1.5em;padding:20px;overflow-x:auto}.content pre code{background:0 0;padding:0}.read{background:var(--ink);width:100%;color:var(--surface);cursor:pointer;font-family:var(--f-d);border:0;margin-top:15px;padding:13px;font-size:14px;font-weight:500}.hint{text-align:center;color:var(--ink-60);margin-top:11px;font-size:11px}@container app (width>=761px){.masthead{background:var(--paper);backdrop-filter:none;padding:20px 44px;position:sticky}.feed{scroll-snap-type:none;padding:34px 44px 70px;overflow:visible}.card{border-bottom:1px solid var(--rule);grid-template-columns:44px 210px 1fr;align-items:center;gap:24px;height:auto;padding:16px 0;display:grid}.card:first-of-type{border-top:1px solid var(--rule)}.card:before{content:attr(data-u);font-family:var(--f-d);color:var(--ink-60);text-align:right;border-right:1px solid var(--rule);grid-column:1;justify-content:flex-end;align-self:stretch;align-items:center;padding-right:10px;font-size:12px;font-weight:500;display:flex}.media{border:1px solid var(--rule);flex:none;grid-column:2;height:104px}.body{grid-column:3;grid-template-columns:1fr auto;align-items:center;column-gap:28px;padding:0;display:grid}.meta{order:1;grid-column:1;margin:0}h2{-webkit-line-clamp:2;order:2;grid-column:1;max-width:26ch;margin-top:4px;font-size:24px}.dek{-webkit-line-clamp:1;order:3;grid-column:1;max-width:56ch;font-size:15px}.read{width:auto;color:var(--ink);border:1px solid var(--rule);background:0 0;order:4;grid-area:1/2/4;margin:0;padding:10px 18px}.read:hover{background:var(--ink);color:var(--surface);border-color:var(--ink)}.hint,.ulabel{display:none}.app.single-page{max-height:none;overflow-y:auto}.app.single-page .masthead{position:sticky}.app.single-page main{padding:80px 44px 100px}}@media (width<=760px){.chrome{display:none}.stage{padding:0}.stage .frame{max-width:none;box-shadow:none;width:100%!important;height:100dvh!important}.app{height:100dvh!important;max-height:none!important}}@media (width>=761px){.chrome{display:none}.stage{padding:0;display:block}.frame{width:100%;max-width:none;box-shadow:none}.app{background:var(--paper);height:auto;max-height:none;overflow:visible}body{background:var(--paper)}}:focus-visible{outline:2px solid var(--c-blue);outline-offset:2px}