:root{--brand:#F04452;--brand-hover:#D93847;--brand-soft:#FFF0F2;--text-primary:#202124;--text-secondary:#74777D;--text-tertiary:#A0A3A8;--surface:#FFF;--page-bg:#F7F8FA;--divider:#ECEEF1;--success:#249A68;--warning:#D58A18;--danger:#D9363E;--radius-sm:8px;--radius-md:12px;--radius-card:14px;--radius-pill:999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--content-max:1120px;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;color:var(--text-primary);background:var(--page-bg);font-size:16px;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--page-bg);font-size:14px;line-height:1.55;padding-bottom:calc(70px + env(safe-area-inset-bottom))}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a{touch-action:manipulation}.shell{width:min(100%,var(--content-max));margin-inline:auto}.skip-link{position:fixed;top:8px;left:8px;z-index:1000;padding:10px 14px;background:var(--text-primary);color:#fff;border-radius:8px;transform:translateY(-150%)}.skip-link:focus{transform:none}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-bottom:1px solid var(--divider)}.header-row{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 12px}.brand{display:flex;align-items:center;gap:9px;min-width:0}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;background:linear-gradient(145deg,#ff6975,var(--brand));color:#fff;font-weight:800;box-shadow:0 6px 15px rgba(240,68,82,.2)}.brand b{display:block;font-size:16px;line-height:1.1}.brand small{display:none;color:var(--text-secondary);font-size:10px}.header-actions{display:flex;align-items:center;gap:4px}.icon-link,.language summary{display:flex;align-items:center;justify-content:center;min-width:44px;height:44px;border:0;background:transparent;cursor:pointer;border-radius:50%}.icon-link:hover,.language summary:hover{background:var(--page-bg)}.icon-link span{font-size:26px;line-height:1}.language{position:relative}.language summary{gap:2px;list-style:none}.language summary::-webkit-details-marker{display:none}.lang-code{font-size:10px;color:var(--text-secondary)}.language-menu{position:absolute;right:0;top:44px;width:136px;padding:6px;background:#fff;border:1px solid var(--divider);border-radius:12px;box-shadow:0 14px 40px rgba(25,27,31,.12)}.language-menu a{display:block;padding:10px 12px;border-radius:8px;white-space:nowrap}.language-menu a:hover,.language-menu a[aria-current=true]{background:var(--brand-soft);color:var(--brand)}.category-nav{display:flex;gap:24px;height:42px;align-items:flex-end;padding:0 12px;overflow-x:auto;scrollbar-width:none}.category-nav::-webkit-scrollbar{display:none}.category-nav a{position:relative;display:flex;align-items:center;height:42px;color:var(--text-secondary);white-space:nowrap;font-weight:500}.category-nav a.active{color:var(--brand);font-weight:650}.category-nav a.active:after{content:"";position:absolute;left:25%;right:25%;bottom:0;height:2px;border-radius:2px;background:var(--brand)}.main{padding:0 10px}.feed-heading{padding:20px 2px 14px}.feed-heading h1{font-size:20px;margin:1px 0 0;letter-spacing:-.3px}.eyebrow{margin:0;color:var(--brand);font-size:12px;font-weight:650}.masonry{columns:2;column-gap:10px}.note-card{display:inline-block;width:100%;margin:0 0 11px;break-inside:avoid;background:var(--surface);border-radius:var(--radius-card);overflow:hidden;vertical-align:top}.note-card:focus-within{outline:2px solid var(--brand);outline-offset:2px}.card-link{display:block}.card-cover{position:relative;aspect-ratio:var(--ratio,.82);overflow:hidden;background:linear-gradient(145deg,#ffe8eb,#f0f1f5)}.card-cover img{display:block;width:100%;height:100%;object-fit:cover}.cover-placeholder{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(150deg,#ffe4e8,#fff2df 48%,#e9edf8)}.cover-placeholder span{font-size:42px;font-weight:800;color:rgba(240,68,82,.28)}.video-badge{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff;background:rgba(18,18,20,.6);font-size:11px;backdrop-filter:blur(5px)}.card-body{padding:9px 9px 10px}.card-body h2{display:-webkit-box;margin:0 0 9px;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;line-height:1.45;font-weight:600;overflow-wrap:anywhere}.card-meta{display:flex;align-items:center;min-width:0;color:var(--text-secondary);font-size:11px}.avatar{display:grid;place-items:center;flex:0 0 auto;width:20px;height:20px;border-radius:50%;margin-right:5px;background:var(--brand-soft);color:var(--brand);font-size:10px;font-weight:700}.avatar.large{width:38px;height:38px;margin-right:10px;font-size:15px}.author{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.like{margin-left:auto;white-space:nowrap;padding-left:4px}.feed-status{display:grid;place-items:center;min-height:100px;color:var(--text-tertiary);text-align:center}.load-more,.primary-button{min-height:44px;padding:0 20px;border:0;border-radius:var(--radius-pill);background:var(--brand);color:#fff;cursor:pointer}.load-more:hover,.primary-button:hover{background:var(--brand-hover)}.load-more[disabled]{opacity:.65}.empty-state{display:grid;place-items:center;max-width:430px;margin:50px auto;padding:36px 22px;text-align:center}.empty-state>span{display:grid;place-items:center;min-width:62px;height:62px;padding:0 8px;border-radius:22px;background:var(--brand-soft);color:var(--brand);font-size:25px;font-weight:700}.empty-state h1,.empty-state h2{margin:18px 0 4px;font-size:20px}.empty-state p{margin:0 0 20px;color:var(--text-secondary)}.bottom-nav{position:fixed;z-index:30;left:0;right:0;bottom:0;height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:flex;justify-content:space-around;border-top:1px solid var(--divider);background:rgba(255,255,255,.97);backdrop-filter:blur(15px)}.bottom-nav a{display:flex;min-width:70px;min-height:56px;flex-direction:column;align-items:center;justify-content:center;color:var(--text-secondary);font-size:10px;white-space:nowrap}.bottom-nav span{font-size:20px;line-height:1.05}.bottom-nav a.active{color:var(--brand);font-weight:650}.search-page{padding:18px 0 14px}.search-page h1{margin:20px 2px 0;font-size:18px}.search-form{display:flex;align-items:center;gap:8px;height:48px;padding-left:14px;background:#fff;border:1px solid var(--divider);border-radius:14px}.search-form:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.search-form>span{font-size:22px;color:var(--text-tertiary)}.search-form input{min-width:0;flex:1;height:44px;border:0;outline:0;background:transparent}.search-form button{align-self:stretch;padding:0 18px;border:0;border-radius:0 13px 13px 0;background:var(--brand);color:#fff;font-weight:600}.note-detail{max-width:720px;margin:0 auto;background:#fff;min-height:100vh}.back-link{display:inline-flex;align-items:center;min-height:44px;margin:4px 10px;font-weight:600}.gallery{position:relative;background:#111;overflow:hidden}.gallery-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.gallery-track::-webkit-scrollbar{display:none}.gallery-slide{flex:0 0 100%;height:min(76vh,720px);padding:0;border:0;background:#111;scroll-snap-align:center;cursor:zoom-in}.gallery-slide img{width:100%;height:100%;object-fit:contain}.gallery-count{position:absolute;right:12px;bottom:12px;padding:4px 10px;border-radius:99px;background:rgba(0,0,0,.58);color:#fff;font-size:12px}.video-wrap{background:#111}.video-wrap video{display:block;width:100%;max-height:76vh}.note-content{padding:20px 18px 40px}.author-line{display:flex;align-items:center}.author-line strong{display:block}.author-line time{display:block;color:var(--text-tertiary);font-size:12px}.note-content h1{margin:20px 0 12px;font-size:22px;line-height:1.35}.body-text{font-size:15px;line-height:1.85;overflow-wrap:anywhere}.body-text p{margin:0 0 1em}.engagement{display:flex;gap:16px;overflow-x:auto;padding:16px 0;margin-top:18px;border-top:1px solid var(--divider);color:var(--text-secondary);font-size:12px;white-space:nowrap}.engagement b{color:var(--text-primary)}.source-notice{color:var(--text-tertiary);font-size:12px}.source-link{display:inline-flex;align-items:center;min-height:44px;color:var(--brand);font-weight:650}.lightbox{width:100vw;height:100vh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(0,0,0,.94)}.lightbox[open]{display:grid;place-items:center}.lightbox img{max-width:100%;max-height:100%;object-fit:contain}.lightbox-close{position:fixed;z-index:2;top:calc(12px + env(safe-area-inset-top));right:12px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:28px;cursor:pointer}.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}:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(min-width:600px){.brand small{display:block}.main{padding-inline:16px}.masonry{columns:3;column-gap:14px}.note-card{margin-bottom:14px}.header-row,.category-nav{padding-inline:16px}.bottom-nav{left:50%;width:390px;transform:translateX(-50%);border-left:1px solid var(--divider);border-right:1px solid var(--divider)}}@media(min-width:920px){body{padding-bottom:30px}.site-header{position:relative}.masonry{columns:4;column-gap:18px}.note-card{margin-bottom:18px;transition:transform .2s ease,box-shadow .2s ease}.note-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(31,36,45,.08)}.bottom-nav{display:none}.feed-heading{padding-top:30px}.note-detail{margin-top:24px;border-radius:18px;overflow:hidden;box-shadow:0 12px 50px rgba(31,36,45,.08)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.source-link.secondary{margin-left:16px;color:var(--text-secondary)}.form-page{max-width:620px;margin:24px auto;padding:18px;background:#fff;border-radius:16px}.form-page h1{font-size:22px}.form-page>p{color:var(--text-secondary)}.form-page form{display:grid;gap:16px}.form-page label{display:grid;gap:6px;font-weight:600}.form-page input,.form-page textarea{width:100%;padding:11px 12px;border:1px solid var(--divider);border-radius:10px;resize:vertical}.form-page input:focus,.form-page textarea:focus{outline:2px solid var(--brand-soft);border-color:var(--brand)}.form-page .primary-button{justify-self:start}.form-message{padding:11px;margin:12px 0;border-radius:9px;background:var(--brand-soft);color:var(--brand)}
.brand-logo{display:block;width:34px;height:34px;object-fit:contain;border-radius:10px}.home-feed{padding-top:10px}.note-card{border:1px solid rgba(236,238,241,.75);box-shadow:0 3px 14px rgba(31,36,45,.045)}.note-detail{width:calc(100% - 8px);max-width:780px;min-height:0;margin:12px auto 24px;border:1px solid var(--divider);border-radius:18px;overflow:hidden;box-shadow:0 10px 36px rgba(31,36,45,.07)}.back-link{margin:8px 14px;padding:0 8px;border-radius:9px;color:var(--text-secondary)}.back-link:hover{background:var(--page-bg);color:var(--text-primary)}.gallery,.video-wrap{margin:0 14px 4px;border-radius:16px;overflow:hidden}.gallery{background:#f1f2f4}.gallery-slide{height:min(68vh,660px);background:#f1f2f4}.video-wrap video{border-radius:16px}.note-content{padding:24px 26px 42px}.note-content h1{margin:22px 0 16px;font-size:clamp(21px,4vw,28px);letter-spacing:-.35px}.body-text{font-size:16px;line-height:1.9;color:#303238}.body-text p{margin:0 0 1.15em}.engagement{gap:22px;margin-top:26px;padding:18px 0 4px;border-top:1px solid var(--divider)}.note-actions{margin-top:16px}.source-link{padding:0 14px;border-radius:99px;background:var(--brand-soft)}@media(max-width:599px){.note-content{padding:22px 20px 36px}.gallery,.video-wrap{margin-inline:10px}.note-detail{margin-top:10px}.home-feed{padding-top:8px}}@media(min-width:920px){.note-detail{margin-top:28px}.gallery,.video-wrap{margin-inline:20px}.note-content{padding-inline:34px}}

/* Mobile navigation sheets and install prompt */
.bottom-nav button{display:flex;min-width:70px;min-height:56px;padding:0;border:0;background:transparent;flex-direction:column;align-items:center;justify-content:center;color:var(--text-secondary);font-size:10px;white-space:nowrap;cursor:pointer}.bottom-nav button span{font-size:20px;line-height:1.05}.install-prompt{position:fixed;z-index:29;left:50%;bottom:calc(66px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:8px;max-width:calc(100vw - 32px);min-height:48px;padding:0 22px;border:0;border-radius:999px;background:linear-gradient(135deg,#ff5261,var(--brand));box-shadow:0 10px 30px rgba(240,68,82,.34);color:#fff;font-size:15px;font-weight:700;white-space:nowrap;cursor:pointer}.install-prompt span{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#fff;color:var(--brand);font-size:20px}.install-prompt[hidden]{display:none}.sheet-dialog{position:fixed;inset:auto 0 0 0;width:min(100%,600px);max-width:none;margin:0 auto;padding:8px 20px calc(22px + env(safe-area-inset-bottom));border:0;border-radius:22px 22px 0 0;background:#fff;color:var(--text-primary);box-shadow:0 -18px 50px rgba(20,25,32,.16)}.sheet-dialog[open]{animation:sheet-in .22s ease-out}.sheet-dialog::backdrop{background:rgba(20,22,28,.45);backdrop-filter:blur(2px)}.sheet-handle{width:38px;height:4px;margin:0 auto 12px;border-radius:9px;background:#d8dadd}.sheet-dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.sheet-dialog h2{margin:0;font-size:21px;line-height:1.35}.sheet-dialog header small{display:block;margin-bottom:2px;color:var(--brand);font-weight:650}.sheet-dialog header>button{flex:0 0 auto;width:38px;height:38px;border:0;border-radius:50%;background:var(--page-bg);color:var(--text-secondary);font-size:25px;cursor:pointer}.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}.category-grid a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 12px;border:1px solid var(--divider);border-radius:13px;background:var(--page-bg);font-weight:600;overflow-wrap:anywhere}.category-grid a:first-child{border-color:#ffd2d7;background:var(--brand-soft);color:var(--brand)}.install-intro{margin:12px 0 18px;color:var(--text-secondary)}.install-steps{display:grid;gap:12px;margin:0;padding:0;list-style:none}.install-steps li{display:flex;gap:12px;padding:14px;border-radius:15px;background:var(--page-bg)}.install-steps li>span{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;font-weight:750}.install-steps strong{display:block;margin:2px 0 3px;font-size:15px}.install-steps p{margin:0;color:var(--text-secondary);line-height:1.55}.sheet-primary{width:100%;min-height:48px;margin-top:18px;border:0;border-radius:999px;background:var(--brand);color:#fff;font-weight:700;cursor:pointer}@keyframes sheet-in{from{transform:translateY(24px);opacity:.5}to{transform:none;opacity:1}}

/* Immersive note detail */
.note-page{padding-bottom:calc(72px + env(safe-area-inset-bottom))}.note-page .site-header{position:relative}.note-page .main{width:100%;max-width:780px;padding:0}.note-page .note-detail{width:100%;margin:0 auto 18px;border:0;border-radius:0;box-shadow:none}.note-page .back-link{margin:4px 10px}.note-page .gallery,.note-page .video-wrap{width:100%;margin:0;border-radius:0}.note-page .gallery-slide{height:auto;min-height:0;background:#f2f2f2}.note-page .gallery-slide img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}.note-page .video-wrap video{width:100%;max-height:82vh;border-radius:0}.recommendations{width:min(100%,780px);margin:0 auto;padding:20px 10px 90px}.recommendations>header{display:flex;align-items:center;justify-content:space-between;padding:0 3px 14px}.recommendations>header h2{margin:0;font-size:20px}.recommendations>header a{color:var(--text-secondary)}.note-bottom-bar{position:fixed;z-index:31;left:50%;bottom:0;transform:translateX(-50%);display:flex;align-items:center;justify-content:flex-end;gap:20px;width:min(100%,780px);height:calc(58px + env(safe-area-inset-bottom));padding:0 18px env(safe-area-inset-bottom);border-top:1px solid var(--divider);background:rgba(255,255,255,.97);backdrop-filter:blur(16px)}.note-bottom-bar a{display:grid;place-items:center;width:38px;height:38px;margin-right:auto;border-radius:50%;background:var(--page-bg);font-size:21px}.note-bottom-bar span{white-space:nowrap;color:var(--text-secondary);font-size:12px}.note-bottom-bar b{color:var(--text-primary);font-size:14px}.note-page .install-prompt{bottom:calc(68px + env(safe-area-inset-bottom))}
@media(min-width:600px){.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.note-page .note-detail{margin-top:20px;border-radius:18px;overflow:hidden}.note-page .gallery,.note-page .video-wrap{border-radius:0}.recommendations{padding-inline:0}}
@media(min-width:760px){.install-prompt{display:none}}
@media(min-width:920px){.note-page{padding-bottom:30px}.note-bottom-bar{position:static;transform:none;margin:0 auto 20px;border:1px solid var(--divider);border-radius:16px}.recommendations{padding-bottom:30px}}
.language summary{min-width:auto;padding:0 10px;border-radius:12px}.lang-code{font-size:14px;color:var(--text-primary);white-space:nowrap}.brand>span:last-child{min-width:0}.brand b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.install-prompt span{position:relative;display:block;flex:0 0 25px;color:transparent;font-size:0}.install-prompt span::before,.install-prompt span::after{content:"";position:absolute;top:50%;left:50%;border-radius:2px;background:var(--brand);transform:translate(-50%,-50%)}.install-prompt span::before{width:14px;height:3px}.install-prompt span::after{width:3px;height:14px}
