:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #161c39;
  --muted: #515d77;
  --blue: #354cc2;
  --line: rgba(88, 103, 160, .17);
  background: #e9effc;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(ellipse at 84% 13%, #babafb 0, transparent 41%),
    radial-gradient(ellipse at 8% 40%, #d5f1f7 0, transparent 46%),
    radial-gradient(ellipse at 91% 96%, #ddd2fa 0, transparent 42%),
    linear-gradient(145deg, #edf4ff 6%, #e9efff 59%, #e9eafe 100%);
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .52; }
button, a, input { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid #4d5fd0; outline-offset: 4px; }
.shell { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 28px 0 20px; }
.glass {
  background: linear-gradient(145deg, rgba(255,255,255,.75), rgba(252,253,255,.45));
  border: 1px solid rgba(255,255,255,.83);
  box-shadow: 0 18px 50px rgba(52,66,130,.09), inset 0 1px 0 rgba(255,255,255,.75);
  backdrop-filter: blur(26px) saturate(145%);
}
.nav { height: 62px; border-radius: 36px; padding: 0 22px 0 12px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 17px; font-weight: 750; letter-spacing: -.035em; }
.brand small { color: #556382; font-size: 10px; margin-left: 9px; letter-spacing: .16em; font-weight: 700; }
.mark, .tile { display: grid; place-items: center; flex: none; }
.mark { width: 37px; height: 37px; color: white; border-radius: 14px; background: linear-gradient(145deg,#8796fd,#4d5bc9); box-shadow: inset 0 1px 2px #ffffff90, 0 4px 9px #5562c34b; }
.mark svg, .tile svg { width: 22px; height: 22px; }
.nav { position: relative; z-index: 3; }
.unlock-page { display: grid; place-items: center; padding: 20px; }
.unlock-panel { width: min(100%, 420px); }
.unlock-panel h1 { font-size: clamp(30px, 7vw, 43px); }
.unlock-panel p { color: var(--muted); margin: 0 0 18px; }
.unlock-panel .primary, .unlock-panel .notice { margin: 13px 0 0; }
.nav-actions { display: flex; align-items: center; gap: 8px; }
.account-menu { position: relative; }
.account-menu summary { display: flex; align-items: center; min-height: 35px; padding: 7px 12px; border-radius: 100px; cursor: pointer; background: #ffffffa0; list-style: none; }
.account-menu summary::-webkit-details-marker { display: none; }
.account-panel { position: absolute; top: calc(100% + 13px); right: 0; width: min(340px, calc(100vw - 38px)); padding: 17px; border-radius: 22px; background: #f5f7ffed; }
.account-panel h2 { font-size: 16px; margin: 0 0 12px; }
.hero { min-height: 298px; display: flex; align-items: center; position: relative; isolation: isolate; }
.hero-copy { position: relative; z-index: 1; padding: 33px 0 30px 8px; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: #4153ac; font-size: 12px; font-weight: 750; letter-spacing: .13em; }
.eyebrow span { width: 16px; height: 1px; background: #687ad7; }
h1 { font-size: clamp(43px, 5.4vw, 76px); margin: 15px 0 17px; letter-spacing: -.085em; line-height: 1.12; font-weight: 790; }
h1 em { font-style: normal; color: #424cc4; }
.hero p { margin: 0; line-height: 1.85; color: #435071; font-size: 16px; }
.lens { position: absolute; inset: 0 20px 0 auto; width: 390px; pointer-events: none; }
.lens-glow { position: absolute; width: 275px; height: 165px; top: 68px; left: 58px; background: radial-gradient(ellipse, #6d67e2a3, transparent 69%); filter: blur(29px); transform: rotate(-18deg); }
.lens-sheet { position: absolute; border: 1px solid #ffffffb8; box-shadow: 0 25px 36px #4a45a538, inset 1px 1px 8px #ffffffc7, inset -7px -9px 22px #4b52a42b; }
.lens-back { top: 58px; left: 128px; width: 176px; height: 161px; border-radius: 46px 62px 53px 58px; background: linear-gradient(145deg,#f2f8ffd9,#9ca6ff66 61%,#a1a0f0e6); transform: rotate(-23deg); }
.lens-front { top: 66px; left: 145px; width: 166px; height: 162px; border-radius: 52px 48px 58px 46px; background: linear-gradient(154deg,#ffffffd9 2%,#f4f7ffc2 29%,#c7cdff81 63%,#8e8df0ae 100%); backdrop-filter: blur(6px); transform: rotate(13deg); display: grid; place-items: center; color: #4b55b6; }
.lens-front svg { width: 86px; height: 86px; filter: drop-shadow(0 2px 0 #fff8); }
.lens-dot { position: absolute; width: 28px; height: 28px; left: 308px; top: 189px; border-radius: 50%; background: radial-gradient(circle at 30% 24%,#fff,#c6c5f9 60%,#8e8ed5); border: 1px solid #fff9; box-shadow: 0 6px 15px #5a4caf48; }
.workspace { display: grid; grid-template-columns: 1.06fr 1fr; gap: 20px; align-items: start; }
.panel { border-radius: 32px; padding: 26px; min-width: 0; }
.panel-head { display: flex; align-items: center; gap: 13px; margin-bottom: 24px; }
.tile { width: 44px; height: 44px; border-radius: 16px; color: #4058b5; background: linear-gradient(145deg,#f6f9ff,#d6e3ff); border: 1px solid #fff; box-shadow: 0 4px 9px #859bdb24; }
.lavender { color: #5945b3; background: linear-gradient(145deg,#fcf7ff,#e1d7fa); }
.panel-head h2 { font-size: 21px; line-height: 1.25; margin: 0 0 4px; letter-spacing: -.045em; }
.panel-head p, .method p, .empty p { font-size: 12px; line-height: 1.5; color: var(--muted); margin: 0; }
form > label, .auth-label { font-size: 13px; font-weight: 690; }
form > label { display: block; margin-bottom: 8px; }
input, select { display: block; width: 100%; min-width: 0; padding: 12px 13px; border: 1px solid var(--line); border-radius: 13px; background: #ffffff80; color: #172346; font-size: 13px; min-height: 44px; }
input::placeholder { color: #606d8b; }
.auth-label { display: flex; justify-content: space-between; align-items: center; margin: 17px 0 8px; }
.auth-state { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); }
.auth-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #828ba6; }
.auth-state[data-state="ready"] { color: #176d57; }
.auth-state[data-state="ready"]::before { background: #299974; }
.auth-state[data-state="waiting"]::before { background: #525ed1; }
.auth-state[data-state="error"] { color: #923b51; }
.auth-state[data-state="error"]::before { background: #aa415c; }
.segmented { display: flex; gap: 3px; padding: 3px; background: #d2dcf672; border: 1px solid #ffffff68; border-radius: 15px; }
.segmented button { flex: 1; border: 0; border-radius: 11px; padding: 8px; background: transparent; color: #4c587b; font-size: 13px; font-weight: 650; min-height: 34px; }
.segmented button[aria-pressed="true"] { background: #fbfcffdf; box-shadow: 0 2px 8px #4358901f, inset 0 1px 0 #fff; color: #253972; }
.method { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 54px; margin: 5px 0 10px; }
.cookie-method { display: grid; padding-top: 7px; gap: 7px; }
.cookie-actions { min-height: 0; margin: 0; }
.text-button { border: 0; padding: 3px 0; background: transparent; color: var(--blue); font-size: 12px; font-weight: 700; }
.text-button:hover:not(:disabled) { text-decoration: underline; }
.source-panel { display: grid; gap: 8px; margin-top: 13px; }
.source-panel label { display: block; margin: 0; color: #334269; font-size: 12px; font-weight: 700; }
.secondary-details { color: var(--muted); font-size: 12px; }
.secondary-details summary { color: var(--blue); cursor: pointer; width: fit-content; padding: 5px 0; font-weight: 650; }
.secondary-details input, .latest { margin-top: 5px; }
.date-fields { display: flex; gap: 9px; }
.date-fields > div { flex: 1; min-width: 0; }
.date-fields label { margin-bottom: 5px; }
.latest { max-height: 210px; overflow: auto; }
.catalog-status { color: var(--muted); font-size: 12px; min-height: 15px; margin: 8px 0 11px; }
.digests { margin-top: 20px; }
.digest-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: 22px; }
.digest-grid > div { min-width: 0; }
.digest-label { display: flex; align-items: center; justify-content: space-between; margin: 0 0 8px; font-size: 13px; font-weight: 700; }
.digest-choices, .digest-results { max-height: 260px; overflow: auto; margin: 9px 0 12px; }
.digest-choice { display: flex; align-items: center; gap: 8px; padding: 7px 4px; font-size: 13px; }
.digest-choice input { width: 16px; height: 16px; min-height: 0; accent-color: var(--blue); }
.digest-entry { border-bottom: 1px solid var(--line); padding: 8px 2px; }
.digest-entry summary { cursor: pointer; font-weight: 700; font-size: 13px; }
.digest-entry p { color: var(--muted); white-space: pre-wrap; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.digest-entry a { color: var(--blue); font-size: 12px; text-decoration: underline; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; border-radius: 100px; font-weight: 730; white-space: nowrap; }
.subtle { padding: 8px 12px; color: #34479c; background: #fbfcffc7; border: 1px solid #fff; box-shadow: 0 2px 9px #4d5b9c1a; font-size: 12px; min-height: 35px; }
.subtle:hover:not(:disabled) { background: #fff; }
.primary { color: #fff; width: 100%; height: 47px; border: 1px solid #5f70d7; background: linear-gradient(145deg,#596ad6,#4054c0); box-shadow: 0 9px 19px #435bc43b, inset 0 1px 2px #ffffff65; font-size: 14px; }
.primary:hover:not(:disabled) { background: linear-gradient(145deg,#4e60d1,#364ab2); }
.primary svg { width: 17px; height: 17px; }
.notice { font-size: 12px; line-height: 1.5; color: #8b3349; background: #fff0f4b0; border-radius: 12px; padding: 9px 12px; margin: 0 0 12px; overflow-wrap: anywhere; }
.progress-panel { margin-top: 17px; }
.progress-head { display: flex; justify-content: space-between; align-items: center; color: #3c4c84; font-size: 12px; }
progress { display: block; width: 100%; margin-top: 8px; height: 8px; border: 0; border-radius: 7px; overflow: hidden; accent-color: #5469d4; }
progress::-webkit-progress-bar { background: #d7dff8; border-radius: 7px; }
progress::-webkit-progress-value { background: linear-gradient(90deg,#5267ce,#8295f2); border-radius: 7px; }
.progress-panel p { font-size: 12px; color: var(--muted); margin: 7px 0 0; overflow-wrap: anywhere; }
.download { margin-left: auto; }
.library-tabs { margin-bottom: 13px; }
.archive-report { margin-bottom: 10px; }
.library-controls { display: grid; gap: 6px; margin-bottom: 13px; }
.library-controls label { display: block; color: #334269; font-size: 12px; font-weight: 700; }
.library-controls div select { margin-top: 6px; }
.reader { width: min(900px, calc(100% - 32px)); max-width: none; padding: 0; border: 1px solid #fff; border-radius: 26px; background: #f3f5ff; color: #161c39; box-shadow: 0 18px 70px #19234566; overflow: hidden; }
.reader::backdrop { background: #151c4580; backdrop-filter: blur(5px); }
.reader-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 20px; }
.reader-header form { display: flex; gap: 6px; }
.reader-header span { color: #485caa; font-size: 11px; font-weight: 700; }
.reader-header h2 { margin: 3px 0 0; font-size: clamp(15px, 2vw, 20px); overflow-wrap: anywhere; }
.reader iframe { display: block; width: 100%; height: min(73dvh, 760px); border: 0; border-top: 1px solid var(--line); background: #fff; }
.archive-summary { display: flex; align-items: flex-end; justify-content: space-between; padding: 13px 15px; gap: 10px; border-radius: 18px; border: 1px solid #ffffffae; background: linear-gradient(125deg,#e6ecffbd,#e5def9b6); }
.archive-summary strong { font-size: 32px; font-weight: 790; line-height: 1; letter-spacing: -.065em; font-variant-numeric: tabular-nums; color: #313e9b; margin-right: 7px; }
.archive-summary span, .archive-summary a { font-size: 12px; color: #465681; }
.archive-summary a { padding-bottom: 2px; }
.archive-summary a:hover, .articles a:hover .article-title { color: #3146be; text-decoration: underline; }
.archive-note { font-size: 12px; color: #7d405a; margin: 10px 0 0; }
.articles { list-style: none; margin: 9px 0 0; padding: 0; }
.articles li { border-bottom: 1px solid var(--line); }
.articles a, .articles .unavailable { display: flex; align-items: center; gap: 9px; padding: 9px 2px; min-height: 42px; }
.article-number { font-size: 10px; color: #5669a6; font-weight: 760; min-width: 18px; font-variant-numeric: tabular-nums; }
.article-copy { flex: 1; min-width: 0; }
.article-title { display: block; font-size: 12px; font-weight: 680; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.article-author { display: block; font-size: 10px; color: var(--muted); margin-top: 2px; }
.article-arrow { font-size: 13px; color: #5364ab; }
.more { display: block; margin: 9px auto 0; border: 0; background: transparent; color: #3d4fb0; font-weight: 680; font-size: 12px; padding: 5px 10px; }
.more:hover { text-decoration: underline; }
.empty { display: grid; gap: 7px; place-content: center; text-align: center; min-height: 222px; border: 1px dashed #a8b6de; border-radius: 18px; color: #40517f; }
footer { display: flex; justify-content: space-between; gap: 12px; color: #536182; font-size: 11px; padding: 22px 8px 0; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

@media (max-width: 850px) {
  .shell { width: min(650px, calc(100% - 38px)); }
  .workspace { grid-template-columns: 1fr; }
  .digest-grid { grid-template-columns: 1fr; }
  .hero { min-height: 248px; }
  .lens { transform: scale(.75); transform-origin: right center; right: 0; }
}
@media (max-width: 510px) {
  .shell { width: calc(100% - 28px); padding-top: 15px; }
  .nav { height: 54px; padding-right: 13px; }
  .brand small, .desktop { display: none; }
  .hero { min-height: 219px; }
  .hero-copy { padding-left: 3px; }
  .hero p { font-size: 13px; max-width: 270px; }
  .lens { transform: scale(.46); right: -7px; opacity: .62; }
  .panel { padding: 18px; border-radius: 24px; }
  .panel-head { gap: 8px; }
  .panel-head h2 { font-size: 18px; }
  .tile { width: 38px; height: 38px; border-radius: 13px; }
  .download { padding: 7px 9px; }
}
@media (prefers-reduced-transparency: reduce) {
  .glass { background: #f3f6ff; backdrop-filter: none; }
}

:root[data-theme="dark"] { color-scheme: dark; color: #edf0ff; background: #111527; --muted: #b8c3dc; --blue: #a9b8ff; --line: #a4b4ec36; }
[data-theme="dark"] body { background: radial-gradient(ellipse at 85% 9%, #333261, transparent 40%), radial-gradient(ellipse at 9% 34%, #193748, transparent 45%), #151a2d; }
[data-theme="dark"] .glass { background: linear-gradient(145deg,#273450df,#242a45d9); border-color: #bbc7ff39; box-shadow: 0 14px 38px #070b1e50, inset 0 1px 0 #ffffff16; }
[data-theme="dark"] .account-panel { background: #222a43f5; }
[data-theme="dark"] .account-menu summary, [data-theme="dark"] .subtle { color: #dfe5ff; background: #39466d; border-color: #8295df64; }
[data-theme="dark"] .subtle:hover:not(:disabled) { background: #485881; }
[data-theme="dark"] h1 em, [data-theme="dark"] .eyebrow, [data-theme="dark"] .more, [data-theme="dark"] .secondary-details summary,
[data-theme="dark"] .article-arrow, [data-theme="dark"] .article-number, [data-theme="dark"] .progress-head { color: #b9c5ff; }
[data-theme="dark"] .hero p, [data-theme="dark"] footer, [data-theme="dark"] .brand small,
[data-theme="dark"] .library-controls label, [data-theme="dark"] .source-panel label { color: var(--muted); }
[data-theme="dark"] .segmented { background: #141c31bb; border-color: #cbd4ff25; }
[data-theme="dark"] .segmented button { color: #b9c8e9; }
[data-theme="dark"] .segmented button[aria-pressed="true"] { background: #415079; color: #fff; box-shadow: inset 0 1px 0 #fff3; }
[data-theme="dark"] input, [data-theme="dark"] select { color: #e5ebff; background: #161f36; }
[data-theme="dark"] input::placeholder { color: #a3afcb; }
[data-theme="dark"] .archive-summary { background: #393b64; border-color: #b3b6ff33; }
[data-theme="dark"] .archive-summary strong { color: #c4caff; }
[data-theme="dark"] .archive-summary span, [data-theme="dark"] .empty { color: #c1cbea; }
[data-theme="dark"] .notice, [data-theme="dark"] .archive-note, [data-theme="dark"] .auth-state[data-state="error"] { color: #ffc5d3; }
[data-theme="dark"] .notice { background: #6b314d80; }
[data-theme="dark"] .auth-state[data-state="ready"] { color: #a0f0cb; }
[data-theme="dark"] .reader, [data-theme="dark"] .reader iframe { color: #edf0ff; background: #171d32; border-color: #aab7ea48; }