/* 随手记 · 弹幕分享站 */
:root {
  --bg: #0f0f14; --surface: #1a1a24; --surface2: #242432;
  --border: #2e2e40; --text: #e8e8f0; --text2: #9999aa;
  --accent: #6366f1; --radius: 12px;
  --theme-mood: #ec4899; --theme-daily: #3b82f6; --theme-scene: #22c55e;
  --theme-food: #f97316; --theme-vent: #a855f7; --theme-secret: #6b7280;
  --theme-game: #ef4444; --theme-campus: #06b6d4; --theme-life: #84cc16;
  --theme-music: #d946ef; --theme-travel: #f59e0b; --theme-tech: #6366f1;
}
* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--text); min-height: 100vh;
}
.header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(15,15,20,.92); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border); padding: 12px 20px;
}
.header-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.logo {
  font-size:20px; font-weight:700;
  background: linear-gradient(135deg,#ec4899,#6366f1,#22c55e);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.btn-post {
  background: var(--accent); color:#fff; border:none;
  padding:8px 20px; border-radius:20px; font-size:14px; font-weight:600;
  cursor:pointer; transition:transform .15s, box-shadow .15s;
}
.btn-post:hover { transform:scale(1.05); box-shadow:0 4px 20px rgba(99,102,241,.4); }
.theme-bar { display:flex; gap:8px; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin; }
.theme-bar::-webkit-scrollbar { height:4px; }
.theme-bar::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }
.theme-tag {
  flex-shrink:0; padding:6px 14px; border-radius:18px; font-size:13px;
  border:1px solid var(--border); background:var(--surface); color:var(--text2);
  cursor:pointer; transition:all .2s; white-space:nowrap;
}
.theme-tag:hover { border-color:var(--text2); color:var(--text); }
.theme-tag.active { color:#fff; border-color:transparent; font-weight:600; }
.theme-tag.active[data-theme="all"] { background:var(--text); color:var(--bg); }
.danmaku-area {
  position:relative; height:320px; overflow:hidden;
  border-bottom:1px solid var(--border);
  background: linear-gradient(180deg,#0a0a12 0%,#12121e 100%);
}
.danmaku-bg {
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.5s ease;
}
.danmaku-bg.show { opacity:.28; }
.danmaku-bg-mask {
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(180deg, rgba(10,10,18,.5) 0%, rgba(15,15,20,.7) 100%);
}
.danmaku-area::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:60px;
  background: linear-gradient(transparent,var(--bg)); pointer-events:none; z-index:5;
}
.danmaku-item {
  position:absolute; right:100%; padding:6px 16px; border-radius:20px;
  font-size:14px; white-space:nowrap; cursor:pointer; transition:transform .15s;
  max-width:50vw; overflow:hidden; text-overflow:ellipsis; z-index:3;
}
.danmaku-item:hover { transform:scale(1.08); z-index:10 !important; }
.danmaku-item .d-name { font-size:11px; opacity:.7; margin-right:6px; }
.waterfall-section { max-width:1200px; margin:0 auto; padding:24px 20px; }
.waterfall-title { font-size:18px; font-weight:700; margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.waterfall-title::before { content:''; width:4px; height:18px; border-radius:2px; background:var(--accent); }
.waterfall-grid { columns:4 240px; column-gap:16px; }
@media (max-width:900px){ .waterfall-grid { columns:2 200px; } }
@media (max-width:500px){ .waterfall-grid { columns:1; } }
.card {
  break-inside:avoid; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius); padding:16px; margin-bottom:16px; cursor:pointer;
  transition:transform .15s, border-color .15s;
}
.card:hover { transform:translateY(-2px); border-color:var(--text2); }
.card-media { width:100%; border-radius:8px; margin-bottom:10px; display:block; max-height:300px; object-fit:cover; }
.card-text { font-size:14px; line-height:1.6; margin-bottom:10px; word-break:break-word; }
.card-footer { display:flex; align-items:center; justify-content:space-between; font-size:12px; color:var(--text2); }
.card-theme-badge { padding:2px 8px; border-radius:10px; font-size:11px; color:#fff; font-weight:500; }
.card-meta { display:flex; align-items:center; gap:10px; }
.card-heart { cursor:pointer; display:flex; align-items:center; gap:3px; border:0;background:none;color:inherit;font:inherit; }
.card-link { display:block;color:inherit;text-decoration:none; }
.card-link:focus-visible { outline:2px solid var(--accent);outline-offset:5px;border-radius:4px; }
.wall-post { text-decoration:none; }
.card-heart:hover { color:#ef4444; }
.load-more {
  display:block; margin:20px auto; padding:10px 32px; background:var(--surface);
  border:1px solid var(--border); color:var(--text); border-radius:20px;
  cursor:pointer; font-size:14px; transition:all .2s;
}
.load-more:hover { border-color:var(--accent); color:var(--accent); }
.no-more { text-align:center; color:var(--text2); font-size:13px; padding:20px; }
.modal-mask {
  position:fixed; inset:0; background:rgba(0,0,0,.7); backdrop-filter:blur(4px);
  z-index:200; display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; pointer-events:none; transition:opacity .2s;
}
.modal-mask.show { opacity:1; pointer-events:auto; }
.modal-box {
  background:var(--surface); border:1px solid var(--border); border-radius:16px;
  width:100%; max-width:520px; max-height:85vh; overflow-y:auto; padding:24px;
  transform:scale(.95); transition:transform .2s;
}
.modal-mask.show .modal-box { transform:scale(1); }
.modal-close { float:right; background:none; border:none; color:var(--text2); font-size:22px; cursor:pointer; line-height:1; }
.modal-close:hover { color:var(--text); }
.post-form label { display:block; font-size:13px; color:var(--text2); margin-bottom:6px; margin-top:16px; }
.post-form textarea {
  width:100%; min-height:100px; background:var(--surface2); border:1px solid var(--border);
  border-radius:8px; color:var(--text); padding:12px; font-size:14px; resize:vertical; font-family:inherit;
}
.post-form textarea:focus { outline:none; border-color:var(--accent); }
.char-count { text-align:right; font-size:11px; color:var(--text2); margin-top:4px; }
.post-form input[type="text"] {
  width:100%; background:var(--surface2); border:1px solid var(--border);
  border-radius:8px; color:var(--text); padding:10px 12px; font-size:14px;
}
.post-form input:focus { outline:none; border-color:var(--accent); }
.theme-picker { display:flex; flex-wrap:wrap; gap:8px; }
.theme-pick {
  padding:6px 12px; border-radius:16px; font-size:12px; border:2px solid transparent;
  cursor:pointer; color:#fff; font-weight:500; opacity:.5; transition:all .15s;
}
.theme-pick.selected { opacity:1; box-shadow:0 0 0 2px rgba(255,255,255,.3); }
.file-area {
  border:2px dashed var(--border); border-radius:8px; padding:20px; text-align:center;
  color:var(--text2); cursor:pointer; font-size:13px; transition:border-color .2s;
}
.file-area:hover { border-color:var(--accent); }
.file-area input { display:none; }
.file-preview { margin-top:10px; max-width:100%; border-radius:8px; max-height:200px; }
.submit-btn {
  width:100%; margin-top:20px; padding:12px; background:var(--accent); color:#fff;
  border:none; border-radius:10px; font-size:15px; font-weight:600; cursor:pointer; transition:opacity .2s;
}
.submit-btn:hover { opacity:.9; }
.submit-btn:disabled { opacity:.5; cursor:not-allowed; }
.detail-modal .modal-box { max-width:560px; }
.detail-media {
  width:100%; border-radius:12px; margin:12px 0; max-height:60vh;
  object-fit:contain; background:#000; cursor:zoom-in;
}
.detail-text { font-size:16px; line-height:1.7; margin:12px 0; word-break:break-word; }
.detail-header { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.detail-name { font-size:14px; font-weight:600; }
.detail-time { font-size:12px; color:var(--text2); }
.detail-actions { display:flex; align-items:center; gap:16px; margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }
.heart-btn {
  display:flex; align-items:center; gap:6px; background:none; border:1px solid var(--border);
  color:var(--text2); padding:8px 16px; border-radius:20px; cursor:pointer; font-size:14px; transition:all .2s;
}
.heart-btn:hover { border-color:#ef4444; color:#ef4444; }
.heart-btn.liked { border-color:#ef4444; color:#ef4444; background:rgba(239,68,68,.1); }
.img-lightbox {
  position:fixed; inset:0; background:rgba(0,0,0,.9); z-index:300;
  display:flex; align-items:center; justify-content:center; cursor:zoom-out;
}
.img-lightbox img { max-width:95vw; max-height:95vh; border-radius:8px; }
.toast {
  position:fixed; top:70px; left:50%; transform:translateX(-50%);
  background:var(--surface2); border:1px solid var(--border); color:var(--text);
  padding:10px 20px; border-radius:20px; font-size:14px; z-index:400;
  opacity:0; transition:opacity .3s; pointer-events:none;
}
.toast.show { opacity:1; }

/* 顶栏按钮组 */
.header-actions { display:flex; align-items:center; gap:8px; }
.btn-ghost {
  background:var(--surface); color:var(--text2); border:1px solid var(--border);
  padding:7px 14px; border-radius:20px; font-size:13px; cursor:pointer;
  transition:all .2s; white-space:nowrap;
}
.btn-ghost:hover { border-color:var(--text2); color:var(--text); }
.btn-ghost.checked { background:rgba(245,158,11,.15); border-color:#f59e0b; color:#f59e0b; }
@media (max-width:600px){ .btn-ghost { padding:6px 10px; font-size:12px; } }

/* 每日话题横幅 */
.topic-banner {
  display:flex; align-items:center; gap:12px;
  max-width:1200px; margin:14px auto 0; padding:10px 20px;
  background:linear-gradient(90deg, rgba(217,70,239,.12), rgba(99,102,241,.12));
  border:1px solid rgba(217,70,239,.3); border-radius:12px; font-size:14px;
}
.topic-label {
  flex-shrink:0; background:linear-gradient(135deg,#d946ef,#6366f1);
  color:#fff; padding:3px 10px; border-radius:10px; font-size:12px; font-weight:600;
}
.topic-text { flex:1; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.topic-join {
  flex-shrink:0; background:none; border:1px solid #d946ef; color:#d946ef;
  padding:4px 14px; border-radius:14px; font-size:12px; cursor:pointer; transition:all .2s;
}
.topic-join:hover { background:#d946ef; color:#fff; }
.topic-hint {
  margin-top:14px; padding:8px 12px; font-size:13px;
  background:rgba(217,70,239,.1); border-radius:8px; color:var(--text);
  display:flex; align-items:center; gap:8px;
}
.topic-cancel { margin-left:auto; background:none; border:none; color:var(--text2); font-size:12px; cursor:pointer; text-decoration:underline; }
.detail-topic-tag {
  display:inline-block; margin:6px 0; padding:3px 10px; border-radius:10px;
  font-size:12px; background:rgba(217,70,239,.15); color:#d946ef;
}

/* 评论区 */
.comments-section { margin-top:18px; border-top:1px solid var(--border); padding-top:14px; }
.comments-title { font-size:14px; font-weight:600; margin-bottom:10px; }
.comments-list { max-height:280px; overflow-y:auto; margin-bottom:12px; }
.comment-item { padding:8px 0; border-bottom:1px solid var(--border); font-size:13px; line-height:1.6; }
.comment-item:last-child { border-bottom:none; }
.comment-item .c-name { font-weight:600; color:var(--accent); margin-right:8px; }
.comment-item .c-time { color:var(--text2); font-size:11px; margin-left:8px; }
.comment-empty { color:var(--text2); font-size:13px; text-align:center; padding:16px 0; }
.comment-form input[type="text"] {
  width:100%; background:var(--surface2); border:1px solid var(--border);
  border-radius:8px; color:var(--text); padding:9px 12px; font-size:13px; margin-bottom:8px;
}
.comment-form input:focus { outline:none; border-color:var(--accent); }
.comment-input-row { display:flex; gap:8px; }
.comment-input-row input { flex:1; margin-bottom:0 !important; }
.comment-send {
  flex-shrink:0; background:var(--accent); color:#fff; border:none;
  padding:0 18px; border-radius:8px; font-size:13px; cursor:pointer;
}
.comment-send:hover { opacity:.9; }

/* 热门榜 */
.hot-list { margin-top:16px; }
.hot-item {
  display:flex; gap:12px; padding:12px; border-radius:10px; cursor:pointer;
  transition:background .15s; align-items:flex-start;
}
.hot-item:hover { background:var(--surface2); }
.hot-rank {
  flex-shrink:0; width:24px; height:24px; border-radius:6px; display:flex;
  align-items:center; justify-content:center; font-size:13px; font-weight:700;
  background:var(--surface2); color:var(--text2);
}
.hot-item:nth-child(1) .hot-rank { background:#ef4444; color:#fff; }
.hot-item:nth-child(2) .hot-rank { background:#f97316; color:#fff; }
.hot-item:nth-child(3) .hot-rank { background:#f59e0b; color:#fff; }
.hot-body { flex:1; min-width:0; }
.hot-text { font-size:14px; line-height:1.5; margin-bottom:4px; word-break:break-word; }
.hot-meta { font-size:12px; color:var(--text2); display:flex; gap:10px; align-items:center; }
.hot-empty { text-align:center; color:var(--text2); padding:40px 0; font-size:14px; }


/* 随手记 · 2026 autumn editorial */
:root{--bg:#f7f8f3;--surface:#fff;--surface2:#f0f3ed;--border:#dfe5db;--text:#263c34;--text2:#6a786f;--accent:#236451;--radius:16px}
html{scroll-behavior:smooth;scroll-padding-top:100px}body{line-height:1.6}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #d58a43;outline-offset:4px}button:disabled{cursor:wait;opacity:.65}::selection{background:#d7e8cf}.page-width{max-width:1200px;margin-left:auto;margin-right:auto;padding-left:28px;padding-right:28px}.skip-link{position:fixed;top:-100px;left:16px;z-index:500;background:#fff;padding:12px}.skip-link:focus{top:10px}
.header{background:rgba(247,248,243,.96);border-bottom:1px solid var(--border);padding:0 28px}.header-top{height:91px;max-width:1144px;margin:0 auto;gap:24px}.brand{display:flex;align-items:center;gap:11px}.brand-icon{background:var(--accent);color:#fff;display:grid;place-items:center;width:42px;height:46px;border-radius:12px 12px 12px 2px;font:26px Georgia,'Songti SC',serif}.brand-name{font-size:23px;font-weight:750;letter-spacing:2px;white-space:nowrap}.brand-name small{display:block;font-size:10px;font-weight:400;letter-spacing:1px;color:var(--text2);line-height:1.3}.main-nav{display:flex;gap:30px;margin-right:auto;margin-left:36px;font-size:14px}.main-nav a:hover{color:var(--accent)}.header-actions{gap:10px}.btn-ghost{background:transparent;border-color:transparent;color:var(--text);padding:8px 12px}.btn-ghost:hover{background:#eaf0e5;border-color:transparent}.btn-post{background:var(--accent);padding:11px 22px;border-radius:8px;font-weight:500;font-size:14px;box-shadow:none}.btn-post:hover{transform:translateY(-2px);box-shadow:0 6px 18px #23645122}
.hero{max-width:1144px;height:420px;margin:26px auto 0;position:relative;border-radius:18px;overflow:hidden;background:#234e41;color:#fff}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,36,29,.83),rgba(12,36,29,.28) 63%,rgba(12,36,29,.06)),linear-gradient(0deg,rgba(12,36,29,.28),transparent 40%)}.hero-copy{position:relative;max-width:640px;padding:44px 52px}.eyebrow{font-size:10px;letter-spacing:2.6px;font-weight:600;color:#6b7b6e;margin-bottom:10px}.hero .eyebrow{color:#d1e5d6;font-size:10px;letter-spacing:3px}.hero h1{font:500 48px/1.28 Georgia,'Noto Serif SC','Songti SC','SimSun',serif;letter-spacing:2px;margin:16px 0}.hero-desc{font-size:14px;line-height:1.95;color:#edf3ea}.hero-actions{display:flex;gap:25px;align-items:center;margin-top:25px;font-size:13px}.hero-actions .btn-post{background:#eef4df;color:#254a39;font-weight:650}.hero-actions a{color:white}.hero-actions a span{margin-left:10px}.hero-caption{position:absolute;bottom:20px;right:26px;display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:11px;color:#eef4e8}.hero-caption span:first-child{font-size:8px;letter-spacing:2px}
.topic-banner{max-width:1144px;border-radius:10px;margin:18px auto 0;padding:14px 20px;border:1px solid #dfe6d7;background:#edf2e5;gap:16px}.topic-label{background:none;color:#466641;padding:0 16px 0 0;border-radius:0;border-right:1px solid #c9d6bf;font-size:12px}.topic-join{color:#365f44;border:0;font-size:13px;font-weight:600;padding:2px}.topic-join:hover{background:none;color:#142f23}.topic-text{font-size:14px}
.selected-section{padding-top:45px;padding-bottom:44px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:23px}.section-heading h2{font-size:25px;letter-spacing:.5px;font-weight:650;line-height:1.4}.section-heading .eyebrow{margin-bottom:5px}.section-heading>p{font-size:12px;color:var(--text2);padding-bottom:3px}.tiny-spark{font-size:22px;color:#b38b49;margin-left:13px;font-weight:400}.editorial-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.editorial-card{text-align:left;border:0;padding:0;background:transparent;color:var(--text);min-width:0}.editorial-photo{position:relative;overflow:hidden;border-radius:12px;aspect-ratio:1.26;background:#e2e9df}.editorial-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.editorial-card:hover img{transform:scale(1.045)}.editorial-tag{position:absolute;top:12px;left:12px;background:rgba(255,255,250,.92);border-radius:4px;font-size:10px;padding:3px 9px;color:#354e40}.photo-arrow{position:absolute;right:12px;bottom:12px;background:#ffffffed;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;font-size:16px}.editorial-copy{padding:15px 2px 0}.editorial-number{font-size:9px;letter-spacing:1px;color:#869080}.editorial-copy h3{font-size:16px;line-height:1.7;margin:5px 0 7px;font-weight:650}.editorial-copy p{font-size:12px;line-height:1.8;color:var(--text2);margin-bottom:12px}.read-link{font-size:11px;color:var(--accent);font-weight:600}.read-link span{margin-left:9px}
.live-section{padding-top:20px;padding-bottom:0;border-top:1px solid var(--border)}.live-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.live-heading h2{font-size:14px;font-weight:600;display:flex;gap:9px;align-items:center}.live-dot{display:inline-block;width:7px;height:7px;background:#559d69;border-radius:50%;box-shadow:0 0 0 4px #e7efdf}.text-button{background:transparent;border:0;color:var(--text2);font-size:11px;padding:8px}.danmaku-area{height:180px;border:1px solid #dfe6d9;border-radius:12px;background:#eff3e8}.danmaku-bg.show{opacity:.11}.danmaku-bg-mask{background:linear-gradient(90deg,#eff3e8aa,#f4f6f0c9)}.danmaku-area::after{height:25px;background:linear-gradient(transparent,#eff3e8)}.danmaku-item{font-size:13px;background:#fff!important;color:#3e5945!important;border:1px solid #dce5d4!important;box-shadow:0 2px 7px #30462b08;max-width:80vw}.danmaku-item .d-name{color:#6c826e}.danmaku-area.paused .danmaku-item{cursor:default}
.waterfall-section{padding:45px 28px 30px;scroll-margin-top:20px}.waterfall-title{font-size:13px;margin:22px 0 15px;color:#758071;font-weight:500}.waterfall-title::before{height:12px;width:3px;background:#91a984}.theme-bar{padding-bottom:10px;gap:8px;border-bottom:1px solid var(--border);scrollbar-width:thin}.theme-tag{border-color:transparent;background:transparent;font-size:12px;color:#69786a;border-radius:7px;padding:6px 14px}.theme-tag.active[data-theme="all"]{background:#236451;color:#fff}.theme-tag:hover{border-color:#b2c4aa;background:#edf2e7}.waterfall-grid{columns:4 220px;column-gap:18px}.card{box-shadow:0 2px 3px #243e2603;border:1px solid #e1e7dc;padding:20px;border-radius:12px;margin-bottom:18px}.card:hover{border-color:#a9bea1;box-shadow:0 8px 20px #294b2910}.card-text{font-size:13px;line-height:1.9;margin-bottom:17px}.card-footer{font-size:10px;gap:7px;flex-wrap:wrap}.card-meta{gap:8px}.card-theme-badge{font-size:10px;padding:2px 8px;border-radius:5px}.card-media{max-height:360px;border-radius:7px}.no-more{font-size:11px;padding:25px;color:#899180}.feed-loading,.feed-state{font-size:13px;color:#72806c;padding:25px 0;column-span:all}.site-footer{border-top:1px solid var(--border);padding-top:28px;padding-bottom:30px;display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:11px;color:#819079}.site-footer>div{display:flex;flex-direction:column;gap:3px}.footer-brand{font-size:18px;font-weight:700;color:#3a6048}.site-footer p{line-height:1.9}.site-footer a{white-space:nowrap;color:var(--accent)}
.modal-mask{background:#142a2266}.modal-box{box-shadow:0 20px 80px #142a2233}.modal-box h3{font-size:20px}.modal-close{padding:4px;min-width:28px}.detail-text{line-height:1.9}.file-area{background:#f0f3ed}.article-dialog{border:0;border-radius:16px;width:min(720px,calc(100% - 32px));max-height:90dvh;margin:auto;padding:0;background:var(--surface);color:var(--text);box-shadow:0 24px 100px #142a2266;overflow:auto}.article-dialog::backdrop{background:#132b246e;backdrop-filter:blur(6px)}.article-dialog>img{width:100%;max-height:340px;object-fit:cover;display:block}.article-close{position:absolute;right:14px;top:14px;background:#ffffffed;border:0;border-radius:50%;width:35px;height:35px;color:#2c4837;font-size:25px;line-height:1}.article-body{padding:30px 38px 36px}.article-body h2{font-size:27px;line-height:1.5;margin-bottom:15px}.article-intro{color:#6a7b68;border-left:2px solid #b6c9a6;padding-left:15px;font-size:14px;margin-bottom:25px}.article-body #articleContent p{font-size:14px;line-height:2.1;margin:18px 0}.article-credit{font-size:10px;color:#7b8974;margin:25px 0 20px}.toast{max-width:calc(100% - 24px);width:max-content;box-shadow:0 8px 30px #173b1b20}.post-form textarea,.post-form input[type=text],.comment-form input[type=text]{font-size:16px}
.editorial-card{display:block;align-self:start}
@media(min-width:1400px){.hero{height:450px}.hero-copy{padding-top:57px}}
@media(max-width:1199px){.hero,.topic-banner{margin-left:28px;margin-right:28px}.main-nav{margin-left:15px;gap:20px}}
@media(max-width:900px){.main-nav{display:none}.header-top{height:78px}.brand{margin-right:auto}.editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.editorial-photo{aspect-ratio:1.6}.hero{height:410px}.hero-copy{padding:42px 35px}.hero h1{font-size:43px}.waterfall-grid{columns:2 220px}.hero-caption{font-size:10px}}
@media(max-width:600px){html{scroll-padding-top:90px}.header{padding:0 16px}.header-top{height:74px;gap:5px}.brand-icon{width:33px;height:37px;font-size:22px;border-radius:9px 9px 9px 2px}.brand{gap:8px}.brand-name{font-size:20px;letter-spacing:1px}.brand-name small{font-size:8px;letter-spacing:0}.header-actions{gap:2px}.btn-ghost{padding:7px 6px;font-size:11px}.header .btn-post{padding:8px 10px;font-size:11px}.hero{margin:16px 16px 0;height:400px;border-radius:12px}.hero-copy{padding:34px 25px}.hero h1{font-size:35px;letter-spacing:1px;margin:22px 0 17px}.hero .eyebrow{font-size:8px;letter-spacing:2px}.hero-desc{font-size:12px;line-height:1.9}.hero-shade{background:linear-gradient(90deg,#102d25cc,#102d2555),linear-gradient(0deg,#102d2544,transparent)}.hero-photo{object-position:57% center}.hero-actions{gap:19px;margin-top:24px}.hero-actions .btn-post{font-size:12px;padding:11px 14px}.hero-actions a{font-size:11px}.hero-caption{bottom:16px;right:18px}.hero-caption span:last-child{display:none}.topic-banner{margin:12px 16px 0;padding:12px;gap:9px}.topic-label{font-size:10px;padding-right:9px}.topic-text{font-size:12px}.topic-join{font-size:11px}.page-width{padding-left:16px;padding-right:16px}.selected-section{padding-top:31px;padding-bottom:30px}.section-heading{gap:10px;margin-bottom:18px;align-items:start}.section-heading h2{font-size:21px}.section-heading>p{font-size:10px;max-width:110px;text-align:right;line-height:1.8;margin-top:20px}.eyebrow{font-size:8px;letter-spacing:1.5px}.tiny-spark{margin-left:7px;font-size:18px}.editorial-grid{gap:22px 14px}.editorial-photo{aspect-ratio:1.12;border-radius:9px}.editorial-tag{top:8px;left:8px;font-size:9px;padding:2px 6px}.photo-arrow{width:23px;height:23px;right:8px;bottom:8px}.editorial-copy{padding-top:11px}.editorial-copy h3{font-size:14px;line-height:1.7}.editorial-copy p{font-size:11px;line-height:1.8}.editorial-number{font-size:8px;letter-spacing:.3px}.read-link{font-size:10px}.live-section{padding-top:18px}.waterfall-section{padding:31px 16px 15px}.waterfall-grid{columns:2 145px;column-gap:12px}.card{padding:14px;margin-bottom:12px}.card-text{font-size:12px;line-height:1.85}.card-footer{gap:7px;font-size:9px}.card-meta{gap:6px;flex-wrap:wrap}.theme-tag{font-size:12px;padding:6px 13px}.site-footer{align-items:flex-start;flex-wrap:wrap;gap:15px;padding-top:23px;padding-bottom:25px;font-size:10px}.site-footer p{order:3;width:100%;font-size:9px}.site-footer a{margin-left:auto}.article-body{padding:25px 23px}.article-body h2{font-size:23px}.article-dialog>img{max-height:260px}.article-body #articleContent p{font-size:14px}.modal-mask{padding:12px}.modal-box{padding:22px;max-height:88dvh}.hero-actions .btn-post:hover{transform:none}}
@media(max-width:350px){.brand-name small{display:none}.header .btn-ghost{font-size:10px;padding:5px}.header .btn-post{font-size:10px;padding:7px}.hero h1{font-size:30px}.waterfall-grid{columns:1}.editorial-grid{grid-template-columns:1fr}.editorial-photo{aspect-ratio:1.6}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* A full-viewport post wall is the primary home experience. */
.header{position:absolute;inset:0 0 auto;z-index:100;background:linear-gradient(#0c181ee8,#0c181e66,transparent);border:0;color:#f3f6f4;padding:0 32px}
.header-top{height:82px;max-width:none;margin:0 auto}.brand-icon{background:#e5eddb;color:#234c3f}.brand-name small{color:#c0d1c6}.main-nav a:hover{color:#d8f2ba}.btn-ghost{color:#e0e9e3}.btn-ghost:hover{background:#ffffff15;color:white}.header .btn-post{background:#e4eedb;color:#294937}.header .btn-post:hover{box-shadow:0 4px 18px #0002}
.wall-stage{height:100vh;height:100svh;min-height:580px;position:relative;isolation:isolate;overflow:hidden;background:#101e26;color:#eaf3ef}
.wall-stage .danmaku-area{position:absolute;inset:0;height:100%;width:100%;border:0;border-radius:0;background:#101e26;overflow:hidden}
.wall-stage .danmaku-bg{opacity:.19;transition:background-image 1.5s ease;background-position:center;background-size:cover;filter:saturate(.6)}.wall-stage .danmaku-bg.show{opacity:.19}
.wall-stage .danmaku-bg-mask{z-index:1;background:linear-gradient(180deg,#0b171dd9 0%,#0b171d66 26%,#0b171d88 70%,#0b171df2),linear-gradient(90deg,#10222b77,transparent 30%,transparent 70%,#10222b77)}
.wall-stage .danmaku-area::after{z-index:7;height:70px;background:linear-gradient(transparent,#0d1a22);pointer-events:none}
.wall-intro{position:absolute;z-index:8;top:102px;left:4.5%;pointer-events:none;display:flex;align-items:flex-end;gap:26px}.wall-intro .eyebrow{font-size:9px;letter-spacing:3px;color:#b3c7b8;margin-bottom:5px}.wall-intro h1{font-size:28px;font-weight:550;line-height:1.4;letter-spacing:2px}.wall-intro p.wall-help{font-size:11px;color:#b2c6bf;padding-bottom:5px;letter-spacing:.8px}.wall-intro .live-dot{background:#c2e6aa;box-shadow:0 0 0 4px #c2e6aa15;margin-right:9px;vertical-align:middle}
.wall-stage .wall-post{position:absolute;left:0;right:auto;z-index:4;display:flex;align-items:center;gap:12px;max-width:min(470px,75vw);width:max-content;height:57px;padding:8px 17px 8px 9px;border:1px solid #a9c8d52e!important;border-radius:100px!important;background:linear-gradient(100deg,#243c47ed,#1c303ee8)!important;box-shadow:0 4px 20px #00000020;color:#f0f6f3!important;white-space:nowrap;text-align:left;cursor:pointer;transition:border-color .2s,background .2s;overflow:hidden;will-change:transform;backdrop-filter:blur(12px);font:14px/1.4 inherit}
.wall-stage .wall-post:nth-of-type(3n){background:linear-gradient(100deg,#354339ed,#26362ee8)!important;border-color:#b8d8a72e!important}.wall-stage .wall-post:nth-of-type(5n){background:linear-gradient(100deg,#413747ed,#30283de8)!important;border-color:#c4aed52e!important}.wall-stage .wall-post:hover{transform:none;border-color:#c2e6aaa0!important;z-index:6!important;background:#385449f5!important;box-shadow:0 4px 24px #0004}.wall-stage .wall-post:focus-visible{outline:2px solid #d5eab9;outline-offset:3px;z-index:6!important}
.wall-avatar{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--post-color) 18%,#3b5357);color:#e0eadc;font-size:22px;overflow:hidden}.wall-avatar img{width:100%;height:100%;object-fit:cover}.wall-copy{display:flex;flex-direction:column;min-width:0;gap:2px}.wall-meta{font-size:9px;color:#bbccc5;letter-spacing:.3px;line-height:1.4}.wall-text{font-size:13px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wall-arrow{flex-shrink:0;color:#d1decf;font-size:15px;opacity:.65;margin-left:3px}
.wall-toolbar{position:absolute;z-index:8;left:4.5%;right:4.5%;bottom:26px;display:flex;align-items:center;justify-content:space-between;gap:20px}.wall-status{font-size:10px;letter-spacing:1px;color:#a3bdb2;max-width:40%}.wall-actions{display:flex;gap:12px;align-items:center}.wall-actions .btn-post{background:#e4eedb;color:#244332;border-radius:100px;padding:11px 24px;font-size:12px}.wall-actions .text-button{border:1px solid #91abae4d;border-radius:100px;color:#d2dfd7;font-size:11px;padding:9px 17px;background:#182b3480}.wall-browse{font-size:11px;color:#b8cfc4;letter-spacing:1px;white-space:nowrap}.wall-browse span{display:inline-block;margin-left:8px}.topic-banner{margin-top:24px}.selected-section{padding-top:38px}.section-heading .eyebrow{color:#6b7b6e}
@media(max-width:900px){.header-top{height:76px}.wall-intro{top:99px}.wall-intro h1{font-size:25px}.wall-intro{gap:18px}.wall-stage .wall-post{max-width:min(430px,78vw)}}
@media(max-width:600px){.header{padding:0 16px}.header-top{height:72px}.wall-stage{min-height:560px}.wall-intro{top:93px;left:20px;right:20px;display:block}.wall-intro h1{font-size:23px;letter-spacing:1px}.wall-intro .eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:5px}.wall-intro p.wall-help{margin-top:7px;font-size:10px}.wall-stage .wall-post{height:53px;max-width:82vw;gap:9px;padding:6px 12px 6px 7px}.wall-avatar{width:35px;height:35px;font-size:20px}.wall-text{font-size:12px}.wall-meta{font-size:8px}.wall-toolbar{bottom:22px;left:20px;right:20px;flex-wrap:wrap;gap:12px}.wall-status{font-size:9px;max-width:100%;width:100%}.wall-actions{gap:8px}.wall-actions .btn-post{font-size:11px;padding:9px 17px}.wall-actions .text-button{font-size:10px;padding:8px 12px}.wall-browse{font-size:10px}.wall-browse span{margin-left:4px}.topic-banner{margin-top:18px}.selected-section{padding-top:29px}}
@media(prefers-reduced-motion:reduce){.wall-stage .wall-post{transition:none;will-change:auto}}

/* Compact wall entries; moving items continue linking to their original posts. */
.wall-stage .wall-post{height:46px;max-width:min(350px,70vw);gap:8px;padding:5px 12px 5px 7px}.wall-stage .wall-avatar{width:30px;height:30px;font-size:18px}.wall-stage .wall-copy{gap:0}.wall-stage .wall-meta{font-size:9px}.wall-stage .wall-text{font-size:12px}.wall-stage .wall-arrow{font-size:13px}
