/* Homepage product illustration: intentionally static, with one real CTA. */
.home-circle-preview{padding:clamp(56px,7vw,110px) 0;background:var(--paper);color:var(--ink)}
.hcp-intro{max-width:760px;margin-bottom:36px}.hcp-intro h2{margin:14px 0;font:400 clamp(32px,4vw,58px)/1.04 "Libre Caslon Display",serif;letter-spacing:-.025em}.hcp-intro p{max-width:560px;color:var(--muted);font:18px/1.5 "Newsreader",serif}
.hcp-window{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--cream);box-shadow:0 24px 64px #29231e12}.hcp-hero{position:relative;isolation:isolate;min-height:290px;display:flex;align-items:center;overflow:hidden}.hcp-hero>img{position:absolute;z-index:-1;right:0;top:0;width:66%;height:100%;object-fit:cover;object-position:right center;mask-image:linear-gradient(to right,transparent,#000 48%)}.hcp-identity{width:65%;padding:40px}.hcp-identity h3{margin:12px 0;font:400 clamp(30px,3.7vw,51px)/1.05 "Libre Caslon Display",serif}.hcp-identity>p{font:17px/1.5 "Newsreader",serif}.hcp-readers{display:flex;align-items:center;margin-top:22px}.hcp-readers>span{display:grid;place-items:center;width:35px;height:35px;margin-right:-5px;border:2px solid var(--cream);border-radius:50%;background:#d7e3df;color:#2b5661;font:600 12px "DM Sans",sans-serif}.hcp-readers>span:nth-child(2){background:#e9dcc3}.hcp-readers>span:nth-child(3){background:#cbd8df}.hcp-readers small{margin-left:17px;color:var(--muted)}
.hcp-labels{display:flex;gap:30px;margin:0 32px;border-bottom:1px solid var(--line);overflow:hidden;color:var(--muted);font:12px "DM Sans",sans-serif}.hcp-labels>*{padding:19px 0;white-space:nowrap}.hcp-labels strong{border-bottom:2px solid #356b7b;color:var(--ink)}
.hcp-content{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:25px;padding:30px 32px 34px}.hcp-reading,.hcp-aside{min-width:0}.hcp-reading>h4{margin:8px 0 18px;font:400 30px "Libre Caslon Display",serif}.hcp-book{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:20px;border:1px solid var(--line);border-radius:10px}.hcp-cover{display:flex;flex-direction:column;align-items:center;justify-content:space-between;min-height:210px;padding:22px 12px;background:linear-gradient(100deg,#223f4b,#406576 8%,#294c5c 12%,#375d6c);color:#f8edda;box-shadow:4px 6px 10px #29231e26;text-align:center;border-radius:2px 5px 5px 2px}.hcp-cover strong{font:400 27px/1.1 "Libre Caslon Display",serif}.hcp-cover small,.hcp-cover>span{font:10px "DM Sans",sans-serif;letter-spacing:.1em}.hcp-book-copy{align-self:center;min-width:0}.hcp-book-copy h5{margin:14px 0 5px;font:400 28px/1.1 "Libre Caslon Display",serif}.hcp-book-copy p{font:16px/1.5 "Newsreader",serif;color:var(--muted)}.hcp-book-copy small{font-size:11px;color:var(--muted)}.hcp-feature{display:block;margin-top:20px;color:#356b7b;font:600 12px/1.5 "DM Sans",sans-serif}.hcp-shelf{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.hcp-shelf>span{width:100%;color:var(--muted);font-size:12px}.hcp-shelf strong{padding:12px 16px;border:1px solid var(--line);border-radius:6px;font:400 17px "Newsreader",serif}.hcp-aside{display:grid;gap:16px}.hcp-card{padding:22px;border:1px solid var(--line);border-radius:10px}.hcp-card h4{margin:0 0 16px;color:var(--wine);font:700 10px "DM Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase}.hcp-message{max-width:94%;margin-top:10px;padding:13px 16px;border-radius:4px 14px 14px;background:color-mix(in srgb,var(--linen) 45%,var(--cream))}.hcp-message:nth-of-type(2){margin-left:auto}.hcp-message b{font:600 10px "DM Sans",sans-serif}.hcp-message p{margin:7px 0 0;font:16px/1.4 "Newsreader",serif}.hcp-notebook ul{padding:0;margin:0;list-style:none}.hcp-notebook li{padding:9px 0;border-bottom:1px solid var(--line);font:16px "Newsreader",serif}.hcp-notebook>p{font-size:11px;line-height:1.5;color:var(--muted)}.hcp-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:28px}.hcp-footer strong{font:400 25px "Newsreader",serif}.hcp-footer p{font-size:12px;color:var(--muted)}.home-circle-preview .button.primary{background:#356b7b;border-color:#356b7b;color:#fff}.home-circle-preview .button.primary:hover{background:#285361}
html[data-theme=dark] .hcp-hero>img{opacity:.6}html[data-theme=dark] .hcp-feature{color:#8bc2cc}
@media(max-width:900px){.hcp-content{grid-template-columns:1fr}.hcp-aside{grid-template-columns:1fr 1fr}.hcp-identity{width:78%}}
@media(max-width:560px){.hcp-hero{padding-top:130px}.hcp-hero>img{width:100%;height:220px;mask-image:linear-gradient(#000,transparent)}.hcp-identity{padding:24px;width:100%}.hcp-labels{margin:0 20px;gap:20px;font-size:11px}.hcp-content{padding:22px 18px;gap:20px}.hcp-book{grid-template-columns:95px minmax(0,1fr);padding:14px;gap:15px}.hcp-cover{min-height:170px;padding:18px 8px}.hcp-cover strong{font-size:22px}.hcp-book-copy h5{font-size:23px}.hcp-aside{grid-template-columns:1fr}.hcp-footer{align-items:stretch;flex-direction:column}.hcp-footer .button{text-align:center}}
/* Keep the same blue actions in every theme; destructive actions retain warnings. */
.circle-studio,.reader-body{--wine:#356b7b;--action:#356b7b;--action-ink:#fff;--reader-accent:#356b7b}
html[data-theme=dark] .circle-studio,html[data-theme=dark] .reader-body{--wine:#8bc2cc;--action:#356b7b;--action-ink:#fff}
.circle-studio .button.primary,.reader-body .button.primary{background:#356b7b;border-color:#356b7b;color:#fff}
.circle-studio .button.primary:hover,.reader-body .button.primary:hover{background:#285361;border-color:#285361}
.circle-studio .circle-tabs a.active{border-bottom-color:#356b7b}
/* Bubble content must retain its inset even under the Circle layout rules. */
.circle-studio .circle-chat-list{gap:16px;padding:16px 10px 28px}
.circle-studio .circle-chat-message:not(.system)>div{box-sizing:border-box;min-width:0;padding:18px 22px;overflow-wrap:anywhere}
.circle-studio .circle-chat-message header{flex-wrap:wrap;gap:7px 12px;line-height:1.5}
.circle-studio .circle-chat-message p{margin:12px 0;line-height:1.6;overflow-wrap:anywhere}
.circle-studio .circle-chat-message footer{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;padding-top:10px;border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.circle-studio .circle-chat-message footer button{min-height:32px;padding:6px 12px}
.circle-studio .circle-chat-message.system{max-width:100%;padding:16px 22px;text-align:center;line-height:1.6;overflow-wrap:anywhere}
.circle-studio .circle-chat-message.system .circle-chat-reading{display:block;margin-top:8px}
.circle-studio .circle-chat-message.mine>div,.gathering-chat-messages article.mine{background:#356b7b;border-color:#285361;color:#fff;box-shadow:0 4px 12px #193e4d22}
.circle-studio .circle-chat-message.mine footer button:not([data-chat-delete]){background:#285361;color:#fff}
@media(max-width:560px){.circle-studio .circle-chat-message:not(.system){max-width:96%}.circle-studio .circle-chat-message:not(.system)>div{padding:15px 17px}.circle-studio .circle-chat-message header time{font-size:10px}}
.reader-body .marginalia-chat-launcher{border-color:color-mix(in srgb,#356b7b 44%,var(--reader-rule));background:color-mix(in srgb,#356b7b 8%,#f8f1e5)}
.reader-body .marginalia-chat-launcher i{background:#356b7b;color:#fff}
.reader-body .marginalia-chat-launcher em{color:#356b7b;background:#356b7b14}
.reader-body .marginalia-chat-launcher:hover,.reader-body .marginalia-chat-launcher:focus-visible{border-color:#356b7b;background:#356b7b1f}
html[data-theme=dark] .reader-body .marginalia-chat-launcher{border-color:#356b7b;background:#202b2e}
html[data-theme=dark] .reader-body .marginalia-chat-launcher em{color:#8bc2cc}
.reader-body .gathering-chat-messages article.mine button{background:#285361;color:#fff}
.reader-body .gathering-chat-messages article.mine button:hover{background:#1e424e}
/* Reader headers have their own important rules, separate from primary buttons. */
.reader-body .reader-top .invite-button{background:#356b7b!important;border-color:#356b7b!important;color:#fff!important}
.reader-body .reader-top .invite-button:hover,.reader-body .reader-top .invite-button:focus-visible{background:#285361!important;border-color:#285361!important;color:#fff!important}
.reader-body .reader-top .invite-button:focus-visible{outline:2px solid #8bc2cc;outline-offset:3px}
/* One gold-and-ivory brand lockup for public pages, account navigation and footer. */
.brand>i{display:none!important}
.ql-brand-lockup{display:inline-flex!important;align-items:center;gap:10px;width:auto!important;height:auto!important;background:none!important;color:inherit;vertical-align:middle;line-height:1;white-space:nowrap}
.ql-brand-lockup::before,.ql-brand-lockup::after{content:none!important}
.ql-brand-lockup .ql-brand-icon{display:block!important;flex:0 0 34px;width:34px!important;height:34px!important;object-fit:contain;filter:none!important;opacity:1!important;border:0;border-radius:0;background:none}
.ql-brand-lockup .ql-brand-word{display:inline!important;width:auto!important;height:auto!important;background:none!important;font:400 28px/1 "Libre Caslon Display",serif!important;letter-spacing:-.025em;color:inherit;text-indent:0;opacity:1}
.ql-brand-word::before,.ql-brand-word::after{content:none!important}
.site-footer .ql-brand-lockup{color:var(--ink)}
@media(max-width:600px){.ql-brand-lockup{gap:8px}.ql-brand-lockup .ql-brand-icon{flex-basis:28px;width:28px!important;height:28px!important}.ql-brand-lockup .ql-brand-word{font-size:24px!important}}
/* System events also need padding inside the colored bubble, not just outside it. */
.circle-studio .circle-chat-message.system>div{box-sizing:border-box;min-width:0;max-width:100%;padding:18px 22px;overflow-wrap:anywhere}
.circle-studio .circle-chat-message.system>div>p{margin:0;font-size:14px;line-height:1.6;white-space:normal}
.circle-studio .circle-chat-message.system>div>.circle-chat-reading{display:block;margin-top:10px;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:600px){.circle-studio .circle-chat-message.system>div{padding:15px 17px}}

/* Shared action color across the website, independent of reading theme. */
:root,html[data-theme="dark"]{--action:#356b7b;--action-ink:#fff}
.button.primary{background:var(--action);border-color:var(--action);color:var(--action-ink)}
.button.primary:hover{background:#285361;border-color:#285361;color:#fff}

/* One action palette across public pages, workspace screens and reader tools.
   Theme accent text may be pale blue; filled actions must remain deep blue. */
html body {
    --button-primary-bg: #356b7b;
    --button-primary-hover: #285361;
    --button-primary-active: #1e424e;
    --button-primary-text: #fff;
    --action: var(--button-primary-bg);
    --action-ink: var(--button-primary-text);
    --nb-accent: var(--button-primary-bg);
    --record-action: var(--button-primary-bg);
}
html body :is(.notebook-shell, .record-shell) {
    --nb-accent: var(--button-primary-bg);
    --record-action: var(--button-primary-bg);
}
html body :is(
    .button.primary,
    .gathering-continue,
    .reader-top .invite-button,
    .cp-save button, .cp-create button, .cp-categories button, .cp-reading-list button,
    .record-search button, .record-filters button, .record-more,
    .notebook-source button, .notebook-export summary,
    .block-adder button:first-child,
    #annotation-form .creation-actions > button,
    .thread-form .reply-actions > button:last-child,
    .inline-comment-composer .draft-actions > button:last-child
):not(:is(.danger, .destructive, .destructive-choice, .delete-library-book, [data-chat-delete])) {
    background: var(--button-primary-bg) !important;
    border-color: var(--button-primary-bg) !important;
    color: var(--button-primary-text) !important;
}
html body :is(
    .button.primary, .gathering-continue, .reader-top .invite-button,
    .cp-save button, .cp-create button, .cp-categories button, .cp-reading-list button,
    .record-search button, .record-filters button, .record-more,
    .notebook-source button, .notebook-export summary, .block-adder button:first-child,
    #annotation-form .creation-actions > button,
    .thread-form .reply-actions > button:last-child,
    .inline-comment-composer .draft-actions > button:last-child
):not(:is(.danger, .destructive, .destructive-choice, .delete-library-book, [data-chat-delete], :disabled, [aria-disabled="true"])):hover {
    background: var(--button-primary-hover) !important;
    border-color: var(--button-primary-hover) !important;
    color: var(--button-primary-text) !important;
}
html body .button.primary:not(:is(.danger, .destructive, :disabled, [aria-disabled="true"])):active {
    background: var(--button-primary-active) !important;
    border-color: var(--button-primary-active) !important;
}
html body :is(.button.primary, .gathering-continue, .reader-top .invite-button):focus-visible {
    outline: 2px solid var(--ink);
    outline-offset: 3px;
}
