/* 待阅 on the desk: a compact card under the heading, one line per book, project,
   comic or the article shelf. Scoped to #home-page so desk layouts cannot restyle it. */
#home-page #desk-inbox { margin: 22px 0 30px; padding: 14px 20px 6px; border: 1px solid var(--desk-line); border-radius: 12px; background: var(--surface); }
#home-page .desk-inbox-head { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; }
#home-page .desk-inbox-head h3 { margin: 0; font-family: var(--font-ui, inherit); font-size: 13px; font-weight: 650; letter-spacing: .04em; color: var(--muted); text-transform: none; }
#home-page .desk-inbox-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 6px; border-radius: 9px; background: var(--accent); color: var(--bg); font-size: 11px; font-weight: 700; line-height: 1; }
#home-page .desk-inbox-count:empty { display: none; }
#home-page .desk-inbox-link, #home-page .desk-inbox-go, #home-page .desk-inbox-dismiss { padding: 4px 2px; border: 0; background: none; box-shadow: none; cursor: pointer; font: inherit; }
#home-page .desk-inbox-link { margin-left: auto; font-size: 12px; color: var(--muted); }
#home-page .desk-inbox-empty { margin: 0 0 8px; font-size: 13px; color: var(--muted); }
#home-page .desk-inbox-item { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 0; border-top: 1px solid var(--desk-line); }
#home-page .desk-inbox-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
#home-page .desk-inbox-copy { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; row-gap: 2px; }
#home-page .desk-inbox-kind { font-size: 12px; color: var(--muted); }
#home-page .desk-inbox-copy strong { font-size: 15px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
#home-page .desk-inbox-meta { font-size: 13px; color: var(--accent); }
#home-page .desk-inbox-note { flex-basis: 100%; font-size: 12px; color: var(--muted); }
#home-page .desk-inbox-actions { flex: none; display: flex; align-items: center; gap: 16px; }
#home-page .desk-inbox-go { font-size: 14px; font-weight: 600; color: var(--primary); }
#home-page .desk-inbox-go::after { content: " →"; }
#home-page .desk-inbox-dismiss { font-size: 12px; color: var(--muted); }
#home-page :is(.desk-inbox-link, .desk-inbox-go, .desk-inbox-dismiss):hover { color: var(--accent); }
#home-page :is(.desk-inbox-link, .desk-inbox-go, .desk-inbox-dismiss):disabled { opacity: .5; cursor: default; }
@media (max-width: 700px) {
  #home-page #desk-inbox { margin-top: 16px; padding: 12px 16px 4px; }
  #home-page .desk-inbox-actions { gap: 12px; }
}

/* The desk designs place every block by grid area; 待阅 takes its own row under the
   heading. :root lifts these just above desk-designs.css, which loads later. */
:root[data-desk-design] #home-page #desk-inbox { grid-area: inbox; }
:root[data-desk-design] #home-page { grid-template-areas: "head" "inbox" "book" "news" "arts" "upd" "coll" "chap" "loop" "proj"; }
@container desk (min-width: 860px) {
  :root[data-desk-design="a"] #home-page {
    grid-template-rows: auto auto auto auto auto auto auto auto auto 1fr;
    grid-template-areas: "head head" "inbox inbox" "book book" "news news" "arts upd" "coll upd" "chap upd" "proj upd" "loop upd" ". upd";
  }
}
@container desk (min-width: 600px) {
  :root[data-desk-design="b"] #home-page { grid-template-areas: "head head" "inbox inbox" "book book" "news news" "arts upd" "coll coll" "chap proj" "loop loop"; }
}
@container desk (min-width: 880px) {
  :root[data-desk-design="b"] #home-page {
    grid-template-rows: auto auto auto auto 1fr auto auto auto;
    grid-template-areas: "head head head" "inbox inbox inbox" "book book upd" "news news upd" "arts arts upd" "coll coll upd" "chap chap proj" "loop loop loop";
  }
}
@container desk (min-width: 760px) {
  :root[data-desk-design="c"] #home-page {
    grid-template-rows: auto auto auto auto auto auto auto auto auto 1fr;
    grid-template-areas: "head head" "inbox inbox" "book book" "news news" "arts upd" "coll upd" "chap upd" "proj upd" "loop upd" ". upd";
  }
}

