:root { --sidebar-width: 238px; }

.sidebar .logo.logo-banner { width:160px; min-height:58px; margin-top:-8px; margin-bottom:22px; }
.sidebar .logo.logo-banner img { width:160px; height:auto; max-height:66px; border-radius:0; object-fit:contain; object-position:left center; }

.app-shell {
  display: flex;
  height: 100%;
  min-width: 0;
  background: #080c12;
}

/* 2026-09 information architecture: discovery starts from one garment. */
.top-actions { position: fixed; z-index: 60; }
.player-main.discover-mode .stage,.player-main.wardrobe-mode .stage,
.player-main.discover-mode .stage-shade,.player-main.wardrobe-mode .stage-shade,
.player-main.discover-mode .stage-background,.player-main.wardrobe-mode .stage-background,
.player-main.discover-mode .updates-float,.player-main.wardrobe-mode .updates-float,
.player-main.discover-mode .top-player-controls,.player-main.wardrobe-mode .top-player-controls,
.player-main.discover-mode .swipe-hint,.player-main.wardrobe-mode .swipe-hint { display:none; }
.player-main.wardrobe-mode .creator-search-panel,.player-main.wardrobe-mode .room-view-tools { display:none; }
.discover-page-inner { width:min(1080px,calc(100% - 48px)); padding:86px 8px 72px; }
.today-start { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,420px); gap:clamp(34px,7vw,90px); align-items:center; min-height:500px; }
.today-copy>span,.discover-inspiration header small,.wardrobe-page-inner header small { color:#ff8b79; font-size:10px; font-weight:800; letter-spacing:.18em; }
.today-copy h1,.wardrobe-page-inner h1 { margin:16px 0 18px; color:#f7f9fb; font-size:clamp(40px,5vw,68px); line-height:1.02; letter-spacing:-.055em; }
.today-copy p { max-width:470px; margin:0; color:#8997a5; font-size:15px; line-height:1.8; }
.today-pick { padding:14px; border:1px solid #ffffff1c; border-radius:24px; background:#111a24; box-shadow:0 30px 80px #02070d99; }
.today-preview { display:grid; place-items:center; align-content:center; height:310px; overflow:hidden; border:1px dashed #ffffff30; border-radius:17px; background:linear-gradient(150deg,#1a2733,#0b1118); color:#e9eef2; }
.today-preview>span { font-size:36px; font-weight:200; }.today-preview>b{margin-top:14px;font-size:16px}.today-preview>small{margin-top:7px;color:#718090}.today-preview img{width:100%;height:230px;object-fit:cover}.today-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.today-actions button,.discover-context button,.wardrobe-page-inner header button{min-height:42px;border:1px solid #ffffff20;border-radius:12px;background:#182431;color:#dfe6ec;font-weight:700;cursor:pointer}.today-actions button:first-child{background:#ff7966;color:#fff;border-color:#ff7966}
.discover-context { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; margin-top:18px; padding:12px; border-block:1px solid #ffffff14; }.discover-context>div{display:grid;gap:5px;padding:8px 12px}.discover-context small{color:#687787;font-size:10px}.discover-context b{color:#dce3e9;font-size:12px}.discover-context>button{padding:0 16px;background:transparent}
.discover-inspiration{margin-top:54px}.discover-inspiration header{display:flex;align-items:end;justify-content:space-between}.discover-inspiration h2{margin:8px 0 0;color:#f2f5f7;font-size:26px}.discover-inspiration header>span{color:#687787;font-size:11px}.inspiration-empty{display:grid;place-items:center;min-height:190px;margin-top:18px;border-top:1px solid #ffffff16;color:#718090;text-align:center;line-height:1.7}.inspiration-empty i{width:48px;height:48px;margin-top:24px;border:1px solid #ffffff22;border-radius:50%;background:radial-gradient(circle,#ff796633,transparent 68%)}
.wardrobe-page{position:absolute;inset:0;z-index:9;overflow-y:auto;background:#090e14}.wardrobe-page-inner{width:min(1080px,calc(100% - 48px));margin:0 auto;padding:92px 8px 72px}.wardrobe-page-inner>header{display:flex;align-items:end;justify-content:space-between}.wardrobe-page-inner h1{font-size:46px}.wardrobe-page-inner header button{padding:0 18px;background:#ff7966;border-color:#ff7966;color:#fff}.wardrobe-filter{display:flex;gap:8px;margin:34px 0 20px}.wardrobe-filter button{padding:8px 14px;border:1px solid #ffffff18;border-radius:999px;background:transparent;color:#7f8d9a}.wardrobe-filter button.active{background:#edf1f4;color:#111820}.wardrobe-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}.wardrobe-items article{display:grid;gap:5px;padding:12px;border:1px solid #ffffff14;border-radius:16px;background:#111a24}.wardrobe-swatch{height:170px;border-radius:11px;background:linear-gradient(145deg,#263442,#131c26)}.wardrobe-items small,.wardrobe-items span{color:#718090;font-size:10px}.wardrobe-items b{color:#e7edf1;font-size:13px}.wardrobe-empty{grid-column:1/-1;display:grid;gap:8px;place-items:center;min-height:240px;border:1px dashed #ffffff1c;border-radius:18px;color:#718090}.wardrobe-empty b{color:#e6ebef;font-size:18px}
.app-shell.content-page .creator-heading,.app-shell.content-page .creator-list { display:none; }
@media (max-width:700px){
  .sidebar nav { grid-template-columns:repeat(4,1fr); gap:4px; }
  .sidebar .nav-item { gap:3px; padding:6px 4px; font-size:11px; }
  .today-start { grid-template-columns:1fr; gap:26px; min-height:0; }
  .discover-page-inner,.wardrobe-page-inner { width:100%; padding:78px 16px 90px; }
  .today-copy h1 { font-size:38px; }.today-copy p{font-size:13px}.today-preview{height:220px}.today-actions{grid-template-columns:1fr 1fr}.today-actions button:last-child{grid-column:1/-1}.discover-context{grid-template-columns:1fr 1fr}.discover-context>button{grid-column:1/-1}.discover-inspiration header{align-items:start;flex-direction:column;gap:8px}.wardrobe-page-inner>header{align-items:start;flex-direction:column;gap:18px}.wardrobe-page-inner h1{font-size:36px}.wardrobe-filter{overflow-x:auto}.wardrobe-items{grid-template-columns:repeat(2,minmax(0,1fr))}.wardrobe-swatch{height:130px}
}

/* Following player: search fills the header; viewing controls belong to the stage. */
@media (min-width:701px){
  .player-main.following-mode .creator-search-panel { right:300px; width:auto; }
  .player-main.following-mode .room-view-tools { display:flex; top:84px; left:358px; }
  .player-main.following-mode .asset-command-tools { top:128px; left:358px; }
  .player-main.following-mode .room-settings-panel { top:126px; left:358px; }
  .player-main.following-mode:not(.room-view-portrait) .stage-background,
  .player-main.following-mode:not(.room-view-portrait) .stage-shade,
  .player-main.following-mode:not(.room-view-portrait) .stage {
    inset:72px 0 0 340px;
    width:auto;
    height:auto;
    aspect-ratio:auto;
    transform:none;
    border-radius:0;
  }
  .player-main.following-mode:not(.room-view-portrait)::after { display:none; }
  .player-main.following-mode.room-view-portrait .stage-background,
  .player-main.following-mode.room-view-portrait .stage-shade,
  .player-main.following-mode.room-view-portrait .stage {
    inset:calc(50% + 36px) 20px auto auto;
    width:min(calc(100% - 380px),calc((100dvh - 112px) * .5625));
    transform:translateY(-50%);
  }
  .player-main.following-mode.room-view-portrait::after {
    top:calc(50% + 36px);
    right:20px;
    left:auto;
    width:min(calc(100% - 380px),calc((100dvh - 112px) * .5625));
    transform:translateY(-50%);
  }
}

/* Following playback controls: keep the stage quiet and put play at its focal point. */
.player-main.following-mode .room-view-tools { display:flex; }
.player-main.following-mode .player-avatar,
.player-main.following-mode .top-background-toggle,
.player-main.following-mode .top-player-scale-toggle,
.player-main.following-mode .top-playback-settings { display:none; }
.player-main.following-mode #room-settings-toggle { display:none; }
.player-main.following-mode .stage>.top-play { position:absolute; z-index:12; top:50%; left:50%; width:58px; height:58px; transform:translate(-50%,-50%); opacity:.9; }
.player-main.following-mode .stage>.top-play:hover { opacity:1; transform:translate(-50%,-50%) scale(1.04); }
@media (max-width:700px){
  .player-main.following-mode .room-view-tools { top:76px; left:10px; }
  .player-main.following-mode .stage>.top-play { width:52px; height:52px; }
}
.sidebar {
  position: relative;
  width: var(--sidebar-width);
  min-width: var(--sidebar-width);
  z-index: 20;
  transition: width .24s ease, min-width .24s ease, padding .24s ease, border-color .24s ease;
}
.app-shell.sidebar-closed .sidebar {
  width: 0;
  min-width: 0;
  padding-left: 0;
  padding-right: 0;
  border-color: transparent;
  overflow: hidden;
}
.sidebar-collapse {
  position: absolute;
  top: 24px;
  right: 12px;
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #192534;
  color: #aeb8c4;
  cursor: pointer;
  font-size: 21px;
  z-index: 2;
}
.sidebar-expand {
  position: absolute;
  left: 16px;
  top: 18px;
  z-index: 70;
  width: 34px;
  height: 34px;
  border: 1px solid #ffffff29;
  border-radius: 11px;
  background: #0d141dc9;
  color: #fff;
  font-size: 23px;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  backdrop-filter: blur(12px);
  transition: opacity .18s;
}
.app-shell.sidebar-closed .sidebar-expand { opacity: 1; pointer-events: auto; }
.app-shell.sidebar-closed .player-main.following-mode .creator-search-panel { left: 66px; }
.app-shell.sidebar-closed .updates-float { opacity: 1; transform: none; pointer-events: auto; }
.mobile-following-panel { display: none; }

.player-main {
  position: relative;
  flex: 1;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #05080d;
}

/* 关注页是稳定的三列浏览路径：博主列表 / 更新列表 / 竖屏播放。 */
.player-main.following-mode {
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  place-items: stretch;
}
.creator-search-panel {
  position: absolute;
  z-index: 40;
  top: 0;
  right: auto;
  left: 0;
  width: min(520px, calc(100% - 190px));
  padding: 12px 18px;
  background: transparent;
  border-bottom: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.creator-search-inputs { display: block; }
.creator-search-field { position: relative; display: flex; align-items: center; width: 100%; height: 48px; padding: 0 52px 0 50px; border: 1px solid #ffffff26; border-radius: 14px; background: #111a24; }
.creator-search-panel .face-discover-upload {
  position: absolute; left: 7px; top: 7px; display: grid; place-items: center; width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 10px; background: #ffffff0d;
}
.creator-search-panel .face-discover-upload span { color: #d6dee5; font-size: 24px; font-weight: 300; line-height: 1; }
.creator-search-panel .face-discover-preview {
  position: absolute; z-index: 2; left: 7px; top: 7px; width: 34px; height: 34px; margin: 0;
}
.creator-search-panel .face-discover-preview img { width: 100%; height: 100%; max-height: none; border-radius: 9px; object-fit: cover; }
.creator-search-panel .face-discover-preview button { top: -6px; right: -6px; width: 17px; height: 17px; }
.creator-search-panel .discover-chips { display: none; }
.creator-search-panel .discover-chip { padding: 4px 9px 4px 6px; font-size: 10px; }
.creator-search-panel textarea {
  width: 100%;
  height: 42px;
  min-height: 42px;
  resize: none;
  padding: 11px 4px;
  border: 0;
  border-radius: 0;
  outline: none;
  background: #111a24;
  color: #f3f6f8;
  font-size: 12px;
  line-height: 1.55;
}
.creator-search-panel textarea:focus { box-shadow: none; }
.creator-search-field:focus-within { border-color: #ff7966; box-shadow: 0 0 0 3px #ff6b551f; }
.creator-search-panel textarea::placeholder { color: #687686; }
.creator-search-panel #creator-lookup-submit { position: absolute; right: 7px; top: 7px; display: grid; place-items: center; width: 34px; height: 34px; padding: 8px; border: 0; border-radius: 10px; background: #ff7966; color: #fff; cursor: pointer; }
.creator-search-panel #creator-lookup-submit svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.creator-search-results {
  position: absolute;
  top: calc(100% + 1px);
  right: 18px;
  left: 18px;
  max-height: calc(100dvh - 98px);
  overflow: auto;
  padding: 12px 14px 15px;
  border: 1px solid #ffffff22;
  border-radius: 16px;
  background: #0d1620f7;
  box-shadow: 0 24px 60px #000a;
}
.creator-search-results[hidden] { display: none; }
.creator-search-results-head { position: sticky; top: -12px; z-index: 3; display: flex; align-items: center; justify-content: space-between; padding: 8px 0 10px; background: #0d1620; }
.creator-search-results-head > span { display: inline-flex; align-items: center; gap: 6px; }
.creator-search-results-head b { font-size: 12px; }
.creator-search-results-head button { min-height: 30px; padding: 0 10px; border: 1px solid #ffffff24; border-radius: 9px; background: #182533; color: #b8c3cd; cursor: pointer; font-size: 10px; font-weight: 700; }
.creator-search-results.collapsed { max-height: 48px; overflow: hidden; padding-bottom: 8px; }
.creator-search-results.collapsed #creator-search-results-body { display: none; }
.player-main.discover-mode .creator-search-panel { display: none; }
.player-main.following-mode .updates-float {
  position: relative;
  inset: auto;
  z-index: 12;
  grid-column: 1;
  width: auto;
  max-height: none;
  height: calc(100% - 90px);
  margin: 72px 12px 18px 22px;
  padding: 20px 16px 18px;
  border: 1px solid #ffffff24;
  border-radius: 18px;
  background: #0c141ecc;
  box-shadow: 0 20px 60px #06101b66;
  backdrop-filter: blur(18px) saturate(130%);
}
.player-main.following-mode .updates-float > header {
  min-height: 42px;
  margin: 0 2px 16px;
}
.player-main.following-mode .updates-float > header > div {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.player-main.following-mode .updates-float > header small {
  overflow: hidden;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.player-main.following-mode .updates-float > header > .feed-filter-tabs { display:flex; align-items:center; gap:6px; }
.feed-filter-tabs button { min-height:30px; padding:0 11px; border:1px solid #ffffff20; border-radius:999px; background:#111c27; color:#8997a5; cursor:pointer; font-size:11px; font-weight:700; }
.feed-filter-tabs button:hover { border-color:#ffffff3b; color:#edf2f6; }
.feed-filter-tabs button.active { border-color:#ff796678; background:#ff79661c; color:#ff9585; }
.player-main.following-mode .updates-float > header { gap:8px; }
.player-main.following-mode .updates-float > header > #update-count { margin-left:auto; white-space:nowrap; }
.player-main.following-mode .feed {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  max-height: calc(100dvh - 144px);
  gap: 9px;
}
.player-main.following-mode .asset-card {
  display: flex;
  flex-direction: column;
  min-height: 0;
  aspect-ratio: 4 / 7;
}
.player-main.following-mode .asset-card .cover { flex: 1; height: auto; min-height: 0; }
.player-main.following-mode .asset-card .cover img,
.player-main.following-mode .asset-card .cover video { object-fit: contain; }
.player-main.following-mode .asset-card .asset-body { flex: none; height: 44px; padding: 7px 10px; }
.player-main.following-mode .asset-card .asset-meta { color: #e5ebf0; font-size: 11px; font-weight: 650; }
.player-main.following-mode .asset-card .asset-meta img,
.player-main.following-mode .asset-card .asset-meta .avatar-fallback { width: 26px; height: 26px; border-radius: 8px; }
.player-main.following-mode .asset-card.active { border-color: #ff8b797d; background: #202a35; box-shadow: inset 3px 0 #ff7966; }
.player-main.following-mode .asset-card.viewed { opacity: 1; }
.player-main.following-mode .asset-card.viewed .cover img { opacity: .62; }
.feed-load-more { grid-column: 1 / -1; width: 100%; min-height: 42px; border: 1px solid #ffffff22; border-radius: 12px; background: #15212d; color: #aeb9c4; cursor: pointer; font-size: 11px; font-weight: 700; }
.feed-load-more:hover { border-color: #ff79666b; color: #fff; }
.player-main.following-mode .stage-background,
.player-main.following-mode .stage-shade,
.player-main.following-mode .stage {
  inset: calc(50% + 36px) 20px auto auto;
  width: min(calc(100% - 380px), calc((100dvh - 112px) * .5625));
  height: auto;
  aspect-ratio: 9 / 16;
  transform: translateY(-50%);
  border-radius: 26px;
}
.player-main.following-mode::after {
  content: "";
  position: absolute;
  z-index: 7;
  top: calc(50% + 36px);
  right: 20px;
  width: min(calc(100% - 380px), calc((100dvh - 112px) * .5625));
  aspect-ratio: 9 / 16;
  transform: translateY(-50%);
  border: 6px solid #141a20;
  border-radius: 30px;
  box-shadow: 0 24px 70px #000a, inset 0 0 0 1px #ffffff1f;
  pointer-events: none;
}
.player-main.following-mode .room-view-tools,.player-main.following-mode .top-background-toggle { display: none; }
.player-main.following-mode .top-player-controls { right: 18px; }
.player-main.following-mode .top-actions { top: 86px; right: 18px; }
.stage-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}
.stage-background { filter:var(--room-filter,none); }
.stage-background-3dgs { object-fit: fill; pointer-events: none; }
.stage-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, #03070d38 0%, transparent 45%, #03070dbd 100%);
}
.stage {
  position: absolute;
  inset: 0;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: hidden;
  touch-action: pan-y;
}
.stage::after { display: none; }
#player {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  cursor: ew-resize;
}
.original-video-player,.original-gallery { position:absolute; inset:0; z-index:3; width:100%; height:100%; }
.original-video-player { object-fit:contain; background:#020509; cursor:ew-resize; transform-origin:50% 50%; }
.video-download-speed { position:absolute; z-index:6; top:18px; left:50%; min-width:158px; padding:10px 14px; transform:translateX(-50%); border:1px solid #ffffff2b; border-radius:11px; background:#07111bd9; color:#f3f6f8; box-shadow:0 12px 34px #0008; font:700 13px/1 monospace; text-align:center; pointer-events:none; backdrop-filter:blur(10px); }
.video-download-speed[hidden] { display:none; }
.original-video-player.scrubbing { cursor:grabbing; }
.original-gallery { display:grid; place-items:center; background:#020509; touch-action:pan-y; }
.original-gallery[hidden],.original-video-player[hidden] { display:none; }
.original-gallery img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; object-position:center center; user-select:none; -webkit-user-drag:none; transform-origin:50% 50%; }
.gallery-download-progress { position:absolute; z-index:2; left:50%; top:50%; min-width:132px; padding:11px 16px; transform:translate(-50%,-50%); border:1px solid #ffffff2b; border-radius:11px; background:#07111bd9; color:#f3f6f8; box-shadow:0 12px 34px #0008; font:700 13px/1 monospace; text-align:center; pointer-events:none; backdrop-filter:blur(10px); }
.gallery-download-progress[hidden] { display:none; }
.original-gallery button { position:absolute; top:50%; width:24px; height:64px; padding:0; transform:translateY(-50%); border:1px solid #ffffff1f; border-radius:8px; background:#07111b8f; color:#eef3f7; font-size:25px; line-height:1; cursor:pointer; backdrop-filter:blur(8px); }
.original-gallery button:active { transform:translateY(-50%) scale(.97); }
.original-gallery #gallery-prev { left:7px; }.original-gallery #gallery-next { right:7px; }
.original-gallery #gallery-count { position:absolute; right:18px; bottom:18px; padding:6px 10px; border-radius:999px; background:#07111bcc; color:#dce5ec; font:700 11px/1 monospace; }
.stage.scrubbing #player { cursor: grabbing; }
.player-main.subject-placing .stage { cursor: crosshair; }
.player-main.subject-placing #player { cursor: crosshair; }
.player-main.room-view-portrait .stage-background,
.player-main.room-view-portrait .stage-shade,
.player-main.room-view-portrait .stage {
  inset: 50% auto auto 50%;
  width: min(calc(100% - 40px), calc((100dvh - 40px) * .5625));
  height: auto;
  aspect-ratio: 9 / 16;
  transform: translate(-50%,-50%);
  border-radius: 34px;
}
.player-main.room-view-portrait::after {
  content:"";
  position:absolute;
  z-index:7;
  top:50%;
  left:50%;
  width:min(calc(100% - 40px),calc((100dvh - 40px) * .5625));
  aspect-ratio:9 / 16;
  transform:translate(-50%,-50%);
  border:7px solid #141a20;
  border-radius:38px;
  background:radial-gradient(ellipse 58px 12px at 50% 5px,#141a20 98%,transparent 100%);
  box-shadow:0 24px 70px #000a,inset 0 0 0 1px #ffffff1f;
  pointer-events:none;
}
#player-empty {
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: center;
  color: #b4bfca;
}
#player-empty b { font-size: 18px; color: #fff; }
#player-empty span { font-size: 12px; }
.room-3dgs-progress { position:absolute; z-index:9; left:22px; bottom:20px; width:176px; padding:9px 11px 10px; border:1px solid #ffffff24; border-radius:9px; background:#081019d9; box-shadow:0 8px 24px #0008; backdrop-filter:blur(10px); transition:opacity .3s,transform .3s; }
.room-3dgs-progress.hidden { display:none; }
.room-3dgs-progress>span { color:#c4ced8; font-size:10px; }
.room-3dgs-progress>b { float:right; color:#fff; font:700 10px/1 "SFMono-Regular",monospace; }
.room-3dgs-progress>i { display:block; clear:both; height:3px; margin-top:8px; overflow:hidden; border-radius:999px; background:#ffffff1c; }
.room-3dgs-progress>i>b { display:block; width:0; height:100%; border-radius:inherit; background:#ffd166; transition:width .14s ease; }
.room-3dgs-progress.complete { opacity:0; transform:translateY(5px); }

.updates-float {
  position: absolute;
  z-index: 8;
  top: 18px;
  left: 22px;
  width: min(470px, calc(100% - 44px));
  max-height: min(47vh, 440px);
  padding: 14px;
  border: 1px solid #ffffff24;
  border-radius: 18px;
  background: #0c141ed4;
  box-shadow: 0 20px 60px #06101b66;
  backdrop-filter: blur(18px) saturate(130%);
  overflow: hidden;
  transition: opacity .2s ease, transform .2s ease, max-height .2s ease;
}
.updates-float[hidden] { display: none; }
.updates-float > header { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 12px; }
.updates-float > header > div { display: flex; align-items: baseline; gap: 9px; }
.updates-float > header small { color: #fff; font-size: 13px; font-weight: 700; }
.updates-float > header strong { color: #8290a0; font-size: 10px; }
.updates-actions { display: flex; align-items: center; gap: 8px; }
.updates-actions > button { padding: 9px 12px; border: 1px solid #ffffff2e; border-radius: 11px; background: #ffffff0a; color: #e6ecf1; font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color .15s ease, color .15s ease, background .15s ease; }
.updates-actions > button:hover { border-color: #ff8877; color: #ff9b8d; background: #ff6b5514; }
.updates-actions > button:disabled { opacity: .55; cursor: default; }
.updates-float .live-pill { padding: 6px 9px; background: #111c28b8; border-color: #ffffff1d; color: #a9b5c2; }
.updates-float .live-pill b { font-size: 10px; font-weight: 600; }
.shadow-range input { width: 100%; accent-color: var(--coral); }
.background-picker { position: absolute; top: 0; right: 68px; width: 188px; padding: 10px; border: 1px solid #ffffff20; border-radius: 15px; background: #0d1721ed; box-shadow: 0 18px 50px #0008; backdrop-filter: blur(18px); }
.background-picker[hidden] { display: none; }
.background-picker header { display:flex; align-items:baseline; justify-content:space-between; padding:2px 3px 9px; }
.background-picker header b { color:#eef3f7; font-size:12px; }
.background-picker header span { color:#718091; font-size:8px; }
.background-picker-list { display:grid; grid-auto-rows:118px; gap:8px; max-height:min(64vh,520px); overflow-y:auto; padding-right:3px; scroll-snap-type:y mandatory; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#ffffff30 transparent; }
.background-thumb { position:relative; width:100%; height:118px; padding:0; overflow:hidden; border:1px solid #ffffff1c; border-radius:11px; background:#090d12; color:#fff; cursor:pointer; scroll-snap-align:start; }
.background-thumb img,.background-thumb video,.background-thumb i { display:block; width:100%; height:100%; object-fit:cover; }
.background-thumb i { background:#000; }
.background-thumb span { position:absolute; right:0; bottom:0; left:0; padding:22px 8px 7px; overflow:hidden; background:linear-gradient(transparent,#05080ddd); color:#e8edf1; font-size:9px; text-align:left; text-overflow:ellipsis; white-space:nowrap; }
.background-thumb.active { border-color:#ff8877; box-shadow:inset 0 0 0 2px #ff796672; }
.background-thumb:disabled { opacity:.34; filter:grayscale(1); cursor:not-allowed; box-shadow:none; }
.shadow-head, .shadow-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.shadow-head span, .shadow-row > label { color: #718091; font-size: 9px; }
.shadow-switch { padding: 6px 9px; border: 1px solid #ffffff20; border-radius: 8px; background: #172431; color: #aeb9c3; cursor: pointer; font-size: 10px; }
.shadow-switch.on { border-color: #ff79666b; background: #ff79661b; color: #ff9b8d; }
.shadow-switch:disabled { opacity: .45; cursor: not-allowed; }
.shadow-segment { display: grid; grid-template-columns: 1fr 1fr; width: 176px; padding: 2px; border: 1px solid #ffffff1d; border-radius: 9px; background: #0b131c; }
.shadow-segment button { min-height: 27px; border: 0; border-radius: 6px; background: transparent; color: #778696; cursor: pointer; font-size: 10px; }
.shadow-segment button.active { background: #263543; color: #fff; box-shadow: inset 0 0 0 1px #ffffff12; }
.shadow-segment button:disabled { opacity: .38; cursor: not-allowed; }
.shadow-range { display: grid; grid-template-columns: 96px 1fr; align-items: center; gap: 9px; color: #778697; font-size: 9px; }
.shadow-range span { display: flex; justify-content: space-between; gap: 6px; }
.shadow-range b { color: #b9c3cd; font: 9px/1 monospace; }
.creator-row { cursor: pointer; transition: background .18s ease, border-color .18s ease; }
.creator-row.selected { background: #ffffff12; border-color: #ffffff24; }
.creator-row.selected span b { color: #fff; }
@keyframes creator-avatar-breathe { 0%,100%{transform:scale(1);filter:drop-shadow(0 0 0 #ff796600)} 50%{transform:scale(1.08);filter:drop-shadow(0 0 8px #ff7966cc)} }
.creator-row.creator-attention>.avatar-wrap,.creator-row.creator-attention>img,.creator-row.creator-attention>.avatar-fallback{animation:creator-avatar-breathe 1.15s ease-in-out infinite;transform-origin:center}
.feed {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  max-height: calc(min(47vh, 440px) - 130px);
  overflow: auto;
  padding-right: 2px;
}
.feed::-webkit-scrollbar { width: 4px; }
.feed::-webkit-scrollbar-thumb { background: #ffffff2b; border-radius: 4px; }
.feed-top {
  position: absolute;
  z-index: 6;
  right: 13px;
  bottom: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px 7px 9px;
  border: 1px solid #ffffff2b;
  border-radius: 999px;
  background: #172431ee;
  color: #c6d0d9;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: 0 10px 26px #0008;
  backdrop-filter: blur(14px);
  transition: opacity .2s ease, transform .2s ease, background .18s ease;
}
.feed-top span { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: #ff79661f; color: #ff9b8d; font-size: 12px; }
.feed-top:hover { background: #22384a; color: #fff; transform: translateY(-1px); }
.feed-top:active { transform: translateY(0); }
.feed-top[hidden] { display: none; }
.asset-card { display: grid; grid-template-columns: 62px minmax(0, 1fr); min-height: 72px; border-color: #ffffff17; border-radius: 13px; background: #17222ed9; color: #fff; }
.asset-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px #0004; border-color: #ffffff35; }
.asset-card .cover { height: 100%; min-height: 72px; background: #0c1118; }
.asset-card .cover .play-badge { width: 28px; height: 28px; font-size: 10px; }
.asset-card.viewed { opacity: .62; }
.asset-card.viewed:hover { opacity: .9; }
.viewed-badge { position: absolute; top: 5px; right: 5px; z-index: 2; padding: 3px 5px; border-radius: 6px; background: #0a111bd9; color: #d7dee5; font-size: 8px; backdrop-filter: blur(5px); }
.asset-card .asset-body { min-width: 0; padding: 10px 9px; }
.asset-card .asset-body h3 { margin: 6px 0 3px; font-size: 12px; }
.asset-card .asset-body p { font-size: 9px; color: #8190a0; }
.asset-card .asset-meta { font-size: 9px; color: #aab5c1; }
.asset-card .asset-meta img, .asset-card .avatar-fallback { width: 18px; height: 18px; border-radius: 6px; }
.room-update-card .play-badge { width: 28px; height: 28px; padding: 0; border-radius: 50%; }
.room-update-card .room-background-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.room-update-card { border-color: #6fc9ff55; background: linear-gradient(135deg,#152b3b,#17222ed9); }
.room-update-card .cover video { width: 100%; height: 100%; object-fit: cover; }
.room-type-badge { position: absolute; left: 5px; top: 5px; z-index: 2; padding: 3px 6px; border-radius: 999px; background: #69c9ffeb; color: #07131c; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.original-type-badge { left:auto; right:5px; }
.asset-card:has(.original-type-badge) .viewed-badge { left:5px; right:auto; }
.room-update-empty { display: block; width: 100%; height: 100%; background: linear-gradient(135deg,#1b2936,#0a1119); }
.room-3dgs-badge { position:absolute; right:5px; top:5px; z-index:2; padding:3px 6px; border-radius:999px; background:#ffd166; color:#171109; font-size:8px; letter-spacing:.08em; }
.feed .empty { padding: 28px 12px; font-size: 12px; color: #8c99a8; }
.feed-skeleton { pointer-events:none; overflow:hidden; }
.feed-skeleton .cover,.feed-skeleton .asset-body i,.feed-skeleton .asset-body span {
  background:linear-gradient(90deg,#111b25 20%,#1c2935 45%,#111b25 70%);
  background-size:220% 100%;
  animation:feed-skeleton-pulse 1.25s ease-in-out infinite;
}
.feed-skeleton .asset-body { display:grid; align-content:center; gap:7px; }
.feed-skeleton .asset-body i { width:58%; height:9px; border-radius:5px; }
.feed-skeleton .asset-body span { width:38%; height:7px; border-radius:4px; }
@keyframes feed-skeleton-pulse { to { background-position:-220% 0; } }
@media (prefers-reduced-motion:reduce) { .feed-skeleton .cover,.feed-skeleton .asset-body i,.feed-skeleton .asset-body span { animation:none; } }

.background-controls {
  position: static;
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  border: 1px solid #ffffff24;
  border-radius: 12px;
  background: #0d151ed4;
  color: #c3ccd5;
  backdrop-filter: blur(16px);
  margin-bottom: 12px;
}
.top-player-controls { position: absolute; z-index: 10; top: 50%; right: 16px; width: 52px; transform: translateY(-50%); }
.player-main .top-player-controls { transition: opacity .2s ease, transform .2s ease; }
.player-main.player-controls-hidden .top-player-controls { opacity: 0; pointer-events: none; transform: translate(18px, -50%); }
.top-player-bar { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.player-progress-data { display: none; }
.player-avatar, .top-play, .top-mute, .top-background-toggle, .top-notif-toggle, .top-rematting-toggle, .top-player-scale-toggle, .top-comment-toggle, .top-playback-settings { width: 48px; height: 48px; display: grid; place-items: center; flex: none; padding: 0; border: 1px solid #ffffff2b; border-radius: 50%; background: #0d151ec9; color: #fff; box-shadow: 0 7px 24px #0006; backdrop-filter: blur(14px); cursor: pointer; }
.player-avatar { position: relative; overflow: hidden; background: #263442; }
.player-avatar img { display: none; width: 100%; height: 100%; object-fit: cover; }
.player-avatar.has-avatar img { display: block; }
.player-avatar.has-avatar span { display: none; }
.player-avatar span { color: #fff; font: 700 18px/1 sans-serif; }
.top-play { background: #f6f8fae8; color: #111923; font-size: 17px; }
.top-mute { color: #c8d2db; font-size: 16px; }
.top-mute.muted { background: #ff796622; color: #ff9b8d; }
.top-mute svg,.top-background-toggle svg,.top-notif-toggle svg,.top-rematting-toggle svg,.top-comment-toggle svg,.top-playback-settings svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.top-mute .mute-slash { stroke-width:2.2; }
.top-background-toggle { color: #c6d0d9; }
.top-player-controls.background-open .top-background-toggle { background: #ff796622; color: #ff9b8d; }
.top-notif-toggle { position: relative; color: #c6d0d9; }
.top-actions.notif-open .top-notif-toggle { background: #ff796622; color: #ff9b8d; }
.top-rematting-toggle { color: #c6d0d9; }
.top-rematting-toggle:hover { background: #ff796622; color: #ff9b8d; }
.top-rematting-toggle:disabled { opacity: 0.55; cursor: default; }
.top-player-scale-toggle { color: #c6d0d9; font: 750 13px/1 "SFMono-Regular", monospace; }
.top-player-scale-toggle:hover { background: #ff796622; color: #ff9b8d; }
.top-playback-settings { color:#c6d0d9; }
.top-playback-settings.active { border-color:#ff79666b; background:#ff796622; color:#ff9b8d; }
.top-comment-toggle { color:#c6d0d9; }
.top-comment-toggle.active { background:#ff796622; color:#ff9b8d; }
.comment-panel { position:fixed; z-index:32; top:50%; right:82px; width:min(390px,calc(100vw - 110px)); max-height:min(76dvh,700px); transform:translateY(-50%); display:grid; grid-template-rows:auto auto auto auto minmax(120px,1fr) auto; overflow:hidden; border:1px solid #ffffff24; border-radius:20px; background:#0d1721f2; color:#edf3f7; box-shadow:0 24px 80px #000a; backdrop-filter:blur(22px); }
.comment-panel[hidden] { display:none; }
.comment-panel > header { display:flex; align-items:center; justify-content:space-between; padding:16px 16px 12px; border-bottom:1px solid #ffffff14; }
.comment-panel > header small { display:block; color:#708091; font:700 9px/1 monospace; letter-spacing:.16em; }
.comment-panel > header b { display:block; margin-top:5px; font-size:16px; }
.comment-panel > header button { width:32px; height:32px; border:0; border-radius:10px; background:#ffffff0d; color:#aab6c2; font-size:22px; cursor:pointer; }
.comment-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:12px 14px 0; padding:4px; border-radius:12px; background:#071018; }
.comment-tabs button { min-height:34px; border:0; border-radius:9px; background:transparent; color:#718091; font-weight:700; cursor:pointer; }
.comment-tabs button.active { background:#223142; color:#fff; box-shadow:0 3px 12px #0005; }
.comment-visibility-note { margin:9px 16px 6px; color:#718091; font-size:11px; }
.original-note-text { max-height:170px; margin:12px 14px 0; padding:12px 13px 9px; overflow:auto; border:1px solid #ffffff12; border-radius:12px; background:#111d28; color:#dfe7ed; font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
.original-note-body { white-space:pre-wrap; }
.original-note-date { display:block; margin-top:10px; color:#718091; font:600 10px/1.3 monospace; text-align:right; }
.original-note-date[hidden] { display:none; }
.comment-list { min-height:140px; overflow:auto; display:grid; align-content:start; gap:10px; padding:8px 14px 14px; }
.comment-empty { padding:42px 12px; color:#667688; text-align:center; font-size:12px; }
.comment-item { display:grid; grid-template-columns:32px minmax(0,1fr); gap:9px; }
.comment-item.creator { padding-left:24px; }
.comment-item img,.comment-item .avatar-fallback { width:32px; height:32px; border-radius:10px; object-fit:cover; }
.comment-bubble { min-width:0; padding:9px 11px; border-radius:4px 13px 13px 13px; background:#192634; }
.comment-item.creator .comment-bubble { border-radius:13px 4px 13px 13px; background:#382a2b; }
.comment-bubble header { display:flex; justify-content:space-between; gap:8px; color:#8190a0; font-size:10px; }
.comment-bubble p { margin:5px 0 0; color:#e7edf2; font-size:13px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.comment-bubble audio { width:100%; height:32px; margin-top:7px; }
.comment-pin { color:#ff998b; }
.comment-compose { display:flex; align-items:flex-end; gap:8px; padding:12px 14px max(14px,env(safe-area-inset-bottom)); border-top:1px solid #ffffff14; background:#0a121a; }
.comment-compose textarea,.comment-hold { flex:1; min-width:0; }
.comment-compose textarea { width:100%; min-height:38px; max-height:96px; resize:none; border:1px solid #ffffff1c; border-radius:10px; padding:9px 11px; background:#111d28; color:#fff; outline:none; }
.comment-compose textarea:focus { border-color:#ff8a7966; }
.comment-mode,.comment-image,.comment-hold,.comment-send { height:38px; border:0; border-radius:10px; cursor:pointer; font-weight:700; }
.comment-mode { width:38px; border:1px solid #ffffff1c; border-radius:50%; background:transparent; color:#b8c2cb; font-size:17px; }
.comment-image { flex:none; width:38px; border:1px solid #ffffff1c; border-radius:50%; background:transparent; color:#b8c2cb; font-size:24px; line-height:1; }
.comment-image:disabled { opacity:.45; cursor:wait; }
.comment-message-image { display:block; width:min(240px,55vw); max-height:320px; margin-top:7px; border-radius:9px; object-fit:contain; background:#0a121a; }
.comment-hold { grid-column:2; width:100%; background:#1b2936; color:#e8edf2; touch-action:none; user-select:none; }
.comment-hold.recording { background:#672e32; color:#ffb0a6; animation:comment-pulse 1s infinite; }
.comment-send { background:#ff7966; color:#fff; }
.account #me-avatar { cursor:pointer; }
.account #me-avatar:focus-visible { outline:2px solid #ff8f7e; outline-offset:3px; }
@keyframes comment-pulse { 50% { opacity:.65; } }
.notif-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  z-index: 2;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  display: grid;
  place-items: center;
  border: 2px solid #0d151e;
  border-radius: 999px;
  background: #ff7966;
  color: #17110f;
  font: 700 9px/1 sans-serif;
}
.notif-badge[hidden] { display: none; }
.notif-panel {
  position: absolute;
  z-index: 30;
  /* 明确从右上角按钮行下方展开，避免被提醒/下载按钮压住 */
  top: 48px;
  right: 0;
  width: min(360px, calc(100vw - 32px));
  padding: 12px;
  border: 1px solid #ffffff20;
  border-radius: 15px;
  background: #0d1721ed;
  box-shadow: 0 18px 50px #0008;
  backdrop-filter: blur(18px);
}
.notif-panel[hidden] { display: none; }
.notif-panel > header { display: flex; align-items: center; justify-content: space-between; margin: 2px 3px 9px; }
.notif-panel > header b { color: #eef3f7; font-size: 12px; }
.notif-mark-all { padding: 4px 9px; border: 1px solid #ffffff20; border-radius: 8px; background: #172431; color: #aeb9c3; cursor: pointer; font-size: 9px; }
.notif-mark-all:hover { color: #ff9b8d; border-color: #ff79666b; }
.notif-mark-all:disabled { opacity: .45; cursor: not-allowed; }
.notif-list {
  display: grid;
  gap: 6px;
  max-height: min(56vh, 460px);
  overflow-y: auto;
  padding-right: 3px;
  scrollbar-width: thin;
  scrollbar-color: #ffffff30 transparent;
}
.notif-list::-webkit-scrollbar { width: 4px; }
.notif-list::-webkit-scrollbar-thumb { background: #ffffff2b; border-radius: 4px; }
.notif-empty { padding: 26px 10px; color: #718091; font-size: 11px; text-align: center; }
.notif-item {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  border: 1px solid #ffffff14;
  border-radius: 12px;
  background: #13202b;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.notif-item:hover { background: #182a38; border-color: #ffffff28; }
.notif-item.read { opacity: .58; }
.notif-item.read:hover { opacity: .85; }
.notif-item .notif-avatar, .notif-item .avatar-fallback { width: 28px; height: 28px; border-radius: 8px; object-fit: cover; }
.notif-item .notif-avatar { display: none; }
.notif-item.has-avatar .notif-avatar { display: block; }
.notif-item.has-avatar .avatar-fallback { display: none; }
.notif-item .notif-body { min-width: 0; }
.notif-item .notif-body b { display: block; overflow: hidden; color: #e8edf1; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.notif-item .notif-body small { display: block; margin-top: 3px; overflow: hidden; color: #8290a0; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.notif-item .notif-meta { display: grid; justify-items: end; gap: 5px; }
.notif-item .notif-meta time { color: #718091; font-size: 8px; white-space: nowrap; }
.notif-item .notif-meta i { width: 7px; height: 7px; border-radius: 50%; background: #ff7966; }
.notif-item.read .notif-meta i { background: transparent; border: 1px solid #44505d; }
.bg-top { position: absolute; right: 10px; bottom: 9px; z-index: 3; }
.background-controls button { width: 27px; height: 27px; padding: 0; border: 0; border-radius: 8px; color: #d6dee6; background: transparent; cursor: pointer; font-size: 18px; }
.background-controls button:hover { background: #ffffff16; }
#background-black { color: #050505; background: #fff; border: 1px solid #ffffff66; font-size: 14px; }
#background-name { min-width: 110px; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; font-size: 11px; }
#background-speed-wrap { display: flex; align-items: center; gap: 6px; padding-left: 7px; border-left: 1px solid #ffffff1d; color: #8794a2; font-size: 10px; }
#background-speed { width: 62px; accent-color: var(--coral); }
#background-speed-value { min-width: 22px; color: #c7d0d9; }
body.desktop-runtime .desktop-download-link { display: none !important; }
.room-view-tools { display:flex; position:absolute; z-index:19; top:18px; left:22px; padding:4px; border:1px solid #ffffff24; border-radius:12px; background:#0b131cce; box-shadow:0 8px 28px #0006; backdrop-filter:blur(16px) saturate(125%); transform:translateY(-10px); }
body.desktop-runtime .updates-float { top:66px; }
.app-shell:not(.sidebar-closed) .room-view-tools { left:22px; }
.app-shell.sidebar-closed .room-view-tools { left:58px; }
.room-view-tools button { min-height:30px; padding:0 12px; border:0; border-radius:8px; background:transparent; color:#8e9ba8; cursor:pointer; font-size:11px; font-weight:700; }
.room-view-tools button:hover { color:#fff; background:#ffffff0e; }
.room-view-tools button.active { background:#eef3f7; color:#101923; box-shadow:0 2px 8px #0005; }
.asset-command-tools{position:absolute;z-index:18;display:grid;gap:5px;width:132px;transition:left .18s ease,top .18s ease}.asset-command-tools[hidden]{display:none!important}.asset-command-tools h3{margin:0 0 1px;padding:0 3px;color:#dce5eb;font-size:12px;font-weight:750;letter-spacing:.02em;text-shadow:0 2px 8px #000}.asset-command-tools button{display:flex;align-items:center;justify-content:space-between;min-height:34px;padding:0 10px;border:1px solid #ffffff1c;border-radius:9px;background:#0b131cdd;color:#dce5eb;cursor:pointer;box-shadow:0 7px 20px #0004;backdrop-filter:blur(14px)}.asset-command-tools button:hover:not(:disabled){border-color:#ff796670;background:#18232e}.asset-command-tools button:active:not(:disabled){transform:translateY(1px)}.asset-command-tools button:disabled{cursor:not-allowed;opacity:.34}.asset-command-tools b{font-size:11px}.asset-command-tools small{color:#82909c;font-size:9px;white-space:nowrap}.self-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:6px;background:#ff7966;color:#fff;font:800 9px/1 "SFMono-Regular",monospace;vertical-align:1px}
.paid-update-dialog{width:min(400px,calc(100vw - 32px));padding:0;border:1px solid #ffffff24;border-radius:16px;background:#101922;color:#e8edf1;box-shadow:0 24px 90px #000b}.paid-update-dialog::backdrop{background:#02070ccc;backdrop-filter:blur(5px)}.paid-update-dialog form{padding:24px}.paid-update-dialog small{color:#ff8b79;font-size:10px;font-weight:800;letter-spacing:.12em}.paid-update-dialog h2{margin:8px 0;font-size:23px}.paid-update-dialog p{min-height:42px;margin:0;color:#93a0aa;line-height:1.6}.paid-update-balance{display:flex;align-items:center;justify-content:space-between;margin:18px 0;padding:13px 14px;border:1px solid #ffffff14;border-radius:10px;background:#0a1219}.paid-update-balance span{color:#81909b;font-size:12px}.paid-update-balance b{font-size:13px}.paid-update-balance i{color:#ff8b79;font-style:normal;font-size:18px}.paid-update-dialog footer{display:flex;justify-content:flex-end;gap:8px}.paid-update-dialog footer button{min-height:38px;padding:0 15px;border:1px solid #ffffff1c;border-radius:9px;background:#192530;color:#cbd4da;font-weight:750;cursor:pointer}.paid-update-dialog #paid-update-confirm,.paid-update-dialog #paid-update-recharge{border-color:#ff7966;background:#ff7966;color:#fff}.paid-update-dialog button[hidden]{display:none!important}
.desktop-settings-panel { color:#eaf0f5; border:1px solid #ffffff24; background:#0d1721f2; box-shadow:0 24px 70px #000a; backdrop-filter:blur(22px) saturate(125%); }
.desktop-settings-panel[hidden] { display:none; }
.room-settings-panel { position:absolute; z-index:31; top:66px; left:22px; width:320px; max-height:calc(100dvh - 86px); padding:14px; overflow:auto; border-radius:18px; scrollbar-width:thin; scrollbar-color:#ffffff2a transparent; }
.desktop-settings-panel>header { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.desktop-settings-panel>header div { display:grid; gap:3px; }
.desktop-settings-panel>header b { font-size:14px; }
.desktop-settings-panel>header small { color:#748394; font-size:9px; }
.desktop-settings-panel>header>button { width:30px; height:30px; padding:0; border:0; border-radius:9px; background:#ffffff0d; color:#9aa8b5; cursor:pointer; font-size:20px; }
.desktop-settings-panel>header>button:hover { background:#ffffff18; color:#fff; }
.settings-group { display:grid; gap:11px; padding:13px 0; border-top:1px solid #ffffff12; }
.settings-group h3 { margin:0; color:#cbd4dd; font-size:11px; }
.settings-group>label,.playback-fps { display:grid; gap:7px; }
.settings-group label>span,.playback-fps>span { display:flex; justify-content:space-between; color:#8795a3; font-size:10px; }
.settings-group output,.playback-fps output { color:#dce3e9; font:700 9px/1 "SFMono-Regular",monospace; }
.settings-group input,.playback-fps input { width:100%; accent-color:#ff7966; }
.subject-placement-setting p { margin:0; color:#788795; font-size:10px; line-height:1.5; }
.subject-placement-setting>button { min-height:36px; border:1px solid #ffffff20; border-radius:10px; background:#172431; color:#c5d0da; cursor:pointer; font-size:10px; font-weight:700; }
.subject-placement-setting>button[aria-pressed="true"] { border-color:#ff796677; background:#ff79661c; color:#ffab9f; }
.settings-group-title,.playback-setting-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.settings-switch { min-width:52px; min-height:28px; padding:0 10px; border:1px solid #ffffff20; border-radius:9px; background:#172431; color:#92a0ad; cursor:pointer; font-size:10px; font-weight:700; }
.settings-switch[aria-pressed="true"] { border-color:#ff79666b; background:#ff79661c; color:#ff9b8d; }
.room-settings-panel footer { padding-top:11px; border-top:1px solid #ffffff12; }
.room-settings-panel footer button { width:100%; min-height:34px; border:1px solid #ffffff1f; border-radius:10px; background:#ffffff08; color:#a8b4bf; cursor:pointer; font-size:10px; }
.room-settings-panel footer button:hover { border-color:#ffffff36; color:#fff; }
.playback-settings-panel { position:fixed; z-index:33; right:82px; top:50%; width:244px; padding:15px; border-radius:17px; transform:translateY(-10%); }
.playback-setting-row { min-height:39px; border-top:1px solid #ffffff12; color:#aeb9c3; font-size:11px; }
.playback-fps { padding-top:13px; border-top:1px solid #ffffff12; }
.playback-fps>small { color:#657585; font-size:9px; }
.player-main.discover-mode .room-view-tools,.player-main.discover-mode .room-settings-panel,.player-main.discover-mode .playback-settings-panel { display:none; }

.desktop-3d-prompt { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: 20px; }
.desktop-3d-prompt[hidden] { display: none; }
.desktop-3d-backdrop { position: absolute; inset: 0; border: 0; background: #05090dc7; backdrop-filter: blur(12px); cursor: default; }
.desktop-3d-card { position: relative; width: min(410px,100%); padding: 34px; overflow: hidden; border: 1px solid #ffffff24; border-radius: 22px; background: #111b26; color: #eef3f7; box-shadow: 0 30px 90px #000b; }
.desktop-3d-card:after { content:""; position:absolute; width:210px; height:210px; right:-110px; bottom:-120px; border:1px solid #69d4aa38; border-radius:50%; box-shadow:0 0 0 38px #69d4aa0d,0 0 0 76px #69d4aa08; pointer-events:none; }
.desktop-3d-close { position:absolute; top:14px; right:14px; width:32px; height:32px; border:0; border-radius:10px; background:#ffffff0c; color:#94a2af; cursor:pointer; font-size:20px; }
.desktop-3d-close:hover,.desktop-3d-close:focus-visible { background:#ffffff18; color:#fff; outline:2px solid #69d4aa; outline-offset:2px; }
.desktop-3d-mark { position:relative; width:72px; height:72px; display:grid; place-items:center; margin-bottom:26px; border:1px solid #69d4aa66; border-radius:50%; color:#b9ffe2; font-size:16px; font-weight:800; }
.desktop-3d-mark i { position:absolute; inset:8px; border:1px solid #69d4aa30; border-radius:50%; transform:rotateX(64deg); }
.desktop-3d-mark i:nth-of-type(2) { transform:rotateY(64deg); }
.desktop-3d-mark i:nth-of-type(3) { inset:18px; border-color:#ff79665c; }
.desktop-3d-card>small { color:#69d4aa; font-size:11px; font-weight:700; }
.desktop-3d-card h2 { margin:7px 0 12px; font-size:27px; letter-spacing:-.035em; }
.desktop-3d-card p { margin:0 0 24px; color:#91a0ae; font-size:13px; line-height:1.7; }
.desktop-3d-card>a { position:relative; z-index:1; display:flex; justify-content:center; padding:12px 16px; border-radius:12px; background:#eef3f7; color:#111b26; text-decoration:none; font-size:13px; font-weight:800; }
.desktop-3d-card>a:hover,.desktop-3d-card>a:focus-visible { background:#fff; outline:3px solid #69d4aa55; outline-offset:2px; }
.desktop-3d-card>span { display:block; margin-top:10px; color:#687887; font-size:10px; text-align:center; }
body.desktop-3d-prompt-open { overflow:hidden; }

/* 右上角操作区：消息中心铃铛 + 下载入口（铃铛在下载按钮左侧） */
.top-actions { position: absolute; z-index: 20; top: 16px; right: 16px; display: flex; align-items: center; gap: 10px; isolation: isolate; }
.top-actions .top-notif-toggle { width: 38px; height: 38px; }
.top-actions .top-notif-toggle svg { width: 16px; height: 16px; }
.top-actions .top-download { position: static; }
.top-download { position: absolute; z-index: 11; top: 16px; right: 16px; }
.top-download-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 1px solid #ffffff2b; border-radius: 999px; background: #0d151ec9; color: #e8eef4; cursor: pointer; font-size: 12px; font-weight: 700; box-shadow: 0 7px 24px #0006; backdrop-filter: blur(14px); }
.top-download-btn:hover { border-color: #ff7966; color: #fff; }
.top-download-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.download-menu { position: absolute; top: calc(100% + 8px); right: 0; min-width: 200px; display: grid; gap: 2px; padding: 6px; border: 1px solid #ffffff24; border-radius: 14px; background: #0d1620f2; box-shadow: 0 20px 60px #06101b99; backdrop-filter: blur(18px); }
/* 关键：display:grid 会覆盖 UA 样式表对 [hidden] 的 display:none，必须显式声明，否则菜单永不收起 */
.download-menu[hidden] { display: none; }
.download-menu a { display: grid; gap: 3px; padding: 9px 12px; border-radius: 10px; color: #eaf0f5; text-decoration: none; }
.download-menu a:hover { background: #1b2a3a; }
.download-menu a b { font-size: 13px; }
.download-menu a small { color: #7f8d9b; font-size: 10px; }
.download-disabled { display: grid; gap: 3px; padding: 9px 12px; border-radius: 10px; opacity: .38; cursor: not-allowed; color: #eaf0f5; user-select: none; }
.download-disabled b { font-size: 13px; }
.download-disabled small { color: #7f8d9b; font-size: 10px; }

/* 登录页下载入口：默认收起，点击展开四平台 */
.login-download { position: absolute; z-index: 12; top: max(20px, env(safe-area-inset-top)); right: clamp(20px, 3vw, 48px); display: inline-block; }
.login-download .desktop-download { border: 0; cursor: pointer; font: inherit; }
.login-download .download-menu { top: calc(100% + 8px); right: 0; left: auto; transform: none; }

@media (max-width: 700px) {
  .login-download { top: max(12px, env(safe-area-inset-top)); right: 12px; }
}

.follow-panel { position: absolute; z-index: 30; top: 0; right: 0; width: min(520px, 100%); height: 100%; padding: 28px; overflow-y: auto; color: #eaf0f5; background: #0b121af2; border-left: 1px solid #ffffff1f; box-shadow: -24px 0 70px #02070cb3; backdrop-filter: blur(22px); transform: translateX(104%); transition: transform .28s ease; }
.follow-panel.open { transform: translateX(0); }
.follow-panel:target { transform: translateX(0); }
.follow-panel > header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 26px; }
.follow-panel > header small { color: #718091; font: 700 9px/1 monospace; letter-spacing: .15em; }
.follow-panel > header h2 { margin: 7px 0 0; font-size: 28px; letter-spacing: -.04em; }
.follow-panel > header button, .follow-panel > header > a { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #ffffff24; border-radius: 11px; background: #17222e; color: #cbd4dd; cursor: pointer; font-size: 22px; text-decoration: none; }
.share-lookup { padding-bottom: 26px; border-bottom: 1px solid #ffffff18; }
.share-lookup label { display: block; margin-bottom: 9px; color: #aeb9c5; font-size: 12px; font-weight: 700; }
.share-lookup textarea { width: 100%; resize: vertical; min-height: 100px; padding: 13px 14px; border: 1px solid #ffffff24; border-radius: 14px; outline: none; background: #111b26; color: #f3f6f8; line-height: 1.6; }
.share-lookup textarea:focus { border-color: #ff7966; box-shadow: 0 0 0 3px #ff6b551f; }
.lookup-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 11px; }
.lookup-actions span { color: #6f7e8e; font-size: 10px; }
.lookup-actions button, .creator-follow-action { flex: none; padding: 9px 14px; border: 0; border-radius: 10px; background: var(--coral); color: #fff; cursor: pointer; font-size: 12px; font-weight: 700; }
.lookup-actions button:disabled { opacity: .45; cursor: wait; }
.lookup-progress { display: grid; gap: 8px; margin-top: 14px; color: #8795a4; font-size: 11px; }
.lookup-progress i { height: 4px; overflow: hidden; border-radius: 4px; background: #253240; }
.lookup-progress i b { display: block; width: 0; height: 100%; background: var(--coral); transition: width .25s; }
.lookup-result-card { display: grid; grid-template-columns: 54px 1fr auto; align-items: center; gap: 12px; margin-top: 14px; padding: 12px; border: 1px solid #ffffff20; border-radius: 14px; background: #14202b; }
.lookup-result-card img, .lookup-result-card .avatar-fallback { width: 54px; height: 54px; border-radius: 15px; object-fit: cover; }
.lookup-result-card h3 { margin: 0 0 4px; font-size: 14px; }
.lookup-result-card p { margin: 0; color: #7f8d9b; font-size: 10px; }
.lookup-error { margin-top: 13px; padding: 11px 12px; border-radius: 11px; background: #4a2024; color: #ffb6ae; font-size: 11px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lookup-retry-btn { flex: none; padding: 6px 14px; border: 0; border-radius: 8px; background: var(--coral); color: #fff; cursor: pointer; font-size: 11px; font-weight: 700; }
.lookup-retry-btn:active { transform: scale(.96); }
.nickname-results-heading-actions { display:flex; align-items:center; gap:9px; }
.nickname-results-heading-actions button,.cross-platform-head button { border:1px solid #ffffff1f; background:#ffffff0a; color:#91a0af; cursor:pointer; }
.nickname-results-heading-actions button { min-height:28px; padding:0 10px; border-radius:8px; font-size:10px; font-weight:700; }
.cross-platform-head button { display:grid; place-items:center; width:26px; height:26px; margin-left:auto; padding:0; border-radius:8px; font-size:17px; line-height:1; }
.nickname-results-heading-actions button:hover,.cross-platform-head button:hover { border-color:#ffffff36; background:#ffffff14; color:#fff; }
.nickname-results-heading-actions button:active,.cross-platform-head button:active { transform:scale(.96); }
.nickname-platform-result + .nickname-platform-result { margin-top:8px; }
.recommendations { padding-top: 24px; }
.section-title { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.section-title h3 { margin: 0; font-size: 15px; }
.section-title span { color: #687787; font-size: 9px; }
.recommendation-loading { height: 58px; border-radius: 12px; background: linear-gradient(90deg,#111b25,#192633,#111b25); background-size: 200% 100%; animation: recommendation-pulse 1.2s linear infinite; }
@keyframes recommendation-pulse { to { background-position: -200% 0; } }

/* ===== 发现页：独立全屏页面 ===== */
.player-main.discover-mode .stage,
.player-main.discover-mode .stage-shade,
.player-main.discover-mode .stage-background,
.player-main.discover-mode .updates-float,
.player-main.discover-mode .top-player-controls,
.player-main.discover-mode .swipe-hint { display: none; }
.discover-page {
  position: absolute;
  inset: 0;
  z-index: 9;
  overflow-y: auto;
  background:
    radial-gradient(1100px 520px at 12% -10%, #ff6b5514, transparent 60%),
    radial-gradient(900px 480px at 96% 108%, #25f4ee0a, transparent 55%),
    linear-gradient(180deg, #0a1017 0%, #080c12 100%);
  scrollbar-width: thin;
  scrollbar-color: #ffffff30 transparent;
}
.discover-page-inner { width: min(880px, calc(100% - 48px)); margin: 0 auto; padding: 52px 8px 72px; }
.discover-header { padding: 6px 6px 2px; }
.discover-header .eyebrow { display: block; color: #ff8b79; font: 700 10px/1.2 "SFMono-Regular", monospace; letter-spacing: .26em; }
.discover-header h2 { margin: 14px 0 12px; font-size: clamp(30px, 4.2vw, 44px); line-height: 1.06; letter-spacing: -.04em; color: #fff; }
.discover-header p { margin: 0; max-width: 56ch; color: #8b99a8; font-size: 14px; line-height: 1.85; }
.discover-hero {
  position: relative;
  overflow: hidden;
  margin-top: 26px;
  padding: 10px;
  border: 1px solid #ffffff20;
  border-radius: 20px;
  background: linear-gradient(165deg, #ff6b5512 0%, #ffffff07 55%);
}
.discover-hero::before { content: ""; position: absolute; top: -110px; right: -60px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, #ff6b5522, transparent 68%); pointer-events: none; }
.discover-chips { position: relative; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.discover-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 8px; border: 1px solid #ffffff20; border-radius: 999px; background: #0d1620cc; color: #cdd6df; font-size: 12px; font-weight: 600; }
.discover-chip svg { display: block; width: 9px; height: 9px; }
.discover-hero textarea { position: relative; width: 100%; resize: vertical; min-height: 180px; padding: 14px 15px; border: 1px solid #ffffff26; border-radius: 14px; outline: none; background: #0c141eb8; color: #f3f6f8; font-size: 13px; line-height: 1.7; }
.discover-hero textarea:focus { border-color: #ff7966; box-shadow: 0 0 0 3px #ff6b551f; }
.discover-hero textarea::placeholder { color: #5f6e7d; }
.face-discover-upload{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:12px;padding:18px;border:1px dashed #ffffff35;border-radius:14px;background:#101a24aa;cursor:pointer;transition:.18s}.face-discover-upload:hover,.face-discover-upload.drag{border-color:#ff7966;background:#ff796610}.face-discover-upload b{font-size:13px;color:#e8edf2}.face-discover-upload span{font-size:10px;color:#718090}.face-match-score{color:#70dcb6!important;font-weight:700}
.face-discover-preview{position:relative;width:min(220px,100%);margin:12px auto 0;border:1px solid #ffffff24;border-radius:14px;overflow:hidden;background:#101a24}.face-discover-preview img{display:block;width:100%;max-height:220px;object-fit:contain}.face-discover-preview button{position:absolute;top:6px;right:6px;width:25px;height:25px;border:0;border-radius:50%;background:#101a24dd;color:#fff;font-size:18px;line-height:1;cursor:pointer}.face-discover-preview button:hover{background:var(--coral)}
.detected-faces{margin-top:14px;padding:12px;border:1px solid #ffffff1f;border-radius:14px;background:#101a24}.detected-faces-title{margin-bottom:9px;color:#aeb9c5;font-size:11px;font-weight:700}.detected-faces-list{display:flex;gap:9px;overflow-x:auto}.detected-faces figure,.face-compare-pair figure{margin:0;text-align:center}.detected-faces img{display:block;width:64px;height:64px;border-radius:12px;object-fit:cover;border:2px solid #ff796666}.detected-faces figcaption,.face-compare-pair figcaption{margin-top:4px;color:#718090;font-size:9px}.face-compare-pair{display:flex;align-items:center;gap:8px;margin:8px 0}.face-compare-pair>span{color:#70dcb6;font-weight:800}.face-compare-pair img{display:block;width:52px!important;height:52px!important;border-radius:11px!important;object-fit:cover;border:2px solid #ffffff28}.face-compare-pair figure:first-child img{border-color:#ff796688}.face-lookup-result{align-items:start}
.discover-recommend { margin-top: 30px; }
.recommend-empty { padding: 26px 10px; border: 1px dashed #ffffff1a; border-radius: 14px; color: #718091; font-size: 12px; text-align: center; }
.recommended-creators { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.recommended-row {
  display: grid;
  gap: 11px;
  padding: 16px;
  border: 1px solid #ffffff14;
  border-radius: 16px;
  background: #131f2ae0;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.recommended-row:hover { background: #182a38; border-color: #ffffff2a; transform: translateY(-2px); }
.recommended-row .rec-latest { position: relative; display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 11px; width: 100%; padding: 0; overflow: hidden; border: 1px solid #ffffff18; border-radius: 12px; background: #0c151f; color: #eef3f7; text-align: left; cursor: pointer; }
.recommended-row .rec-latest:hover { border-color: #ff887788; background: #111d28; color: #fff; }
.recommended-row .rec-latest:active { transform: scale(.985); }
.recommended-row .rec-latest:focus-visible { outline: 2px solid #ff8877; outline-offset: 2px; }
.recommended-row .rec-latest:disabled { opacity: .68; cursor: wait; }
.recommended-row .rec-latest-empty { cursor: default; }
.rec-cover { position: relative; display: block; height: 86px; overflow: hidden; background: #263341; }
.rec-cover img { width: 100%; height: 100%; object-fit: cover; }
.rec-cover-empty { background: linear-gradient(135deg, #202f3d, #111b25); }
.rec-cover i { position: absolute; right: 7px; bottom: 7px; display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid #ffffff55; border-radius: 50%; background: #0b121bbb; color: #fff; font-size: 9px; font-style: normal; backdrop-filter: blur(5px); }
.rec-latest-copy { align-self: center; display: flex; align-items: center; gap: 9px; min-width: 0; padding-right: 10px; }
.rec-latest-copy > .avatar-wrap, .rec-latest-copy > img, .rec-latest-copy > .avatar-fallback { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; object-fit: cover; }
.rec-latest-copy > .avatar-wrap > img, .rec-latest-copy > .avatar-wrap > .avatar-fallback { width: 34px; height: 34px; border-radius: 10px; object-fit: cover; }
.rec-latest-copy > span:last-child { min-width: 0; }
.rec-latest-copy b { display: block; overflow: hidden; color: inherit; font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.rec-latest-copy small { display: block; margin-top: 4px; color: #718091; font-size: 9px; line-height: 1.3; white-space: nowrap; }
.recommended-row button { width: 100%; padding: 9px 12px; border: 1px solid #ffffff2e; border-radius: 11px; background: #ffffff0a; color: #e6ecf1; cursor: pointer; font-size: 12px; font-weight: 600; transition: border-color .15s ease, color .15s ease, background .15s ease; }
.recommended-row button:hover { border-color: #ff8877; color: #ff9b8d; background: #ff6b5514; }
.recommended-row button.followed, #updates-unfollow.followed { border-color: #ff796666; color: #ff8978; background: #ff6b5510; }
.discover-page .lookup-result-card { grid-template-columns: 60px 1fr auto; }
.discover-page .lookup-result-card img, .discover-page .lookup-result-card .avatar-fallback { width: 60px; height: 60px; border-radius: 16px; }

/* 平台 badge：头像右下角，尺寸随头像等比缩放 */
.avatar-wrap { position: relative; display: inline-block; line-height: 0; vertical-align: middle; }
.platform-badge { position: absolute; right: -1px; bottom: -1px; z-index: 3; width: 38%; height: 38%; min-width: 8px; min-height: 8px; max-width: 20px; max-height: 20px; overflow: hidden; box-shadow: 0 0 0 1.5px #0e1620; }
.platform-badge svg { display: block; width: 100%; height: 100%; }

@media (max-width: 900px) {
  .updates-float { width: min(420px, calc(100% - 36px)); left: 18px; }
  .top-player-controls { top: 50%; right: 12px; width: 48px; }
  .player-avatar, .top-play, .top-mute, .top-background-toggle { width: 44px; height: 44px; }
  .background-picker { right: 58px; width: min(188px, calc(100vw - 88px)); }
  .updates-float { top: 70px; }
  #background-speed-wrap { display: none; }
}

@media (max-width: 700px) {
  :root { --mobile-nav-height: 64px; }
  .app-shell { flex-direction: column; height: 100dvh; padding-bottom: var(--mobile-nav-height); }
  .sidebar {
    position: fixed;
    inset: auto 0 0;
    z-index: 50;
    width: 100%;
    min-width: 0;
    height: var(--mobile-nav-height);
    padding: 7px max(12px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    border: 0;
    border-top: 1px solid #ffffff18;
    background: #0b121af2;
    backdrop-filter: blur(20px);
  }
  .app-shell.sidebar-closed .sidebar {
    width: 100%;
    min-width: 0;
    padding: 7px max(12px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    border-top-color: #ffffff18;
    overflow: visible;
  }
  .sidebar .logo, .sidebar-collapse, .sidebar .creator-heading, .sidebar .creator-list, .sidebar .account { display: none; }
  .sidebar nav { grid-template-columns: repeat(2, 1fr); gap: 6px; height: 100%; }
  .sidebar .nav-item { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 12px; text-align: center; }
  .sidebar .nav-item span { margin: 0; }
  .player-main { width: 100%; height: 100%; }
  .sidebar-expand { display: none; }
  .app-shell.sidebar-closed .updates-float { opacity: 1; transform: none; pointer-events: auto; }

  .updates-float {
    top: 62px;
    left: 10px;
    width: calc(100% - 20px);
    max-height: min(43dvh, 390px);
    padding: 11px;
    border-radius: 15px;
  }
  .updates-float > header { margin-bottom: 9px; }
  .updates-float .live-pill { padding: 5px 7px; }
  .feed { grid-template-columns: minmax(0, 1fr); max-height: calc(min(43dvh, 390px) - 58px); gap: 7px; }
  .asset-card { grid-template-columns: 68px minmax(0, 1fr); }

  .top-actions { top: 10px; right: 10px; gap: 7px; }
  .top-download-btn { min-height: 34px; padding: 7px 10px; }
  .top-download-btn span { display: none; }
  .notif-panel { top: 42px; right: 0; width: calc(100vw - 20px); padding: 10px; }
  .notif-list { grid-template-columns: minmax(0, 1fr); max-height: 55dvh; }

  .top-player-controls { right: 9px; width: 36px; }
  .top-player-bar { gap: 11px; }
  .player-avatar, .top-play, .top-mute, .top-background-toggle, .top-rematting-toggle, .top-player-scale-toggle, .top-comment-toggle, .top-playback-settings {
    width: 34px;
    height: 34px;
  }
  .player-avatar span { font-size: 13px; }
  .top-play { font-size: 13px; }
  .top-mute svg, .top-background-toggle svg, .top-rematting-toggle svg, .top-comment-toggle svg, .top-playback-settings svg { width: 16px; height: 16px; }
  .top-player-scale-toggle { font-size: 10px; }
  .room-view-tools { top:10px; left:10px; }
  .room-view-tools button { min-height:27px; padding:0 8px; font-size:9px; }
  .room-settings-panel { top:51px; left:10px; width:min(310px,calc(100vw - 64px)); max-height:calc(100dvh - 64px); }
  .playback-settings-panel { right:54px; width:min(230px,calc(100vw - 74px)); }
  .background-picker { right: 44px; width: min(176px, calc(100vw - 64px)); }
  /* 评论在手机上是一张独立会话页；覆盖播放器与底栏，键盘弹起时仍保留输入区。 */
  .comment-panel {
    inset: var(--comment-viewport-top, 0px) 0 auto;
    width: 100%;
    height: var(--comment-viewport-height, 100dvh);
    max-height: none;
    transform: none;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    border: 0;
    border-radius: 0;
    background: #0b141dfb;
    box-shadow: none;
    backdrop-filter: blur(24px);
  }
  .comment-panel > header {
    min-height: 64px;
    padding: max(13px, env(safe-area-inset-top)) 16px 11px;
  }
  .comment-panel > header b { max-width: calc(100vw - 84px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:17px; }
  .comment-panel > header button { width: 44px; height: 44px; border-radius: 14px; font-size: 27px; }
  .comment-tabs { margin: 10px 12px 0; }
  .comment-tabs button { min-height: 42px; font-size: 14px; }
  .comment-visibility-note { margin: 9px 15px 7px; font-size: 12px; }
  .comment-list { min-height: 0; padding: 8px 12px 18px; overscroll-behavior: contain; scroll-padding-bottom: 20px; }
  .comment-item { grid-template-columns: 36px minmax(0,1fr); gap: 10px; }
  .comment-item.creator { padding-left: min(28px, 7vw); }
  .comment-item img,.comment-item .avatar-fallback { width:36px; height:36px; border-radius:11px; }
  .comment-bubble { padding:10px 12px; }
  .comment-bubble p { font-size:14px; line-height:1.55; }
  .comment-compose {
    grid-template-columns: 44px minmax(0,1fr) auto;
    gap: 8px;
    padding: 10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  }
  .comment-compose textarea { min-height:44px; max-height:120px; padding:11px 12px; border-radius:13px; font-size:16px; line-height:20px; }
  .comment-mode,.comment-image,.comment-hold,.comment-send { min-height:44px; height:44px; border-radius:13px; }
  .comment-mode,.comment-image { width:44px; }
  .comment-send { min-width:58px; padding:0 14px; }
  body.comment-panel-open { overflow:hidden; }

  .discover-page-inner { width: 100%; padding: 28px 16px calc(32px + env(safe-area-inset-bottom)); }
  .discover-header { padding: 0; }
  .discover-header h2 { margin: 10px 0 8px; font-size: clamp(27px, 8vw, 36px); }
  .discover-header p { font-size: 12px; line-height: 1.55; }
  .discover-hero { margin-top: 18px; padding: 9px; border-radius: 16px; }
  .discover-hero textarea { min-height: 130px; padding: 12px; }
  .face-discover-upload { padding: 15px 10px; text-align: center; }
  .lookup-actions { align-items: stretch; flex-direction: column; }
  .lookup-actions button { width: 100%; min-height: 42px; }
  .discover-recommend { margin-top: 22px; }
  .section-title { align-items: flex-start; flex-direction: column; gap: 5px; }
  .recommended-creators { grid-template-columns: minmax(0, 1fr); }
  .discover-page .lookup-result-card, .identity-suggest-row, .cross-search-row { grid-template-columns: 46px minmax(0, 1fr); }
  .discover-page .lookup-result-card > :last-child, .identity-suggest-row > :last-child, .cross-search-row > :last-child { grid-column: 1 / -1; width: 100%; }
  .mobile-following-panel { position: absolute; inset: 0; z-index: 45; display: block; padding: max(22px, env(safe-area-inset-top)) 16px 20px; overflow: hidden; background: #0b121af7; backdrop-filter: blur(20px); }
  .mobile-following-panel[hidden] { display: none; }
  .mobile-following-panel > header { display: flex; align-items: center; justify-content: space-between; padding: 4px 3px 16px; border-bottom: 1px solid #ffffff18; }
  .mobile-following-panel > header small { color: #718092; font: 700 10px/1 monospace; letter-spacing: .14em; }
  .mobile-following-panel > header h2 { margin: 6px 0 0; color: #f3f6f8; font-size: 25px; }
  .mobile-following-panel > header button { width: 38px; height: 38px; border: 1px solid #ffffff24; border-radius: 12px; background: #192534; color: #fff; font-size: 24px; }
  .mobile-creator-list { height: calc(100% - 78px); padding: 12px 0 24px; overflow-y: auto; }
  .mobile-creator-list .creator-row { min-height: 58px; padding: 10px; border-bottom: 1px solid #ffffff0c; }
  .mobile-creator-list .creator-row img, .mobile-creator-list .creator-row .avatar-fallback { width: 42px; height: 42px; border-radius: 13px; }
  .mobile-creator-list .creator-row b { color: #eef3f7; font-size: 14px; }
}

/* 同人（person）分组：关注博主列表按人聚合 */
.creator-group { display: grid; gap: 2px; }
.creator-group-header { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; padding: 8px; border-radius: 12px; cursor: pointer; background: #1b2a3a; border: 1px solid #2e4a63; transition: background .15s ease; }
.creator-group-header:hover { background: #213349; }
.creator-group-header .avatar-wrap, .creator-group-header > img, .creator-group-header > .avatar-fallback { width: 34px; height: 34px; }
.creator-group-header .avatar-wrap img, .creator-group-header .avatar-wrap .avatar-fallback, .creator-group-header > img, .creator-group-header > .avatar-fallback { width: 34px; height: 34px; border-radius: 11px; object-fit: cover; }
.creator-group-title { min-width: 0; }
.creator-group-title b { display: block; font-size: 13px; color: #eef3f7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.creator-group-title small { display: block; color: #6f7e90; margin-top: 2px; font-size: 11px; }
.creator-group-toggle { color: #6f7e90; font-size: 11px; font-style: normal; }
.creator-group .creator-row { padding-left: 16px; }

/* 发现页：关联账号推荐（可能为同一博主） */
.identity-suggest { margin-top: 14px; padding: 12px; border: 1px dashed #3d5a75; border-radius: 14px; background: #101c28; }
.identity-suggest-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.identity-suggest-head b { font-size: 13px; color: #eef3f7; }
.identity-suggest-hint { color: #6f7e90; font-size: 11px; flex: 1; min-width: 140px; }
.identity-follow-all { padding: 7px 12px; border: 0; border-radius: 10px; background: var(--coral); color: #fff; cursor: pointer; font-size: 12px; font-weight: 700; }
.identity-follow-all:disabled { opacity: .5; cursor: default; }
.identity-suggest-list { display: grid; gap: 8px; }
.identity-suggest-row { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; padding: 9px 10px; border: 1px solid #ffffff18; border-radius: 12px; background: #14202b; }
.identity-suggest-row .avatar-wrap img, .identity-suggest-row .avatar-wrap .avatar-fallback { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; }
.identity-suggest-name { min-width: 0; }
.identity-suggest-name b { display: block; font-size: 13px; color: #eef3f7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.identity-suggest-name small { display: block; color: #7f8d9b; font-size: 10px; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.identity-suggest-row .creator-follow-action { padding: 7px 12px; border: 0; border-radius: 10px; background: var(--coral); color: #fff; cursor: pointer; font-size: 11px; font-weight: 700; }
.identity-suggest-row .creator-follow-action.followed { background: transparent; border: 1px solid #ff796666; color: #ff8978; }

/* 跨平台同名搜索结果 */
.cross-search { border-style: solid; border-color: #2e4b63; }
.cross-platform-block { margin-bottom: 10px; }
.cross-platform-block:last-child { margin-bottom: 0; }
.cross-platform-head { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #c8d4de; margin-bottom: 6px; }
.cross-platform-head b { font-size: 12px; color: #eef3f7; }
.cross-platform-head svg { flex: 0 0 auto; width: 16px; height: 16px; border-radius: 4px; }
.identity-suggest-name small svg { display: inline-block; width: 12px; height: 12px; margin-right: 3px; border-radius: 3px; vertical-align: -2px; }
.cross-count { color: #6f7e90; font-size: 11px; }
.cross-empty { color: #5d6b78; font-size: 11px; }
.cross-error { color: #b0684f; font-size: 11px; }
.cross-search-row { grid-template-columns: 42px 1fr auto; }
.cross-actions { display: flex; align-items: center; gap: 8px; }
.cross-profile-link { color: #7fa5c4; font-size: 11px; text-decoration: none; }
.cross-profile-link:hover { text-decoration: underline; }
.cross-lib-badge { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 6px; background: #1f4d3d; color: #7ed4a8; font-size: 10px; }
.cross-review-badge { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 8px; background: #3a3323; color: #e6c47a; font-size: 11px; white-space: nowrap; }
.cross-sig { color: #5d6b78 !important; }
.cross-reason { color: #6f7e90 !important; }
.cross-score-wrap { display: inline-flex; }
.cross-score { padding: 1px 7px; border-radius: 8px; background: #3a3444; color: #a89bc0; font-size: 10px; white-space: nowrap; }
.cross-score.high { background: #1f4d3d; color: #7ed4a8; }
.cross-low { opacity: .78; }
.cross-collapse { margin: 4px 0 8px; border: 1px dashed #2e4b63; border-radius: 8px; }
.cross-collapse summary { padding: 6px 10px; color: #7fa5c4; font-size: 11px; cursor: pointer; user-select: none; list-style: none; }
.cross-collapse summary::before { content: '▸ '; }
.cross-collapse[open] summary::before { content: '▾ '; }
.cross-collapse summary:hover { color: #a8c8e0; }
.cross-collapse .identity-suggest-row { padding: 0 10px; }
#toast { right:auto; z-index:100; opacity:0; visibility:hidden; pointer-events:none; transform:translate(-50%,-90px); }
#toast.show { opacity:1; visibility:visible; transform:translate(-50%,0); }

@media (max-width: 700px) {
  .player-main.following-mode { display: grid; grid-template-columns: minmax(0, 1fr); }
  .creator-search-panel { right: auto; width: calc(100% - 166px); min-height: 66px; padding: 9px 6px 9px 10px; }
  .player-main.following-mode .top-actions { top: 14px; right: 10px; }
  .creator-search-panel .face-discover-upload,.creator-search-panel .face-discover-preview { height: 34px; }
  .creator-search-panel .discover-chips { gap: 4px; overflow: hidden; flex-wrap: nowrap; }
  .creator-search-panel .discover-chip { padding-right: 5px; font-size: 0; }
  .creator-search-panel .discover-chip svg { width: 16px; height: 16px; }
  .creator-search-results { right: 10px; left: 10px; max-height: calc(100dvh - 88px); }
  .player-main.following-mode .updates-float {
    position: absolute;
    inset: 166px auto auto 10px;
    width: calc(100% - 20px);
    height: auto;
    max-height: min(43dvh, 390px);
    padding: 11px;
    border: 1px solid #ffffff24;
    border-radius: 15px;
    background: #0c141ed4;
    box-shadow: 0 20px 60px #06101b66;
    backdrop-filter: blur(18px) saturate(130%);
  }
  .player-main.following-mode .feed { max-height: calc(min(43dvh, 390px) - 58px); }
  .player-main.following-mode .stage-background,
  .player-main.following-mode .stage-shade,
  .player-main.following-mode .stage {
    inset: 50% 14px auto auto;
    width: min(calc(100% - 28px), calc((100dvh - 92px) * .5625));
    transform: translateY(-50%);
  }
  .player-main.following-mode::after {
    right: 14px;
    left: auto;
    width: min(calc(100% - 28px), calc((100dvh - 92px) * .5625));
    transform: translateY(-50%);
  }
}

/* Final cascade locks for global navigation and utility placement. */
.top-actions { position:fixed; z-index:60; top:16px; right:16px; }
.home-auth-entry{display:flex;align-items:center;gap:6px}.home-auth-entry[hidden]{display:none!important}.home-auth-entry button{height:38px;border:1px solid #ffffff24;border-radius:10px;padding:0 14px;background:#111b25e8;color:#dce4e9;font-size:12px;font-weight:800;cursor:pointer;backdrop-filter:blur(16px);transition:border-color .18s,background .18s,color .18s,transform .18s}.home-auth-entry button:hover{border-color:#ff79666b;color:#fff}.home-auth-entry button:active{transform:translateY(1px)}.home-auth-entry button[data-auth-intent="login"]{border-color:#ff7966;background:#ff7966;color:#fff}.home-auth-bottom{margin-top:auto;padding:14px 4px 0;border-top:1px solid #ffffff17}.home-auth-bottom button{flex:1;height:36px;padding:0 8px;background:transparent}.home-auth-bottom button[data-auth-intent="login"]{background:#f0f4f6;color:#111820;border-color:#f0f4f6}.home-auth-bottom+.account{margin-top:12px}.home-auth-top{margin-right:2px}
.player-main.following-mode .top-actions { top:16px; right:16px; }
@media (max-width:700px){
  .home-auth-bottom{display:none}.home-auth-top button{height:36px;padding:0 11px}.home-auth-top{gap:5px}
  .sidebar nav { grid-template-columns:repeat(4,1fr); gap:4px; height:100%; }
  .sidebar .nav-item { gap:3px; padding:6px 4px; font-size:11px; }
  .top-actions,.player-main.following-mode .top-actions { top:10px; right:10px; }
}

/* Final following-control cascade. */
.player-main.following-mode .room-view-tools { display:flex; }
.player-main.following-mode .player-avatar,
.player-main.following-mode .top-background-toggle,
.player-main.following-mode .top-player-scale-toggle,
.player-main.following-mode .top-playback-settings { display:none; }
.player-main.following-mode .stage>.top-play { position:absolute;z-index:12;top:50%;left:50%;width:58px;height:58px;transform:translate(-50%,-50%);opacity:.9; }
.player-main.following-mode .stage>.top-play[hidden] { display:none; }
@media(max-width:700px){.player-main.following-mode .room-view-tools{top:76px;left:10px}.player-main.following-mode .stage>.top-play{width:52px;height:52px}}
@media(max-width:700px){.player-main.following-mode .asset-command-tools{top:116px;left:10px;width:116px}.asset-command-tools button{min-height:31px;padding:0 8px}}

/* Following theater: one wide iPad canvas, with portrait and comments composed inside it. */
@media (min-width:701px) {
  body.comment-panel-open {
    --paired-height: min(calc(100dvh - 124px), calc((100vw - 340px - 76px) * .8889));
    --paired-width: calc(var(--paired-height) * .5625);
  }
  .player-main.following-mode {
    --following-left: 340px;
    --theater-top: 84px;
    --theater-right: 20px;
    --theater-bottom: 20px;
    --portrait-height: min(calc(100dvh - 124px), calc((100vw - var(--following-left) - 92px) * 1.7778));
    --portrait-width: calc(var(--portrait-height) * .5625);
    --wide-width: min(calc(100% - var(--following-left) - var(--theater-right) - 20px), calc((100dvh - var(--theater-top) - var(--theater-bottom)) * 1.3333));
    --wide-left: calc(var(--following-left) + (100% - var(--following-left) - var(--theater-right) - var(--wide-width)) / 2);
  }
  .player-main.following-mode .room-view-tools {
    top: calc(var(--theater-top) + 14px);
    left: calc(var(--following-left) + 16px);
  }
  .player-main.following-mode .room-settings-panel {
    top: calc(var(--theater-top) + 58px);
    left: calc(var(--following-left) + 16px);
    transform: scale(.7);
    transform-origin: top left;
  }
  .player-main.following-mode:not(.room-view-portrait) .stage-background,
  .player-main.following-mode:not(.room-view-portrait) .stage-shade,
  .player-main.following-mode:not(.room-view-portrait) .stage {
    inset: calc(50% + 32px) auto auto calc(var(--wide-left) + 10px);
    width: calc(var(--wide-width) - 20px);
    height: auto;
    aspect-ratio: 4 / 3;
    transform: translateY(-50%);
    border-radius: 24px;
  }
  .player-main.following-mode:not(.room-view-portrait) .stage-background {
    object-fit: contain;
    background: #03070b;
  }
  .player-main.following-mode:not(.room-view-portrait) .stage-background-3dgs {
    object-fit: contain;
  }
  .player-main.following-mode:not(.room-view-portrait)::after {
    display: block;
    content: '';
    position: absolute;
    z-index: 11;
    inset: calc(50% + 32px) auto auto var(--wide-left);
    width: var(--wide-width);
    height: auto;
    aspect-ratio: 4 / 3;
    transform: translateY(-50%);
    pointer-events: none;
    border: 8px solid #151c24;
    border-radius: 34px;
    box-shadow: inset 0 0 0 1px #ffffff18, 0 24px 70px #0009;
  }
  .player-main.following-mode.room-view-portrait .stage-background,
  .player-main.following-mode.room-view-portrait .stage-shade,
  .player-main.following-mode.room-view-portrait .stage {
    inset: calc(50% + 36px) auto auto calc(var(--following-left) + (100% - var(--following-left) - var(--theater-right)) / 2);
    width: var(--portrait-width);
    height: var(--portrait-height);
    transform: translate(-50%,-50%);
  }
  .player-main.following-mode.room-view-portrait::after {
    top: calc(50% + 36px);
    right: auto;
    left: calc(var(--following-left) + (100% - var(--following-left) - var(--theater-right)) / 2);
    width: var(--portrait-width);
    height: var(--portrait-height);
    transform: translate(-50%,-50%);
  }
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage-background,
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage-shade,
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage {
    left: auto;
    right: calc(var(--theater-right) + var(--paired-width) + 18px);
    width: var(--paired-width);
    height: var(--paired-height);
    transform: translateY(-50%);
  }
  body.comment-panel-open .player-main.following-mode.room-view-portrait::after {
    left: auto;
    right: calc(var(--theater-right) + var(--paired-width) + 18px);
    width: var(--paired-width);
    height: var(--paired-height);
    transform: translateY(-50%);
  }
  body.comment-panel-open .comment-panel {
    top: calc(50% + 36px);
    right: 20px;
    width: var(--paired-width);
    height: var(--paired-height);
    max-height: none;
    transform: translateY(-50%);
    border-radius: 28px;
  }
}

/* ===== 关注页播放区布局重构（2026-09-18）：猜你想右侧跟随 / 切换钮居中 / 宽屏左贴更新框 / 常规进度条 / 评论入框 ===== */
@media (min-width:701px){
  .player-main.following-mode {
    --updates-col: 340px;
    --updates-right: calc(var(--updates-col) - 12px);
    --wide-left: var(--updates-right);
    --wide-width: min(calc(100% - var(--updates-right) - var(--theater-right)), calc((100dvh - var(--theater-top) - var(--theater-bottom)) * 1.3333));
  }
  /* 宽屏|竖屏切换：相对播放区水平居中悬浮 */
  .player-main.following-mode .room-view-tools {
    top: 76px;
    left: calc(var(--updates-right) + (100% - var(--updates-right) - var(--theater-right)) / 2);
    right: auto;
    transform: translateX(-50%);
  }
  .player-main.following-mode .room-settings-panel { left: calc(var(--updates-right) + 16px); }
}
/* 常规播放器控制条（播放框内侧底部）：静音 + 帧进度 */
.stage-player-bar { position:absolute; z-index:13; left:14px; right:14px; bottom:12px; display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid #ffffff1f; border-radius:14px; background:#0b131cd9; box-shadow:0 10px 30px #0007; backdrop-filter:blur(14px) saturate(125%); }
.stage-player-bar[hidden] { display:none; }
.stage-player-bar .top-mute { width:36px; height:36px; box-shadow:none; background:transparent; border-color:#ffffff24; }
.stage-player-bar .top-mute svg { width:18px; height:18px; }
.stage-player-bar .player-progress-data { display:flex; flex:1; min-width:0; align-items:center; gap:10px; }
.stage-player-bar .player-progress-data span { min-width:26px; color:#c7d0d9; font:700 10px/1 "SFMono-Regular",monospace; text-align:center; }
.stage-player-bar .player-progress-data input { flex:1; min-width:0; margin:0; accent-color:#ff7966; cursor:pointer; }
/* 评论与私信按钮：悬浮于播放框内侧左上缘（跟随宽/竖屏） */
.player-main.following-mode .stage>.top-comment-toggle { position:absolute; z-index:12; top:14px; left:14px; width:44px; height:44px; }
/* 右侧竖排工具栏退役：控件已全部移入播放框 */
.player-main.following-mode .top-player-bar { display:none; }
.player-main.following-mode .comment-panel { right:20px; }

/* ===== 猜你想：仅标题醒目（红字、底色不变），按钮保持深色 ===== */
.asset-command-tools h3 { color:#ff7966; font-weight:800; text-shadow:0 2px 10px #ff5f7e59,0 2px 8px #000; }
/* 评论按钮：播放框内右下角、进度条上方 */
.player-main.following-mode .stage>.top-comment-toggle { top:auto; left:auto; right:14px; bottom:78px; }
/* 侧边栏退出登录文字按钮 */
.account #logout { min-height:26px; padding:0 8px; border:1px solid #ffffff20; border-radius:8px; background:transparent; color:#9aa7b3; font-size:10px; font-weight:700; }
.account #logout:hover { border-color:#ffffff30; background:#ffffff0b; color:#fff; }

/* ===== 关注页搜索框：宽屏下宽度不超页面一半，移动端不受限（2026-09-18）===== */
@media (min-width:701px){
  .player-main.following-mode .creator-search-panel { max-width: 50vw; }
}

/* ===== 更新列表头部：三个按钮文字任何时候都不换行（2026-09-18）===== */
.updates-float > header { flex-wrap: nowrap; }
.feed-filter-tabs { flex: none; flex-wrap: nowrap; }
.feed-filter-tabs button { flex: none; white-space: nowrap; }
.updates-actions { flex: none; flex-wrap: nowrap; }
.updates-actions > button { flex: none; white-space: nowrap; }
/* 计数文本让位：空间不足时自行收缩并省略，绝不挤换按钮 */
.player-main.following-mode .updates-float > header > #update-count {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== 竖屏播放：靠左贴更新列表，右侧预留"猜你想"通道（2026-09-18）===== */
@media (min-width:701px){
  .player-main.following-mode { --commands-box: 190px; }
  /* 竖屏（评论未开）：播放框左贴更新列表，右侧自然空出猜你想位置 */
  .player-main.following-mode.room-view-portrait .stage-background,
  .player-main.following-mode.room-view-portrait .stage-shade,
  .player-main.following-mode.room-view-portrait .stage {
    left: calc(var(--following-left) + 10px);
    right: auto;
    width: var(--portrait-width);
    height: var(--portrait-height);
    transform: translateY(-50%);
  }
  .player-main.following-mode.room-view-portrait::after {
    left: calc(var(--following-left) + 10px);
    right: auto;
    width: var(--portrait-width);
    height: var(--portrait-height);
    transform: translateY(-50%);
  }
  /* 评论打开：配对尺寸先扣除猜你想通道，保证三栏（播放｜猜你想｜评论）不溢出 */
  body.comment-panel-open {
    --commands-box: 190px;
    --paired-height: min(calc(100dvh - 124px), calc((100vw - 340px - 76px - var(--commands-box)) * .8889));
    --paired-width: calc(var(--paired-height) * .5625);
  }
  /* 竖屏 + 评论打开：播放框左贴更新列表，宽度自适应并主动让出猜你想通道 */
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage-background,
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage-shade,
  body.comment-panel-open .player-main.following-mode.room-view-portrait .stage {
    left: calc(var(--following-left) + 10px);
    right: auto;
    width: min(
      calc((100% - var(--following-left) - 10px - var(--theater-right) - var(--commands-box)) / 2),
      calc((100dvh - 124px) * .5625)
    );
    height: auto;
    aspect-ratio: 9 / 16;
    transform: translateY(-50%);
  }
  body.comment-panel-open .player-main.following-mode.room-view-portrait::after {
    left: calc(var(--following-left) + 10px);
    right: auto;
    width: min(
      calc((100% - var(--following-left) - 10px - var(--theater-right) - var(--commands-box)) / 2),
      calc((100dvh - 124px) * .5625)
    );
    height: auto;
    aspect-ratio: 9 / 16;
    transform: translateY(-50%);
  }
}