/* The embedded reader shares Together's page, typography and theme. */
#togetherReadMode #coread{width:100%;max-width:none;margin:0;padding:0;background:transparent;border-radius:0;font:13px/1.65 var(--editorial-sans,system-ui);--cr-accent:var(--listen-blue);--cr-line:var(--listen-line);--cr-muted:var(--ref-mauve,var(--text-soft))}
#togetherPanel:has(#togetherReadTab.active) .together-source-chip{visibility:hidden}
#togetherReadMode .cr-header{padding:0 0 9px;border:0;justify-content:flex-end}
#togetherReadMode .cr-header>div,#togetherReadMode .cr-footer{display:none}
#togetherReadMode #coread:has(#cr-library:not([hidden])) .cr-header{display:none}
#togetherReadMode #coread #cr-shelf-button{border:0;padding:3px 0;color:var(--cr-accent);font-size:12px}
#togetherReadMode #cr-shelf-button::before{content:'‹';margin-right:7px}
#togetherReadMode #coread #cr-status:empty{display:none}
#togetherReadMode #coread #cr-status{padding:6px 0;min-height:0}
#togetherReadMode #coread .cr-section-title{margin:10px 0 4px;padding-bottom:12px;border-bottom:1px solid var(--cr-line)}
#togetherReadMode #coread h3{font-family:var(--chat-type,serif);font-size:16px;letter-spacing:.04em}
#togetherReadMode #coread button{min-height:40px;border-radius:4px;font-size:12px;padding:7px 11px}
#togetherReadMode #coread #cr-import-toggle{color:var(--cr-accent);border:0;padding-right:0}
#togetherReadMode #coread #cr-books{display:flex;flex-direction:column;gap:0}
#togetherReadMode #coread .cr-book{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 16px;grid-template-rows:auto auto;column-gap:17px;row-gap:4px;align-content:center;width:100%;min-height:111px;padding:19px 3px;border:0;border-bottom:1px solid var(--cr-line);border-radius:0;background:transparent;box-shadow:none;text-align:left}
#togetherReadMode #coread .cr-book::before{content:'';grid-row:1/3;grid-column:1;align-self:center;width:46px;height:65px;border:1px solid color-mix(in srgb,var(--cr-accent) 36%,transparent);border-radius:1px 4px 4px 1px;background:linear-gradient(90deg,transparent 5px,color-mix(in srgb,var(--cr-accent) 25%,transparent) 5px,color-mix(in srgb,var(--cr-accent) 25%,transparent) 6px,transparent 6px),linear-gradient(155deg,color-mix(in srgb,var(--cr-accent) 13%,transparent),transparent);box-shadow:3px 3px 0 color-mix(in srgb,var(--cr-ink) 6%,transparent)}
#togetherReadMode #coread .cr-book::after{content:'↗';grid-column:3;grid-row:1/3;align-self:center;color:var(--cr-accent);font-size:17px}
#togetherReadMode #coread .cr-book strong{grid-column:2;align-self:end;font:500 18px/1.55 var(--chat-type,serif);overflow-wrap:anywhere}
#togetherReadMode #coread .cr-book small{grid-column:2;align-self:start;font-size:10px;letter-spacing:.03em}
#togetherReadMode #coread .cr-book:hover{background:color-mix(in srgb,var(--cr-accent) 4%,transparent)}
#togetherReadMode #coread #cr-import{border:0;border-top:1px solid var(--cr-line);border-radius:0;padding:18px 0;margin-top:16px;gap:12px}
#togetherReadMode #coread .cr-hint{font-size:11px;line-height:1.8}
#togetherReadMode #coread input,#togetherReadMode #coread textarea,#togetherReadMode #coread select{border-radius:4px;background:color-mix(in srgb,var(--ref-chip,var(--cr-paper)) 50%,transparent)}
#togetherReadMode #coread .cr-primary{background:var(--cr-accent);border-color:var(--cr-accent);color:var(--ref-paper,#fff)}
#togetherReadMode #coread .cr-toolbar{margin:0;gap:5px;padding-bottom:10px;border-bottom:1px solid var(--cr-line)}
#togetherReadMode #coread .cr-toolbar button{border:0;padding:5px 7px}
#togetherReadMode #coread #cr-title{font-size:15px}
#togetherReadMode #coread .cr-chapter-label{margin:9px 0;font-size:11px}
#togetherReadMode #coread .cr-chapter-label select{border:0;background:transparent}
#togetherReadMode #coread #cr-stage{height:clamp(300px,53dvh,630px);border:0;border-top:1px solid var(--cr-line);border-bottom:1px solid var(--cr-line);border-radius:0;background:transparent}
#togetherReadMode #coread #cr-text{padding:22px 8px;font-family:var(--chat-type,'STSong',serif);line-height:2.05}
#togetherReadMode #coread .cr-progress{font-size:10px;margin:9px 0 18px}
#togetherReadMode #coread .cr-margin{padding:14px 0;border-left:0;border-top:1px solid var(--cr-line)}
#togetherReadMode #coread #cr-selected{font-family:var(--chat-type,serif);font-size:13px;color:var(--cr-muted)}
#togetherReadMode #coread .cr-actions{gap:6px}
#togetherReadMode #coread .cr-actions button{flex:1;padding:7px 5px;font-size:11px;white-space:nowrap}
#togetherReadMode #coread .cr-note{font-size:13px}
@media(min-width:700px){#togetherReadMode #coread #cr-text{padding:30px 34px}#togetherReadMode #coread .cr-book{column-gap:22px}}

/* v2: Together reading room. The hierarchy borrows from the existing
   connected player, Plan and Memory without turning the reader into a new UI. */
#togetherPanel:has(#togetherReadTab.active) .together-presence{margin-bottom:8px}
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-presence,
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-tabs{display:none}
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-heading strong{font-size:0!important}
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-heading strong::before{content:'Bookshelf';font:italic 500 27px/1.15 var(--editorial-serif,Georgia,serif);letter-spacing:.5px}
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-body{padding-top:2px}
#togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) #togetherReadMode{display:block}
#togetherReadMode #coread{--cr-card:color-mix(in srgb,var(--ref-glass-strong,var(--ref-paper,#fff)) 82%,transparent);--cr-soft:color-mix(in srgb,var(--cr-accent) 8%,transparent);--cr-shadow:rgba(var(--ref-shadow,99,93,53),.07)}
#togetherReadMode #coread .cr-kicker{display:block;color:var(--cr-accent);font:600 7.5px/1.25 var(--editorial-sans,system-ui);letter-spacing:.18em;text-transform:uppercase}
#togetherReadMode #coread .cr-room-card{position:relative;display:grid;grid-template-columns:68px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:116px;margin:1px 0 17px;padding:15px 15px 15px 16px;border:1px solid var(--cr-line);border-radius:14px;background:var(--cr-card);box-shadow:0 9px 24px var(--cr-shadow);overflow:hidden}
#togetherReadMode #coread .cr-room-card::after{content:'';position:absolute;inset:5px;border:1px solid color-mix(in srgb,var(--cr-ink) 10%,transparent);border-radius:9px;pointer-events:none}
#togetherReadMode #coread .cr-room-cover{position:relative;width:62px;height:84px;border:1px solid color-mix(in srgb,var(--cr-accent) 42%,transparent);border-radius:2px 7px 7px 2px;background:linear-gradient(145deg,color-mix(in srgb,var(--cr-accent) 13%,var(--ref-chip,#fff)),color-mix(in srgb,var(--cr-accent) 3%,transparent));box-shadow:4px 5px 0 color-mix(in srgb,var(--cr-ink) 7%,transparent)}
#togetherReadMode #coread .cr-room-cover::before{content:'';position:absolute;left:7px;top:0;bottom:0;border-left:1px solid color-mix(in srgb,var(--cr-accent) 35%,transparent)}
#togetherReadMode #coread .cr-room-cover::after{content:'';position:absolute;inset:24px 16px;border:1px solid color-mix(in srgb,var(--cr-accent) 44%,transparent);border-radius:50%}
#togetherReadMode #coread .cr-room-cover span{position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:var(--cr-accent);transform:translate(-50%,-50%)}
#togetherReadMode #coread .cr-room-copy{min-width:0;position:relative;z-index:1}
#togetherReadMode #coread .cr-room-copy strong{display:block;margin:7px 0 5px;font:500 21px/1.18 var(--chat-type,serif);letter-spacing:.035em}
#togetherReadMode #coread .cr-room-copy p{max-width:25em;color:var(--cr-muted);font:400 10.5px/1.65 var(--chat-type,serif)}
#togetherReadMode #coread .cr-room-count{align-self:start;display:grid;grid-template-columns:auto 6px 6px;align-items:center;gap:5px;color:var(--cr-ink);font:500 13px/1 var(--editorial-serif,Georgia,serif);position:relative;z-index:1}
#togetherReadMode #coread .cr-room-count small{display:none}
#togetherReadMode #coread .cr-room-count i{width:6px;height:6px;border-radius:50%;background:var(--cr-accent)}
#togetherReadMode #coread .cr-section-title{min-height:34px;margin:0;padding:0 1px 9px}
#togetherReadMode #coread .cr-section-title h3{display:flex;align-items:center;gap:9px;font:600 8px/1.2 var(--editorial-sans,system-ui);letter-spacing:.19em;text-transform:uppercase;color:var(--cr-muted)}
#togetherReadMode #coread .cr-section-title h3::after{content:'';width:46px;border-top:1px dotted var(--cr-line)}
#togetherReadMode #coread #cr-books{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
#togetherReadMode #coread .cr-book{grid-template-columns:47px minmax(0,1fr) 12px;min-height:96px;padding:13px 12px;border:1px solid var(--cr-line);border-radius:12px;background:color-mix(in srgb,var(--cr-card) 72%,transparent);box-shadow:0 5px 14px color-mix(in srgb,var(--cr-shadow) 72%,transparent)}
#togetherReadMode #coread .cr-book:first-child{grid-column:1/-1;grid-template-columns:66px minmax(0,1fr) 18px;min-height:126px;padding:16px}
#togetherReadMode #coread .cr-book::before{width:42px;height:60px;border-radius:1px 5px 5px 1px;box-shadow:3px 3px 0 color-mix(in srgb,var(--cr-ink) 6%,transparent)}
#togetherReadMode #coread .cr-book:first-child::before{width:61px;height:88px}
#togetherReadMode #coread .cr-book::after{content:'›';font:400 22px/1 var(--editorial-serif,Georgia,serif)}
#togetherReadMode #coread .cr-book strong{font-size:15px;line-height:1.45}
#togetherReadMode #coread .cr-book:first-child strong{font-size:20px}
#togetherReadMode #coread .cr-book small{color:var(--cr-muted);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase}
#togetherReadMode #coread .cr-book:first-child small{color:var(--cr-accent)}
#togetherReadMode #coread .cr-book[data-shelf="current"]::after{content:'›'}
#togetherReadMode #coread .cr-book[data-shelf="current"] strong::before{content:'CURRENT READ / 正在读';display:block;margin-bottom:7px;color:var(--cr-accent);font:600 7.5px/1.2 var(--editorial-sans,system-ui);letter-spacing:.17em}
#togetherReadMode #coread .cr-book-meter{grid-column:2;display:grid;grid-template-columns:minmax(42px,92px) auto;align-items:center;gap:8px;margin-top:3px}
#togetherReadMode #coread .cr-book-meter>i{display:block;height:2px;background:color-mix(in srgb,var(--cr-accent) 15%,transparent);overflow:hidden}
#togetherReadMode #coread .cr-book-meter>i>i{display:block;height:100%;background:var(--cr-accent)}
#togetherReadMode #coread .cr-book-meter em{color:var(--cr-muted);font:500 7.5px/1 var(--editorial-sans,system-ui);font-style:normal;letter-spacing:.06em;white-space:nowrap}
#togetherReadMode #coread #cr-import{border:1px solid var(--cr-line);border-radius:13px;padding:17px;margin-top:10px;background:color-mix(in srgb,var(--cr-card) 70%,transparent)}
#togetherReadMode #coread .cr-reading-desk{padding:14px 14px 2px;border:1px solid var(--cr-line);border-radius:14px;background:var(--cr-card);box-shadow:0 9px 24px var(--cr-shadow)}
#togetherReadMode #coread .cr-toolbar{display:grid;grid-template-columns:32px minmax(0,1fr) 33px 33px 32px;gap:4px;padding:0 0 11px;border-bottom:1px solid var(--cr-line)}
#togetherReadMode #coread .cr-toolbar button{min-height:34px;padding:4px;border:0;border-radius:50%}
#togetherReadMode #coread .cr-book-heading{min-width:0;align-self:center;padding-left:4px}
#togetherReadMode #coread #cr-title{margin-top:5px;font:500 16px/1.25 var(--chat-type,serif);letter-spacing:.025em}
#togetherReadMode #coread .cr-chapter-label{margin:0;padding:8px 2px;border-bottom:1px solid var(--cr-line);font:500 9px/1 var(--editorial-sans,system-ui);letter-spacing:.14em;text-transform:uppercase}
#togetherReadMode #coread .cr-chapter-label select{font-family:var(--chat-type,serif);font-size:11px;letter-spacing:.02em;text-transform:none}
#togetherReadMode #coread #cr-stage{height:clamp(300px,51dvh,630px);border:0;background:radial-gradient(circle at 12% 8%,color-mix(in srgb,var(--cr-accent) 7%,transparent),transparent 28%),color-mix(in srgb,var(--ref-paper,#fff) 56%,transparent)}
#togetherReadMode #coread #cr-text{padding:27px 19px 50px;line-height:2.12;scrollbar-width:thin}
#togetherReadMode #coread .cr-progress{margin:0;padding:9px 1px 10px;border-top:1px solid var(--cr-line);font:500 8.5px/1.2 var(--editorial-sans,system-ui);letter-spacing:.07em;text-transform:uppercase}
#togetherReadMode #coread .cr-margin{position:relative;margin-top:11px;padding:29px 14px 14px;border:1px solid var(--cr-line);border-radius:13px;background:color-mix(in srgb,var(--cr-card) 72%,transparent)}
#togetherReadMode #coread .cr-margin::before{content:'PAGE MARGIN / 页边';position:absolute;top:11px;left:14px;color:var(--cr-accent);font:600 7.5px/1 var(--editorial-sans,system-ui);letter-spacing:.18em}
#togetherReadMode #coread .cr-actions button{border-radius:9px;background:color-mix(in srgb,var(--ref-chip,#fff) 52%,transparent)}
#togetherReadMode #coread .cr-actions .cr-primary{background:var(--cr-accent);color:var(--ref-paper,#fff)}
#togetherReadMode #coread #cr-reading>.cr-section-title{margin-top:13px;border-bottom:1px solid var(--cr-line)}

/* Noir keeps its established editorial grid: square, quiet and ink-led. */
:root[data-theme="noir"] #togetherPanel:has(#togetherReadTab.active) .together-heading strong::after{content:' — 一起读'}
:root[data-theme="noir"] #togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-heading strong::before{content:'BOOKSHELF — 书架';font:600 11px/1 var(--akserif,Georgia,serif);font-style:normal;letter-spacing:.24em}
:root[data-theme="noir"] #togetherPanel:has(#togetherReadTab.active):has(#cr-library:not([hidden])) .together-heading strong::after{content:''}
:root[data-theme="noir"] #togetherReadMode #coread{--cr-card:transparent;--cr-soft:transparent;--cr-shadow:transparent}
:root[data-theme="noir"] #togetherReadMode #coread .cr-room-card,
:root[data-theme="noir"] #togetherReadMode #coread .cr-book,
:root[data-theme="noir"] #togetherReadMode #coread #cr-import,
:root[data-theme="noir"] #togetherReadMode #coread .cr-reading-desk,
:root[data-theme="noir"] #togetherReadMode #coread .cr-margin{border-radius:0;background:transparent;box-shadow:none}
:root[data-theme="noir"] #togetherReadMode #coread .cr-room-card{border-width:1px 0;padding-left:2px;padding-right:2px}
:root[data-theme="noir"] #togetherReadMode #coread .cr-room-card::after{display:none}
:root[data-theme="noir"] #togetherReadMode #coread .cr-room-cover,
:root[data-theme="noir"] #togetherReadMode #coread .cr-book::before{border-radius:0;background:transparent;box-shadow:3px 3px 0 color-mix(in srgb,var(--cr-ink) 8%,transparent)}
:root[data-theme="noir"] #togetherReadMode #coread .cr-book{border-width:0 0 1px;padding-left:2px;padding-right:2px}
:root[data-theme="noir"] #togetherReadMode #coread .cr-book:first-child{border-top:1px solid var(--cr-line)}
:root[data-theme="noir"] #togetherReadMode #coread .cr-reading-desk{padding-left:0;padding-right:0;border-width:1px 0}
:root[data-theme="noir"] #togetherReadMode #coread .cr-toolbar button{border-radius:0}
:root[data-theme="noir"] #togetherReadMode #coread #cr-stage{background:transparent}
:root[data-theme="noir"] #togetherReadMode #coread .cr-margin{padding-left:0;padding-right:0;border-width:1px 0}
:root[data-theme="noir"] #togetherReadMode #coread .cr-margin::before{left:0}
:root[data-theme="noir"] #togetherReadMode #coread .cr-actions button{border-radius:0;background:transparent}

@media(max-width:520px){
  #togetherReadMode #coread .cr-room-card{grid-template-columns:60px minmax(0,1fr) auto;gap:11px;padding:13px 12px;min-height:108px}
  #togetherReadMode #coread .cr-room-cover{width:54px;height:76px}
  #togetherReadMode #coread .cr-room-copy strong{font-size:18px}
  #togetherReadMode #coread .cr-room-copy p{font-size:9.5px}
  #togetherReadMode #coread #cr-books{grid-template-columns:1fr}
  #togetherReadMode #coread .cr-book:first-child{grid-column:auto}
  #togetherReadMode #coread .cr-reading-desk{padding:12px 10px 2px}
  #togetherReadMode #coread .cr-toolbar{grid-template-columns:29px minmax(0,1fr) 31px 31px 29px}
  #togetherReadMode #coread #cr-title{font-size:14px}
  #togetherReadMode #coread #cr-text{padding-left:12px;padding-right:12px}
  #togetherReadMode #coread .cr-margin{padding-left:11px;padding-right:11px}
}