/* Shared academic feed and reader. No background capture/filter; order is always row-major. */
.academic-info { min-width:0; width:100%; container-type:inline-size; container-name:academic-feed; color:var(--c-ink,#10243a); font-family:var(--f-body,system-ui,sans-serif); }
.hb-web-portal .academic-info { --f-body:var(--font-body,system-ui,sans-serif); --c-ink:var(--color-ink,#10243a); --c-body:var(--color-body,#3c5269); --c-muted:var(--color-muted,#566c82); --c-primary:var(--color-primary,#275dda); --c-hairline:var(--color-hairline,#d1ddea); }
.academic-info [hidden],.academic-reader [hidden] { display:none!important; }
.academic-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 14px; }
.academic-sections { display:inline-flex; padding:5px; gap:4px; border:1px solid var(--c-hairline,#d5e1ed); border-radius:20px; background:var(--hb-soft,rgba(255,255,255,.5)); min-width:0; }
.academic-section,.academic-category,.academic-button,.academic-refresh { min-height:44px; border-radius:15px; padding:10px 18px; border:1px solid transparent; font:600 .95rem/1.4 var(--f-body,system-ui,sans-serif); background:transparent; color:var(--c-body,#3e5972); cursor:pointer; touch-action:manipulation; overflow:hidden; }
.academic-section.is-active { color:var(--hb-teal,#14766a); background:var(--hb-card,rgba(255,255,255,.9)); box-shadow:0 2px 8px rgba(35,64,99,.06); }
.academic-refresh,.academic-button { border-color:var(--c-hairline,#d5e1ed); background:var(--hb-card,rgba(255,255,255,.78)); }
.academic-info :is(button,a):focus-visible,.academic-reader :is(button,a,[tabindex]):focus-visible { outline:3px solid var(--c-primary,#275cd8); outline-offset:3px; }
.academic-info button:disabled { cursor:default; opacity:.5; }
.academic-categories { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.academic-category { border-color:var(--c-hairline,#d5e1ed); background:var(--hb-card,rgba(255,255,255,.65)); }
.academic-category.is-active { color:var(--hb-teal,#14766a); background:var(--hb-active,#d6eeea); border-color:#b4d7d1; }
.academic-status,.academic-more-status { color:var(--c-muted,#607990); margin:16px 0; line-height:1.6; font-size:.9rem; }
.academic-status:empty,.academic-more-status:empty { display:none; }
.academic-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; align-items:stretch; }
.academic-card { display:flex; flex-direction:column; min-width:0; margin:0; border:1px solid var(--c-hairline,#d5e1ed); border-radius:22px; overflow:hidden; background:var(--hb-card,rgba(255,255,255,.8)); box-shadow:0 4px 20px rgba(35,64,99,.035); cursor:pointer; }
.academic-cover { display:block; width:100%; height:auto; max-height:320px; aspect-ratio:16/8; object-fit:cover; flex-shrink:0; }
.academic-card-body { padding:22px; min-width:0; display:flex; flex-direction:column; flex:1; }
.academic-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; font-size:.8rem; color:var(--c-muted,var(--color-muted,#607990)); margin-bottom:12px; }
.academic-badge { border-radius:999px; background:var(--hb-active,#d6eeea); color:var(--hb-teal,#14766a); padding:4px 10px; overflow-wrap:anywhere; }
.academic-title { font:650 1.2rem/1.5 var(--f-body,system-ui,sans-serif); color:inherit; margin:0 0 12px; overflow-wrap:anywhere; }
.academic-summary { font-size:.96rem; line-height:1.8; color:var(--c-body,#3e5972); white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 18px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.academic-card-footer { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin-top:auto; font-size:.8rem; }
.academic-card-date { display:none; color:var(--c-muted,var(--color-muted,#607990)); font-size:.6875rem; line-height:20px; white-space:nowrap; }
.academic-source { color:var(--c-muted,#607990); overflow-wrap:anywhere; min-width:0; margin-left:auto; }
.academic-open { min-height:40px; padding:6px 0; border:0; font:600 .9rem/1.5 var(--f-body,system-ui,sans-serif); color:var(--c-primary,#275cd8); background:transparent; cursor:pointer; }
.academic-link { color:var(--c-primary,var(--color-primary,#275cd8)); font-weight:600; text-decoration:none; min-height:42px; display:inline-flex; align-items:center; padding:8px 14px; border:1px solid var(--c-hairline,var(--color-hairline,#d1ddea)); border-radius:13px; background:var(--hb-soft,var(--color-canvas,#f2f6fc)); }
.academic-link:hover { text-decoration:underline; }
.academic-more { text-align:center; padding:12px 0 20px; }
.academic-load-more { min-width:180px; }
@container academic-feed (min-width:640px) {
    .academic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .academic-card:first-child { grid-column:span 2; }
    .academic-card:first-child .academic-title { font-size:1.8rem; line-height:1.45; }
    .academic-card:first-child .academic-summary { -webkit-line-clamp:4; font-size:1rem; }
    .academic-card:first-child.has-cover { display:grid; grid-template-columns:1.05fr 1fr; }
    .academic-card:first-child .academic-cover { height:100%; max-height:none; aspect-ratio:auto; object-fit:cover; }
    .academic-card:nth-child(5n+4) { background:var(--hb-soft,rgba(234,241,248,.82)); }
}
@container academic-feed (min-width:1000px) {
    .academic-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .academic-card:first-child.has-cover { grid-row:span 2; display:flex; }
    .academic-card:first-child .academic-cover { width:100%; height:300px; max-height:300px; }
    .academic-card:first-child .academic-card-body { padding:28px; }
    .academic-card:first-child .academic-title { font-size:2rem; }
}
.m-pane .academic-toolbar { margin:0 0 8px; gap:8px; }
.m-pane .academic-sections { padding:3px; gap:2px; border-radius:14px; }
.m-pane :is(.academic-section,.academic-refresh) { min-height:32px; padding:5px 12px; border-radius:11px; font-size:.8125rem; line-height:20px; }
.m-pane .academic-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
.m-pane .academic-card { min-height:100px; border-radius:18px; }
.m-pane .academic-card:first-child { grid-column:auto; grid-row:auto; }
.m-pane .academic-card.has-cover,.m-pane .academic-card:first-child.has-cover { display:grid; grid-template-columns:96px minmax(0,1fr); align-items:start; }
.m-pane .academic-card-body,.m-pane .academic-card:first-child .academic-card-body { padding:12px 14px; }
.m-pane .academic-card .academic-meta { display:none; }
.m-pane .academic-title,.m-pane .academic-card:first-child .academic-title { font-size:1rem; line-height:1.4; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.m-pane .academic-summary,.m-pane .academic-card:first-child .academic-summary { font-size:.8125rem; line-height:1.55; margin-bottom:6px; -webkit-line-clamp:1; }
.m-pane .academic-cover,.m-pane .academic-card:first-child .academic-cover { width:84px; height:84px; max-height:84px; aspect-ratio:1; margin:12px 0 12px 12px; border-radius:12px; }
.m-pane .academic-card-footer { gap:4px 8px; margin-top:0; }
.m-pane .academic-open { min-height:20px; padding:0; font-size:.75rem; line-height:20px; }
.m-pane .academic-card-date { display:block; margin-left:auto; }
.m-pane .academic-source { display:none; }
.m-pane .academic-categories { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin; padding:2px 0 4px; gap:6px; margin-bottom:10px; }
.m-pane .academic-category { flex:0 0 auto; min-height:30px; padding:4px 12px; border-radius:10px; font-size:.8125rem; line-height:20px; }
@media(max-width:700px) {
    .academic-toolbar { margin:0 0 8px; gap:8px; }
    .academic-sections { padding:3px; gap:2px; border-radius:14px; }
    .academic-section,.academic-refresh { min-height:32px; padding:5px 12px; border-radius:11px; font-size:.8125rem; line-height:20px; }
    .academic-categories { margin-bottom:10px; gap:6px; }
    .academic-category { min-height:30px; padding:4px 12px; border-radius:10px; font-size:.8125rem; line-height:20px; }
    .academic-grid { grid-template-columns:minmax(0,1fr); gap:10px; }
    .academic-card { min-height:100px; border-radius:18px; }
    .academic-card:first-child { grid-column:auto; grid-row:auto; }
    .academic-card-body,.academic-card:first-child .academic-card-body { padding:12px 14px; }
    .academic-card .academic-meta { display:none; }
    .academic-title,.academic-card:first-child .academic-title { font-size:1rem; line-height:1.4; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .academic-card.has-cover,.academic-card:first-child.has-cover { display:grid; grid-template-columns:96px minmax(0,1fr); align-items:start; }
    .academic-cover,.academic-card:first-child .academic-cover { width:84px; height:84px; max-height:84px; aspect-ratio:1; margin:12px 0 12px 12px; border-radius:12px; }
    .academic-summary,.academic-card:first-child .academic-summary { font-size:.8125rem; line-height:1.55; margin-bottom:6px; -webkit-line-clamp:1; }
    .academic-card-footer { gap:4px 8px; margin-top:0; }
    .academic-open { min-height:20px; padding:0; font-size:.75rem; line-height:20px; }
    .academic-card-date { display:block; margin-left:auto; }
    .academic-source { display:none; }
}
@media(max-width:380px) { .academic-section,.academic-refresh { padding-inline:12px; } .academic-sections { gap:0; } .academic-toolbar { gap:8px; } }

/* Native dialog owns focus/inertness; header and action footer never scroll away. */
.academic-reader { position:fixed; inset:0; margin:0; width:100%; height:100%; max-width:none; max-height:none; padding:20px; border:0; background:transparent; color:var(--c-ink,var(--color-ink,#10243a)); box-sizing:border-box; overflow:hidden; font-family:var(--f-body,var(--font-body,system-ui,sans-serif)); }
.academic-reader[open] { display:flex; align-items:center; justify-content:center; }
.academic-reader::backdrop { background:rgba(12,32,52,.42); }
.academic-reader-card { width:min(900px,100%); min-height:0; max-height:100%; display:flex; flex-direction:column; border:1px solid var(--c-hairline,var(--color-hairline,#d1ddea)); border-radius:26px; background:var(--c-canvas,var(--color-canvas,#f2f6fc)); box-shadow:0 18px 64px rgba(15,37,62,.22); overflow:hidden; transform-origin:center; }
.academic-reader-header { display:flex; gap:18px; justify-content:space-between; align-items:flex-start; padding:22px 24px 18px; flex:0 0 auto; border-bottom:1px solid var(--c-hairline,var(--color-hairline,#d1ddea)); }
.academic-reader-header>div { min-width:0; }
.academic-reader-title { font:700 1.55rem/1.5 var(--f-body,var(--font-body,system-ui,sans-serif)); margin:0; overflow-wrap:anywhere; max-height:22vh; overflow:auto; }
.academic-reader-close { width:44px; height:44px; border-radius:50%; border:1px solid var(--c-hairline,var(--color-hairline,#d1ddea)); color:inherit; background:var(--hb-card,var(--color-surface-card,#fff)); font:400 1.7rem/1 system-ui,sans-serif; flex:0 0 auto; cursor:pointer; }
.academic-reader-body { min-height:0; overflow:auto; overscroll-behavior:contain; padding:24px; scrollbar-width:thin; }
.academic-reader-summary,.academic-reader-content { margin:0 0 20px; font-size:1rem; line-height:1.95; white-space:pre-wrap; overflow-wrap:anywhere; }
.academic-reader-summary { color:var(--c-body,var(--color-body,#3e5972)); }
.academic-reader-content { color:inherit; }
.academic-reader-cover,.academic-reader-image { display:block; width:auto; max-width:100%; height:auto; max-height:70vh; object-fit:contain; margin:0 auto 22px; border-radius:16px; }
.academic-reader-footer { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px; flex:0 0 auto; border-top:1px solid var(--c-hairline,var(--color-hairline,#d1ddea)); padding:14px 24px; background:var(--hb-card,var(--color-surface-card,#fff)); }
@media(max-width:600px) {
    .academic-reader { padding:12px; padding-bottom:max(12px,env(safe-area-inset-bottom,0px)); }
    .academic-reader-card { border-radius:22px; }
    .academic-reader-header { padding:18px 16px 14px; gap:10px; }
    .academic-reader-title { font-size:1.2rem; }
    .academic-reader-body { padding:18px 16px; }
    .academic-reader-footer { padding:12px 16px; justify-content:stretch; }
    .academic-reader-footer .academic-link { flex:1; justify-content:center; font-size:.875rem; }
}
@media(prefers-reduced-motion:reduce) { .academic-reader-card { scroll-behavior:auto; } }
