/* Document components. Existing HTML and copy/collapse behavior stay compatible. */
.detail-main {
 --doc-text:#475569; --doc-muted:#64748b; --doc-surface:#fff;
 --doc-bg:#f8fafc; --doc-border:#e2e8f0; --doc-brand:#6366f1;
}
:root[data-mode=dark] .detail-main {
 --doc-text:#cbd5e1; --doc-muted:#a3aec2; --doc-surface:#252938;
 --doc-bg:#202431; --doc-border:#3b4256; --doc-brand:#a5a7ff;
}
/* Callouts work with the original HTML and with the existing enhanced toolbar. */
/* Reading rhythm and inline code stay independent from fenced code panels. */
.detail-main .reading-content > p { margin:0 0 1.35em; line-height:2.1; }
.detail-main .paper-audio-player ~ .reading-content > p { line-height:2.8; }
.prose-paper :not(pre) > code {
 display:inline; padding:1px 5px; border:1px solid #e2e8f0; border-radius:4px;
 background:#f1f5f9; color:#475569;
 font-family:Consolas,"SFMono-Regular","Liberation Mono",monospace;
 font-size:.9em; font-weight:400; line-height:inherit; vertical-align:baseline;
 white-space:break-spaces; overflow-wrap:anywhere;
 -webkit-box-decoration-break:clone; box-decoration-break:clone;
}
:root[data-mode=dark] .prose-paper :not(pre) > code { background:#323849; border-color:#424a60; color:#e2e8f0; }

.prose-paper .paper-callout {
 --accent-color:#3b82f6; --callout-bg:#f0f7ff; --callout-border:#dbeafe;
 display:grid; grid-template-columns:18px minmax(0,1fr); column-gap:10px;
 margin:20px 0; padding:14px 18px; border:1px solid var(--callout-border);
 border-left:4px solid var(--accent-color); border-radius:8px;
 background:var(--callout-bg); color:var(--doc-text);
}
.prose-paper :is(.callout-tip,.callout-success) { --accent-color:#22a06b; --callout-bg:#f0fdf4; --callout-border:#d1f0dc; }
.prose-paper .callout-warning { --accent-color:#d59620; --callout-bg:#fffbeb; --callout-border:#f7e7b6; }
.prose-paper .callout-danger { --accent-color:#e05a64; --callout-bg:#fff1f2; --callout-border:#f9d6db; }
.prose-paper .callout-primary { --accent-color:#7c64d5; --callout-bg:#f5f3ff; --callout-border:#e5dffa; }
.prose-paper :is(.callout-default,.callout-note) { --accent-color:#7c8ca5; --callout-bg:#f8fafc; --callout-border:#e2e8f0; }
.paper-callout>.callout-icon { display:grid; place-items:center; width:18px; height:18px; margin-top:3px; border:1.5px solid currentColor; border-radius:50%; color:var(--accent-color); font-size:12px; font-weight:700; line-height:1; }
.paper-callout.has-callout-tools>.callout-icon { display:none; }
.prose-paper .paper-callout>:is(.callout-toolbar,summary) { grid-column:1/-1; display:flex; align-items:center; gap:10px; min-height:0; margin:0 0 5px; padding:0; border:0; list-style:none; color:var(--accent-color); font-size:14px; line-height:1.5; }
.paper-callout>summary { cursor:pointer; }
.paper-callout>summary::-webkit-details-marker { display:none; }
.paper-callout .callout-title-icon { flex:0 0 18px; width:18px; height:18px; color:var(--accent-color); }
.prose-paper .paper-callout .callout-title { margin:0; font-size:14px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
.prose-paper .paper-callout>.callout-body { grid-column:2; min-width:0; padding:0; font-size:15px; line-height:1.7; }
.paper-callout .callout-body>.callout-title { display:block; margin-bottom:5px; color:var(--accent-color); }
.paper-callout .callout-body>:first-child { margin-top:0; }
.paper-callout .callout-body>:last-child { margin-bottom:0; }
.prose-paper details.paper-callout { display:block; }
.prose-paper details.paper-callout>.callout-body { margin-left:28px; }
.paper-callout.is-long:not(.is-expanded)>.callout-body { max-height:340px; overflow:hidden; }
.callout-actions { display:flex; flex-shrink:0; gap:5px; margin-left:auto; }
.callout-actions button { display:grid; place-items:center; width:24px; height:24px; padding:4px; border:0; border-radius:4px; background:transparent; color:var(--accent-color); }
.callout-actions button:hover { background:var(--callout-border); }
.callout-actions svg { width:16px; height:16px; }
:root[data-mode=dark] .prose-paper .paper-callout { --accent-color:#8abcf8; --callout-bg:#192a40; --callout-border:#2c4666; }
:root[data-mode=dark] .prose-paper :is(.callout-tip,.callout-success) { --accent-color:#85d6aa; --callout-bg:#1b3028; --callout-border:#2c5141; }
:root[data-mode=dark] .prose-paper .callout-warning { --accent-color:#ecc674; --callout-bg:#332b1c; --callout-border:#5a482a; }
:root[data-mode=dark] .prose-paper .callout-danger { --accent-color:#f39ba5; --callout-bg:#38242b; --callout-border:#603840; }
:root[data-mode=dark] .prose-paper .callout-primary { --accent-color:#bcacf7; --callout-bg:#2a2640; --callout-border:#48405f; }
:root[data-mode=dark] .prose-paper :is(.callout-default,.callout-note) { --accent-color:#b1bed0; --callout-bg:#262d3c; --callout-border:#3b475b; }
/* Quotes remain visually distinct from status messages. */
.detail-main .prose-paper blockquote { margin:20px 0; padding:12px 18px; border:0; border-left:3px solid var(--doc-brand); border-radius:0 8px 8px 0; background:var(--doc-bg); color:var(--doc-text); font-size:15px; font-style:italic; line-height:1.6; }
.detail-main .prose-paper blockquote p { margin:0 0 8px; font-size:inherit; line-height:inherit; }
.detail-main .prose-paper blockquote>:last-child { margin-bottom:0; }
.detail-main .prose-paper blockquote blockquote { margin:12px 0 0; }
/* Compact download row: resource information and one small action strip. */
.prose-paper .compact-download { display:flex; flex-wrap:wrap; align-items:stretch; gap:10px; margin:20px 0; padding:0; border:0; border-radius:0; background:transparent; color:var(--doc-text); font-size:14px; line-height:1.5; }
.compact-download-main { display:contents; }
.compact-download-file { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; flex:1 1 280px; min-width:0; min-height:44px; padding:8px 12px; border:1px solid var(--doc-border); border-radius:6px; background:var(--doc-bg); }
.compact-download-file>strong { color:var(--ink); font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.compact-download-metadata { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; min-width:0; }
.compact-download-metadata small { color:var(--doc-muted); font-size:12px; overflow-wrap:anywhere; }
.compact-download-metadata b { color:var(--ink); font-size:13px; font-weight:600; }
.compact-download-group { flex-shrink:0; margin-left:auto; color:var(--ink); font-size:13px; font-weight:600; line-height:1.5; }
.compact-download-controls { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; max-width:100%; min-width:0; padding:5px; border:1px solid #b9ddf4; border-radius:6px; background:#eff8ff; }
.compact-download-actions { display:contents; }
.prose-paper .compact-download-button { display:inline-flex; align-items:center; justify-content:center; min-height:32px; padding:7px 12px; border:0; border-radius:5px; background:#258ed1; color:#fff; font-size:13px; font-weight:600; line-height:1.5; text-decoration:none; box-shadow:none; white-space:nowrap; }
.prose-paper .compact-download-button:hover { background:#167bbd; color:#fff; }
.prose-paper .compact-download-button.is-disabled { background:var(--doc-border); color:var(--doc-muted); }
.compact-download-values { display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; min-width:0; }
.compact-download-value { display:inline-flex; align-items:center; flex-wrap:wrap; gap:4px 6px; min-width:0; max-width:100%; padding:5px 4px; border:0; border-radius:4px; background:transparent; color:var(--doc-text); text-align:left; font-size:12px; line-height:1.5; box-shadow:none; }
.compact-download-value:hover { background:#dceffc; color:#167bbd; filter:none; }
.compact-download-value:disabled { cursor:wait; opacity:.65; }
.compact-download-value-label { font-weight:600; }
.compact-download-value-text { color:var(--doc-muted); overflow-wrap:anywhere; font-size:12px; }
:root[data-mode=dark] .compact-download-controls { border-color:#345873; background:#1c3041; }
:root[data-mode=dark] .compact-download-value:hover { background:#29475e; color:#a9d9fc; }
@media(max-width:640px) {
 .compact-download-file,.compact-download-controls { flex-basis:100%; }
 .compact-download-controls { gap:6px 8px; }
 .prose-paper .compact-download-button { padding:7px 10px; font-size:12px; }
 .compact-download-values { gap:4px 8px; }
 .prose-paper .paper-callout { padding:14px 16px; }
}
@media print {
 .prose-paper .paper-callout,.detail-main .prose-paper blockquote,.prose-paper .compact-download { break-inside:avoid; background:#fff; color:#334155; box-shadow:none; }
 .callout-actions { display:none; }
}
/* Connected document tabs: the selected page joins the white content surface. */
.prose-paper .paper-tabs {
 --tabs-line:#e2e8f0; --tabs-bar:#f8fafc; --tabs-surface:#fff;
 --tabs-text:#64748b; --tabs-active:#1e293b;
 margin:24px 0; padding:0; border:1px solid var(--tabs-line);
 border-radius:12px; background:var(--tabs-surface); overflow:hidden;
}
.paper-tabs > .paper-tabs-nav {
 display:flex; flex-wrap:nowrap; align-items:flex-end; gap:2px;
 margin:0; padding:4px 10px 0; border:0;
 background:linear-gradient(to top,var(--tabs-line) 1px,transparent 1px),var(--tabs-bar);
 overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.paper-tabs > .paper-tabs-nav::-webkit-scrollbar { display:none; }
.paper-tabs > .paper-tabs-nav > button {
 flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; gap:6px;
 margin:0; padding:10px 14px; border:1px solid transparent;
 border-radius:8px 8px 0 0; background:transparent; color:var(--tabs-text);
 font-size:14px; font-weight:400; line-height:1.5; white-space:nowrap;
 box-shadow:none; filter:none; cursor:pointer;
}
.paper-tabs > .paper-tabs-nav > button:hover { color:var(--tabs-active); }
.paper-tabs > .paper-tabs-nav > button[aria-selected="true"] {
 border-color:var(--tabs-line); border-bottom-color:var(--tabs-surface);
 background:var(--tabs-surface); color:var(--tabs-active); font-weight:500;
}
.paper-tabs > .paper-tabs-nav > button:focus-visible { outline:2px solid #818cf8; outline-offset:-4px; }
.paper-tabs > .paper-tabs-content { padding:18px; background:var(--tabs-surface); }
.paper-tab-panel { min-width:0; }
.paper-tab-panel > :first-child { margin-top:0; }
.paper-tab-panel > :last-child { margin-bottom:0; }
:root[data-mode=dark] .prose-paper .paper-tabs {
 --tabs-line:#3a3e50; --tabs-bar:#1d202c; --tabs-surface:#272b3a;
 --tabs-text:#a3aec2; --tabs-active:#eef2ff;
}
@media(max-width:767.98px) {
 .paper-tabs > .paper-tabs-nav { padding:4px 6px 0; }
 .paper-tabs > .paper-tabs-nav > button { padding:9px 11px; font-size:13px; }
 .paper-tabs > .paper-tabs-content { padding:12px; }
}