/* Reader: the update list sits at the top of the side panel; the picker chooses the revision. */
.desk-reader-aside .reader-updates { margin: 0 0 22px; padding-bottom: 18px; border-bottom: 1px solid var(--reader-rule); }
.desk-reader-aside .reader-updates-head { display: flex; align-items: center; gap: 6px; }
.desk-reader-aside .reader-updates-head h2 { flex: 1; margin: 0; font: 600 15px/1.5 var(--font-ui, inherit); color: var(--reader-ink); }
.desk-reader-aside .reader-updates-select { flex: 1; min-width: 0; width: auto; padding: 4px 6px; border: 1px solid var(--reader-rule); border-radius: 6px; background: var(--reader-bg); color: var(--reader-ink); font: 600 13px/1.5 var(--font-ui, inherit); text-overflow: ellipsis; cursor: pointer; }
.desk-reader-aside .reader-updates-select[hidden] { display: none; }
.desk-reader-aside .reader-updates-select:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.desk-reader-aside .reader-updates-head:has(.reader-updates-select[hidden])::before { content: "书稿更新"; flex: 1; font: 600 15px/1.5 var(--font-ui, inherit); color: var(--reader-ink); }
.desk-reader-aside .reader-updates-icon[hidden] { display: none; }
.desk-reader-aside .reader-updates-icon { width: auto; padding: 2px 6px; border: 0; background: none; color: var(--reader-muted); font-size: 12px; cursor: pointer; }
.desk-reader-aside .reader-updates-icon:hover { color: var(--accent); }
.desk-reader-aside .reader-updates-status { margin: 4px 0 10px; font-size: 12px; line-height: 1.6; }
.reader-updates.is-collapsed #reader-updates-body { display: none; }
.reader-update + .reader-update { margin-top: 16px; }
.reader-update-head strong { display: block; font-size: 13px; line-height: 1.5; color: var(--reader-ink); overflow-wrap: anywhere; }
.reader-update-head small { display: block; font-size: 11px; color: var(--reader-muted); }
.reader-update-sections, .reader-update-changes { list-style: none; margin: 0; padding: 0; }
.reader-update-sections { margin-top: 8px; border-top: 1px solid var(--reader-rule); }
.reader-update-section { border-bottom: 1px solid var(--reader-rule); }
.desk-reader-aside .reader-update-section-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; width: 100%; padding: 9px 2px; border: 0; background: none; color: inherit; font-size: 12px; text-align: left; cursor: pointer; }
.desk-reader-aside .reader-update-section-head:disabled { cursor: default; opacity: .6; }
.desk-reader-aside .reader-update-section-head:not(:disabled):hover .reader-update-where { color: var(--accent); }
.reader-update-section-head .reader-update-where { flex: 1 1 auto; min-width: 0; }
.reader-update-section-head small { margin-left: auto; font-size: 11px; color: var(--reader-muted); white-space: nowrap; }
.reader-update-changes { margin: -2px 0 8px; }
.desk-reader-aside .reader-update-change { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; column-gap: 8px; width: calc(100% + 12px); margin: 0 -6px; padding: 6px; border: 0; border-radius: 6px; background: none; color: inherit; font-size: 12px; text-align: left; cursor: pointer; }
.desk-reader-aside .reader-update-change:hover, .desk-reader-aside .reader-update-change[aria-current="true"] { background: color-mix(in srgb, var(--accent) 11%, transparent); }
.reader-update-tag { padding: 0 6px; border-radius: 4px; font-size: 11px; line-height: 1.7; white-space: nowrap; color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.reader-update-tag:is(.is-removed, .is-section-removed) { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }
.reader-update-where { font-weight: 600; line-height: 1.5; color: var(--reader-ink); overflow-wrap: anywhere; }
.reader-update-snippet { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.6; color: var(--reader-muted); overflow-wrap: anywhere; }
.desk-reader-aside .reader-update-more { margin: 6px 0 0; font-size: 11px; color: var(--reader-muted); }
.reader-update-flash { border-radius: 4px; animation: reader-update-flash 2.6s ease-out; }
@keyframes reader-update-flash { 0%, 45% { background: color-mix(in srgb, var(--accent) 22%, transparent); } 100% { background: transparent; } }
/* Below 1190px the side panel is hidden, so the list floats over the page, and only after 待阅 → 去看. */
@media (max-width: 1190px) {
  .desk-reader-aside:has(> .reader-updates.is-inbox:not([hidden])) { display: block !important; visibility: visible !important; position: fixed; right: 12px; bottom: calc(84px + env(safe-area-inset-bottom)); z-index: 30; width: min(340px, calc(100vw - 24px)); max-height: min(60vh, 520px); overflow-y: auto; padding: 14px 16px; border: 1px solid var(--reader-rule); border-radius: 12px; background: var(--reader-bg); box-shadow: 0 12px 32px -12px #0006; }
  .desk-reader-aside:has(> .reader-updates.is-inbox:not([hidden])) > :not(.reader-updates) { display: none !important; }
  .desk-reader-aside .reader-updates { margin: 0; padding: 0; border: 0; }
  .desk-reader-aside .reader-updates:not(.is-inbox) { display: none; }
}
