/* Intro uses the existing star canvas without changing saved library colors. */
body[data-view="landing"] { background:#f8fafd; color:#14283e; }
body[data-view="landing"] > .rail, body[data-view="landing"] > .app { display:none; }
body:not([data-view="landing"]) .landing-page { display:none; }
body[data-view="landing"] #starfield { z-index:0; opacity:.5; }
.landing-page { position:relative; z-index:1; max-width:1200px; margin:auto; padding:0 40px; color:#14283e; }
.landing-page a { color:inherit; text-decoration:none; }
.landing-page a:focus-visible { outline:3px solid #007f96; outline-offset:6px; }
.landing-header { height:108px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #d9e3ed; }
.landing-header img { display:block; width:144px; height:auto; }
.landing-library-link { font-size:13px; font-weight:600; }
.landing-library-link span { margin-left:12px; color:#087d9c; }
.landing-hero { text-align:center; max-width:820px; margin:65px auto 48px; }
.landing-kicker { text-transform:uppercase; letter-spacing:.17em; font-size:11px; font-weight:700; color:#08768d; margin:0 0 18px; }
.landing-hero h1 { font-size:clamp(40px,5.3vw,68px); line-height:1.08; font-weight:650; letter-spacing:-.055em; margin:0 0 24px; }
.landing-hero h1 em { font-style:normal; color:#087fa0; }
.landing-description { max-width:650px; margin:0 auto 28px; color:#4b6074; font-size:17px; line-height:1.8; }
.landing-page .landing-cta { display:inline-flex; align-items:center; justify-content:center; gap:30px; background:#073d69; color:white; border:1px solid #075e86; border-radius:8px; padding:16px 28px; box-shadow:0 7px 22px #007b9c20; font-size:13px; font-weight:750; letter-spacing:.07em; }
.landing-page .landing-cta:hover { background:#086580; transform:translateY(-1px); }
.landing-access { font-size:12px; color:#5a6d7f; margin:15px 0 0; }
.landing-window { background:#ffffffeb; border:1px solid #d4e0eb; border-radius:16px; overflow:hidden; box-shadow:0 20px 65px #153c6810; }
.landing-window-label { display:flex; align-items:center; gap:10px; padding:17px 24px; border-bottom:1px solid #e3eaf1; font-size:12px; color:#526779; }
.landing-live-dot { width:7px; height:7px; background:#08a4ac; border-radius:50%; }
.landing-window-note { margin-left:auto; color:#6f7c8b; }
.landing-preview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.landing-preview { min-width:0; }
.landing-preview + .landing-preview { border-left:1px solid #e3eaf1; }
.landing-preview img { display:block; width:100%; height:190px; object-fit:cover; background:var(--preview-bg,#0b1218); }
.landing-preview > div { padding:23px 24px 27px; }
.landing-topic { color:#047e95; font-size:10px; text-transform:uppercase; letter-spacing:.1em; font-weight:700; }
.landing-preview:nth-child(2) .landing-topic { color:#7858a6; }
.landing-preview:nth-child(3) .landing-topic { color:#946522; }
.landing-preview h2 { font-size:19px; line-height:1.3; letter-spacing:-.03em; margin:10px 0; }
.landing-preview p { font-size:13px; line-height:1.7; color:#54667a; margin:0; }
.landing-preview:hover h2 { color:#087d9c; }
.landing-subjects { padding:65px 0; display:grid; grid-template-columns:1fr 1fr; gap:0 70px; }
.landing-page h2 { font-weight:650; }
.landing-subjects h2,.landing-method h2 { font-size:32px; line-height:1.2; letter-spacing:-.04em; margin:0; }
.landing-subjects > p,.landing-method-intro > p:last-child { color:#526779; line-height:1.85; font-size:15px; margin:0; }
.landing-tags { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.landing-tags span { border:1px solid #d3e2e9; background:#ffffffb8; padding:7px 17px; border-radius:30px; font-size:12px; color:#376071; }
.landing-method { border-top:1px solid #d9e3ed; padding:56px 0; display:grid; grid-template-columns:1fr 1fr; gap:85px; }
.landing-method-intro > p:last-child { margin-top:21px; }
.landing-method ol { margin:0; padding:0; list-style:none; }
.landing-method li { display:flex; gap:20px; margin:0 0 24px; }
.landing-method li > span { color:#088ca1; font-size:12px; font-family:monospace; padding-top:4px; }
.landing-method h3 { margin:0 0 6px; font-size:18px; }
.landing-method li p { margin:0; color:#526779; font-size:14px; line-height:1.7; }
.landing-footer { display:flex; justify-content:space-between; gap:20px; border-top:1px solid #d9e3ed; padding:24px 0 32px; color:#526779; font-size:12px; }
@media(max-width:700px) { .landing-page { padding:0 22px; } .landing-header { height:87px; } .landing-header img { width:118px; } .landing-library-link { font-size:11px; } .landing-hero { margin:46px auto 34px; } .landing-description { font-size:15px; } .landing-preview-grid,.landing-subjects,.landing-method { grid-template-columns:1fr; } .landing-preview + .landing-preview { border-left:0; border-top:1px solid #e3eaf1; } .landing-preview img { height:200px; } .landing-window-note { display:none; } .landing-subjects,.landing-method { padding:38px 0; gap:22px; } .landing-tags { margin-top:0; } .landing-footer { flex-direction:column; gap:10px; } }
.landing-header { position:relative; z-index:5; }
.landing-menu { position:relative; }
.landing-page .landing-menu-toggle { display:grid; place-items:center; width:48px; height:48px; padding:0; background:transparent; border:1px solid transparent; border-radius:8px; color:#143c57; cursor:pointer; }
.landing-page .landing-menu-toggle:hover,.landing-page .landing-menu-toggle[aria-expanded="true"] { background:#eaf3f7; border-color:#cfe1e9; }
.landing-navigation { position:absolute; right:0; top:calc(100% + 18px); width:420px; max-width:calc(100vw - 44px); max-height:calc(100dvh - 125px); overflow-y:auto; overscroll-behavior:contain; background:#f8fafdfc; border:1px solid #d4e0eb; border-radius:12px; box-shadow:0 18px 55px #163c6826; padding:8px 22px; }
.landing-navigation[hidden] { display:none; }
.landing-navigation details { border-bottom:1px solid #d4e0eb; }
.landing-navigation summary { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:23px 0; cursor:pointer; list-style:none; text-transform:uppercase; letter-spacing:.025em; font-size:17px; font-weight:500; }
.landing-navigation summary::-webkit-details-marker { display:none; }
.landing-navigation summary::after { content:'+'; color:#087f96; font-size:28px; font-weight:300; line-height:1; }
.landing-navigation details[open] summary::after { content:'−'; }
.landing-menu-links { padding:0 0 18px; }
.landing-menu-links a { display:block; padding:9px 10px; border-radius:5px; font-size:14px; color:#3c566b; }
.landing-menu-links a:hover { background:#e5f1f5; color:#006b83; }
.landing-menu-links p { margin:0 10px 12px; font-size:14px; line-height:1.7; color:#526779; }
.landing-menu-help { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:22px 0; font-size:14px; }
.landing-navigation :is(a,summary):focus-visible { outline:2px solid #087f96; outline-offset:2px; }
@media(max-width:700px) { .landing-navigation { width:calc(100vw - 44px); top:calc(100% + 12px); } }
.landing-header { gap:24px; }
.landing-menu { margin-left:auto; }
.landing-header-actions { display:flex; align-items:center; gap:10px; }
.landing-page .landing-icon-button { width:42px; height:44px; display:grid; place-items:center; padding:9px; background:transparent; color:#14283e; border:0; border-radius:7px; cursor:pointer; }
.landing-icon-button svg { width:25px; height:25px; }
.landing-page .landing-icon-button:hover { background:#e5f1f5; }
.landing-dialog { color-scheme:light; width:min(620px,calc(100vw - 32px)); max-height:80dvh; border:1px solid #d4e0eb; border-radius:14px; background:#f8fafd; color:#14283e; padding:28px; box-shadow:0 24px 80px #102f5940; }
.landing-dialog::backdrop { background:#10243b66; backdrop-filter:blur(4px); }
.landing-dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.landing-dialog-heading h2 { margin:0; font-size:24px; }
.landing-dialog-heading button { color:#14283e; background:transparent; border:0; font-size:28px; padding:2px 12px; cursor:pointer; }
.landing-dialog label { display:block; color:#526779; font-size:13px; margin-bottom:10px; }
.landing-dialog input { width:100%; padding:14px; background:#fff; color:#14283e; border:1px solid #a7bdce; border-radius:7px; font:inherit; }
#landingSearchStatus { font-size:13px; color:#526779; }
.landing-search-results a { display:block; padding:14px 10px; border-top:1px solid #d9e3ed; }
.landing-search-results a:hover { background:#e5f1f5; }
.landing-search-results small { display:block; color:#526779; margin-top:4px; }
.landing-dialog p { color:#526779; line-height:1.8; }
.landing-dialog .landing-account-label { color:#08768d; font-weight:650; }
.landing-page .landing-account-link { display:block; color:#08768d; margin-top:16px; }
@media(min-width:901px) {
  .landing-page .landing-menu-toggle { display:none; }
  .landing-navigation { position:static; display:flex; align-items:center; gap:26px; width:auto; max-width:none; max-height:none; overflow:visible; background:transparent; border:0; box-shadow:none; padding:0; }
  .landing-navigation details { position:relative; border:0; }
  .landing-navigation summary { font-size:12px; padding:18px 0; white-space:nowrap; }
  .landing-navigation summary::after { display:none; }
  .landing-navigation details[open] summary { color:#087f96; }
  .landing-menu-links { position:absolute; top:100%; right:0; width:290px; max-height:70dvh; overflow-y:auto; background:#f8fafd; border:1px solid #d4e0eb; border-radius:10px; box-shadow:0 18px 55px #163c6826; padding:14px; }
  .landing-menu-help { display:none; }
}
@media(max-width:900px) {
  .landing-header { gap:12px; }
  .landing-header-actions { order:1; margin-left:auto; gap:2px; }
  .landing-menu { order:2; margin-left:0; }
  .landing-navigation { width:min(420px,calc(100vw - 44px)); }
}
@media(max-width:450px) { .landing-header { gap:6px; } .landing-header img { width:106px; } .landing-page .landing-icon-button { width:36px; } .landing-dialog { padding:20px; } }