/* Navigation workspace: compact content first, atmospheric imagery behind search. */
@font-face {font-family:Inter;src:url('fonts/Inter-latin.3100e775e861.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root {
  --bg:#f5f5f5; --surface:#fff; --text:#292524; --muted:#777169;
  --line:#e7e5e4; --blue:#292524; --soft:#f0efed; --shadow:0 4px 16px #0000000a;
  --body:#4e4e4e; --strong-line:#d6d3d1; --button-ink:#292524; --button-text:#fff;
  --display-font:"Songti SC","Noto Serif SC","SimSun","Times New Roman",serif;
  font-family:Inter,"Noto Sans SC","PingFang SC","Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif;
  font-size:15px;color-scheme:light;
}
:root[data-theme=dark] {
  --bg:#171513; --surface:#211e1b; --text:#f5f3f0; --muted:#b3aba3;
  --line:#37322d; --blue:#f5f3f0; --soft:#2c2723; --body:#d2cbc4;
  --strong-line:#514941; --button-ink:#f5f3f0; --button-text:#211e1b;
  --shadow:0 4px 16px #00000026;color-scheme:dark;
}
html {scroll-padding-top:24px}
body {line-height:1.5;letter-spacing:.1px;-webkit-font-smoothing:antialiased}
button,input,textarea,select {font-family:inherit}
a,button,input,textarea,select {outline-color:var(--text)}
button {touch-action:manipulation}
.sidebar-nav {width:64px;background:var(--bg);border-right:1px solid var(--line);box-shadow:none}
.brand {height:64px;padding:0;justify-content:center}
.brand-mark {display:grid;place-content:center;font-size:0;color:var(--text);width:28px;height:32px;background:none;letter-spacing:0}
.brand-mark svg {display:block;width:28px;height:28px;overflow:visible}
.brand-mark span,.brand-copy,.sidebar-caption,.sidebar-bottom {display:none}
.sidebar-menu {padding:10px 8px}
.sidebar-menu a {justify-content:center;padding:12px 0;min-height:44px;border-radius:999px;color:var(--muted);margin-bottom:6px}
.sidebar-menu a:hover,.sidebar-menu a.active {background:var(--soft);color:var(--text)}
.sidebar-menu a span:nth-child(2),.sidebar-menu .count {display:none}
.sidebar-menu .glyph {font-size:17px}
.site-content {margin-left:64px;overflow-x:clip}
body.sidebar-collapsed .sidebar-nav {transform:translateX(-64px)}
body.sidebar-collapsed .site-content {margin-left:0}
.topbar {height:64px;position:relative;top:auto;background:var(--bg);border-bottom:1px solid var(--line);padding:0 32px;gap:18px;color:var(--text)}
.top-brand {font-size:17px;letter-spacing:.4px;font-weight:500;white-space:nowrap;display:flex;align-items:center;min-width:0}
#top-brand-name {overflow:hidden;text-overflow:ellipsis}
.top-links {display:flex;gap:24px;margin-left:20px;font-size:14px;font-weight:500}
.top-links a {color:var(--muted)}
.top-links a:hover {color:var(--text)}
.top-actions {gap:10px;min-width:0}
.top-actions .button {max-width:210px;overflow:hidden;text-overflow:ellipsis;display:block}
.icon-button {color:var(--text);border-radius:50%;width:36px;height:36px;font-size:21px}
.icon-button:hover {color:var(--text);background:var(--soft)}
.button {display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 17px;border:1px solid var(--strong-line);border-radius:999px;background:transparent;color:var(--text);font-size:14px;font-weight:500;line-height:1.2;transition:background .15s,border-color .15s}
.button:hover {border-color:var(--text);color:var(--text);background:var(--soft)}
.button.primary,#account-button {color:var(--button-text);background:var(--button-ink);border-color:var(--button-ink)}
.button.primary:hover,#account-button:hover {filter:none;opacity:.88}
.button.danger {color:#b92b2b;border-color:#b92b2b55}
.text-button {color:var(--text);font-size:13px;border-radius:999px;padding:6px 9px}
.text-button:hover {background:var(--soft)}
.portal-hero {height:auto;min-height:140px;max-width:none;margin:0;padding:0;display:block;position:relative;isolation:isolate;background:var(--bg);color:var(--text)}
.portal-hero:before {content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 86% 0%,rgba(167,202,184,.14),transparent 65%),linear-gradient(115deg,rgba(217,207,193,.12),transparent 65%)}
.portal-hero:after {content:"";position:absolute;left:32px;right:32px;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);pointer-events:none}
:root[data-theme=dark] .portal-hero:before {background:radial-gradient(ellipse at 86% 0%,rgba(131,174,151,.06),transparent 65%),linear-gradient(115deg,rgba(176,148,126,.04),transparent 65%)}
.compact-workspace {position:relative;z-index:1;max-width:1800px;margin:auto;min-height:140px;padding:13px 32px 25px;display:grid;grid-template-columns:260px minmax(0,1fr);align-items:center;gap:32px}
.editorial-copy {min-width:0;overflow-wrap:anywhere}
.editorial-copy h1 {font-family:inherit;font-size:24px;font-weight:500;line-height:1.35;letter-spacing:.1px;margin:0 0 7px;color:var(--text)}
.editorial-copy #page-description {max-width:260px;color:var(--muted);font-size:12px;line-height:1.7;margin:0}
.discovery {max-width:none;min-width:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;position:relative}
.wordmark-symbol {font-family:Inter,sans-serif;font-weight:500;letter-spacing:-2px;margin-right:6px}
.portal-search {max-width:none;width:100%;margin:0}
.search-categories,.search-engines {display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:16px;min-height:23px}
.search-categories button,.search-engines button {background:transparent;border:0;color:var(--muted);font-size:12px;font-weight:400;line-height:1.4;padding:3px 0;min-height:23px;white-space:nowrap;border-bottom:1px solid transparent;text-shadow:none;opacity:1}
.search-categories button:hover,.search-engines button:hover {color:var(--text)}
.search-categories button[aria-pressed=true] {color:var(--text);border-bottom-color:var(--text);font-weight:500}
.search-engines {gap:17px}
.search-engines button {font-size:11px}
.search-engines button[aria-pressed=true] {color:var(--text);font-weight:500}
.search-engines button[aria-pressed=true]:before {content:"";width:4px;height:4px;display:inline-block;background:var(--text);border-radius:50%;margin-right:6px;vertical-align:middle}
.web-search-form {height:42px;border:1px solid var(--strong-line);border-radius:999px;background:var(--surface);display:flex;align-items:center;margin:5px 0 3px;padding:4px;box-shadow:none}
.web-search-form:focus-within {border-color:var(--text);box-shadow:0 0 0 1px var(--text)}
.web-search-form input {background:transparent;border:0;outline:none;min-width:0;flex:1;color:var(--text);font-size:14px;padding:0 15px;height:100%}
.web-search-form input::placeholder {color:var(--muted)}
.web-search-form button {width:32px;height:32px;flex-shrink:0;border:0;border-radius:50%;color:var(--button-text);background:var(--button-ink);font-size:23px;display:grid;place-items:center}
main {max-width:1800px;margin:auto;padding:16px 32px 24px;min-height:0}
.page-intro {display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:34px;margin:0 0 14px}
.catalog-heading h2 {font-family:inherit;font-size:16px;font-weight:500;line-height:1.4;letter-spacing:.1px;margin:0}
.page-intro .search-wrap {flex:0 1 250px;min-width:0;max-width:300px;gap:8px;background:transparent;border:0;border-bottom:1px solid var(--strong-line);border-radius:0;padding:0;color:var(--muted)}
.search-wrap input {font-size:12px;color:var(--text);padding:7px 0}
.search-wrap:focus-within {box-shadow:0 1px var(--text)}
.search-wrap>span {font-size:21px}
kbd {font-size:10px;border-radius:4px;background:var(--surface);color:var(--muted)}
.manage-toolbar {margin:0 0 16px;gap:8px}
.manage-toolbar .button {font-size:12px;min-height:34px;padding:7px 13px}
.sort-toolbar {background:var(--soft);border:1px solid var(--line);padding:12px 16px;border-radius:10px;gap:10px;margin-bottom:18px}
.sort-toolbar span {font-size:13px}
.group-section {margin-bottom:24px;scroll-margin-top:24px}
.section-head {gap:9px;min-height:28px;margin:0 0 10px}
.section-head>.glyph {font-size:15px;color:var(--muted)}
.section-head h2 {font-family:inherit;font-size:18px;font-weight:500;line-height:1.4;letter-spacing:0}
.section-head .section-count {font-size:11px;font-weight:400;color:var(--muted);margin-left:2px}
.section-actions {gap:2px}
.section-actions button {font-size:11px;min-height:28px;padding:4px 7px}
.card-grid {grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.url-body {min-height:72px;gap:11px;padding:12px;border-radius:8px;border:1px solid var(--line);background:var(--surface);box-shadow:none;transition:transform .16s,border-color .16s,box-shadow .16s}
@media (hover:hover) and (pointer:fine) {.url-card .url-body:hover {transform:translateY(-1px);border-color:var(--strong-line);box-shadow:var(--shadow)}}
.url-img {width:28px!important;height:28px!important;border-radius:0!important;font-size:13px;background:transparent;color:var(--text);overflow:visible}
.url-img[style] {background:transparent!important;color:var(--text)}
.url-img img {border-radius:0!important;background:transparent;object-fit:contain}
:root[data-theme=dark] .url-img img.monochrome-icon {filter:invert(1);mix-blend-mode:screen}
.url-img .glyph {font-size:22px}
.url-img:not(:has(img)):not(:has(.glyph)) {padding:0;font-size:12px;line-height:1.25}
.site-name {font-size:14px;font-weight:500;line-height:1.45;letter-spacing:0;padding-right:0}
.site-desc {font-size:12px;line-height:1.4;letter-spacing:0;margin-top:3px;color:var(--muted)}
.site-lock {font-size:9px}
.card-tools {opacity:0;top:2px;right:4px;transition:opacity .15s;z-index:2}
.url-card:hover .card-tools,.url-card:focus-within .card-tools {opacity:1}
.card-tools button {color:var(--muted);font-size:10px;border-radius:5px;padding:2px 5px;background:var(--surface);min-height:22px}
.card-tools button:hover {color:var(--text);background:var(--soft)}
.sort-actions {gap:5px;margin-top:6px}
.sort-actions button,.sort-actions select {font-size:11px;padding:6px;border-radius:6px;max-width:135px}
.drag-over {outline-color:var(--text);border-radius:8px}
.empty {font-size:14px;padding:30px 18px;border-radius:10px;line-height:1.7}
.page-footer {margin-top:30px;padding:18px 0 5px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.2px;gap:16px;color:var(--muted)}
dialog {border-radius:24px;border-color:var(--line);box-shadow:0 20px 80px #0002}
dialog::backdrop {background:#29252466;backdrop-filter:blur(4px)}
#dialog-form {padding:28px}
.dialog-head {margin-bottom:24px}
.dialog-head h2 {font-family:var(--display-font);font-size:25px;font-weight:300;line-height:1.4}
.dialog-foot {gap:10px;padding-top:24px;margin-top:24px}
.field {font-size:14px;line-height:1.5;gap:8px;margin:18px 0}
.field input,.field select,.field textarea {font-size:15px;padding:12px 14px;border-radius:8px;border:1px solid var(--strong-line);background:var(--surface);min-height:44px}
.field input:focus,.field select:focus,.field textarea:focus {border-color:var(--text);outline:1px solid var(--text);outline-offset:0}
.field input[type=checkbox] {min-height:0;width:17px;height:17px;accent-color:var(--button-ink)}
.hint {font-size:13px;line-height:1.8}
#dialog-error {font-size:13px;color:#b92b2b}
.user-row {font-size:14px;padding:18px 0}
.user-row button {font-size:12px;padding:8px 12px;min-height:34px}
.safe-preview {border-radius:12px;font-size:13px}
#toast {border-radius:999px;font-size:14px;line-height:1.5;background:var(--button-ink);color:var(--button-text);padding:13px 24px}
@media (max-width:1299px) and (min-width:1025px) {
  .card-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:1024px) and (min-width:701px) {
  .card-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
  .compact-workspace {grid-template-columns:200px minmax(0,1fr);gap:24px}
  .editorial-copy h1 {font-size:22px}
}
@media (max-width:850px) {
  .top-links {display:none}
  .search-categories,.search-engines {gap:12px}
}
@media (max-width:700px) {
  .sidebar-nav {width:244px;transform:translateX(-244px);background:var(--surface)}
  body.sidebar-collapsed .sidebar-nav {transform:translateX(-244px)}
  body.mobile-menu .sidebar-nav {transform:translateX(0)}
  .brand {justify-content:flex-start;padding:0 24px;gap:16px}
  .brand-copy {display:grid}
  .brand-copy strong {font-size:17px;letter-spacing:.5px}
  .brand-copy small {font-size:9px}
  .sidebar-menu {padding:12px}
  .sidebar-menu a {justify-content:flex-start;padding:12px 16px;gap:15px;font-size:14px}
  .sidebar-menu a span:nth-child(2),.sidebar-menu .count {display:block}
  .sidebar-menu .count {font-size:12px}
  .site-content {margin-left:0}
  .topbar {height:58px;padding:0 12px;gap:7px}
  .topbar .icon-button {width:32px;height:34px}
  .top-actions {gap:3px;flex-shrink:0}
  .top-actions .button {font-size:12px;padding:8px 12px;min-height:34px;max-width:104px;min-width:0}
  .top-brand {font-size:16px;flex:1;min-width:0}
  .wordmark-symbol {display:none}
  .mobile-menu #mobile-shade {background:#29252466}
  .portal-hero {min-height:155px}
  .compact-workspace {min-height:155px;padding:10px 16px 23px;grid-template-columns:1fr;gap:6px;align-items:start}
  .editorial-copy h1 {font-size:18px;font-weight:500;line-height:1.35;letter-spacing:0;margin:0}
  .editorial-copy #page-description {display:none}
  .search-categories,.search-engines {flex-wrap:nowrap;gap:18px;overflow-x:auto;scrollbar-width:none;min-height:23px}
  .search-categories::-webkit-scrollbar,.search-engines::-webkit-scrollbar {display:none}
  .search-categories button {font-size:12px;min-height:23px}
  .search-engines {gap:16px}
  .search-engines button {font-size:11px;min-height:23px}
  .web-search-form {height:40px;margin:4px 0 2px}
  .web-search-form input {font-size:13px;padding:0 12px}
  .web-search-form button {width:30px;height:30px}
  main {padding:12px 16px 20px}
  .page-intro {align-items:center;flex-direction:row;gap:12px;min-height:32px;margin:0 0 12px}
  .catalog-heading h2 {font-size:15px;white-space:nowrap}
  .page-intro .search-wrap {flex:0 1 170px;max-width:54%;padding:0;gap:4px}
  .search-wrap input {font-size:12px;padding:6px 0}
  .search-wrap>span {font-size:20px}
  .card-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .url-body {min-height:72px;padding:10px;gap:8px}
  .url-img {width:26px!important;height:26px!important}
  .url-img .glyph {font-size:21px}
  .site-name {font-size:13px;line-height:1.4;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .site-desc {font-size:12px;margin-top:2px;line-height:1.35}
  .section-head {gap:7px;margin-bottom:8px;flex-wrap:wrap;min-height:26px}
  .section-head h2 {font-size:16px}
  .section-head .section-count {font-size:11px}
  .section-actions {gap:0}
  .section-actions button {font-size:10px;padding:4px 6px;min-height:26px}
  .group-section {margin-bottom:20px}
  .manage-toolbar {gap:7px;margin-bottom:15px}
  .manage-toolbar .button {font-size:11px;padding:7px 11px;min-height:32px}
  .page-footer {margin-top:26px;font-size:10px;letter-spacing:.1px;gap:10px;flex-wrap:wrap}
  #dialog-form {padding:22px}
  .dialog-head h2 {font-size:23px}
  .dialog-foot {flex-wrap:wrap}
  .field-row {grid-template-columns:1fr}
}
@media (hover:none), (max-width:700px) {
  .card-tools {opacity:1;top:auto;bottom:3px;right:4px;left:4px;justify-content:flex-end}
  .url-card:has(.card-tools) .url-body {padding-bottom:30px;min-height:91px}
  .card-tools button {min-height:24px;padding:2px 6px}
}
@media (prefers-reduced-motion:reduce) {
  .url-body,.button {transition:none}
  .url-card .url-body:hover {transform:none}
}
/* One compact header; the sidebar remains an icon rail when collapsed. */
.visually-hidden {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
html {scroll-padding-top:82px}
.group-section {scroll-margin-top:0}
.sidebar-nav,body.sidebar-collapsed .sidebar-nav {width:208px;transform:none;background:var(--bg);overflow:hidden;transition:width .18s}
.brand {height:64px;min-height:64px;padding:0 18px;justify-content:flex-start;gap:13px;overflow:hidden}
.brand-mark {flex:0 0 28px}
.brand-copy {display:grid;min-width:0;gap:3px}
.brand-copy strong {font-size:17px;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-copy small {font-size:8px;letter-spacing:.3px;white-space:nowrap}
.sidebar-caption,.sidebar-bottom {display:none}
.sidebar-menu {min-height:0;padding:10px 8px;scrollbar-width:thin}
.sidebar-menu a {justify-content:flex-start;gap:12px;padding:11px 13px;border-radius:9px;min-height:44px;font-size:13px}
.sidebar-menu a span:nth-child(2) {display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sidebar-menu .glyph {flex:0 0 20px}
.sidebar-menu .count {display:block}
.sidebar-controls {flex-shrink:0;padding:8px 8px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
#menu-toggle {display:flex;align-items:center;gap:12px;width:100%;height:44px;padding:0 13px;border:0;border-radius:9px;background:transparent;color:var(--muted);white-space:nowrap;font-size:12px}
#menu-toggle:hover {background:var(--soft);color:var(--text)}
.sidebar-toggle-icon {font-size:25px;line-height:1;flex:0 0 20px;text-align:center}
.site-content {margin-left:208px;transition:margin-left .18s}
body.sidebar-collapsed .sidebar-nav {width:64px}
body.sidebar-collapsed .site-content {margin-left:64px}
body.sidebar-collapsed .brand {padding:0;justify-content:center}
body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .sidebar-menu a span:nth-child(2),body.sidebar-collapsed .sidebar-menu .count,body.sidebar-collapsed .sidebar-toggle-label {display:none}
body.sidebar-collapsed .sidebar-menu a,body.sidebar-collapsed #menu-toggle {justify-content:center;padding:11px 0;gap:0}
.topbar {display:flex;position:sticky;top:0;height:64px;padding:0 28px;gap:24px;background:var(--bg);z-index:20}
.header-search {flex:1;min-width:0;max-width:720px;margin:0 auto}
.top-actions {flex:0 0 auto;margin-left:0;gap:10px}
.web-search-form {position:relative;margin:0;width:100%;height:40px}
.web-search-form input {padding:0 12px;font-size:13px}
.web-search-form>button {width:30px;height:30px}
.search-options {flex:0 0 auto;min-width:0}
.search-options summary {display:flex;align-items:center;justify-content:space-between;gap:9px;cursor:pointer;list-style:none;padding:6px 11px;font-size:12px;color:var(--text);border-right:1px solid var(--line);white-space:nowrap}
.search-options summary::-webkit-details-marker {display:none}
.search-options-panel {position:absolute;left:0;top:calc(100% + 9px);width:360px;max-width:100%;padding:15px 18px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 24px #00000012;z-index:50}
.search-options-panel .search-categories,.search-options-panel .search-engines {flex-wrap:wrap;overflow:visible;gap:8px 16px}
.search-options-panel .search-categories {padding-bottom:10px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.web-search-form .search-options-panel button {display:block;width:auto;height:auto;min-height:32px;border-radius:0;background:transparent;color:var(--muted);font-size:12px;padding:5px 0}
.web-search-form .search-options-panel button[aria-pressed=true] {color:var(--text)}
@media(max-width:700px) {
  html {scroll-padding-top:122px}
  .sidebar-nav,body.sidebar-collapsed .sidebar-nav {width:208px;transform:none;background:var(--surface)}
  body.sidebar-collapsed .sidebar-nav {width:48px}
  .site-content,body.sidebar-collapsed .site-content {margin-left:48px}
  .sidebar-menu {padding:8px 2px}
  .sidebar-menu a {padding:11px 15px}
  .sidebar-controls {padding:6px 2px max(8px,env(safe-area-inset-bottom))}
  .topbar {height:104px;padding:8px 12px 10px;gap:8px;flex-direction:column;align-items:stretch}
  .header-search {order:2;flex:none;width:100%;max-width:none;margin:0}
  .top-actions {order:1;justify-content:flex-end;height:36px;gap:6px}
  .top-actions .button {max-width:180px}
  .web-search-form {height:40px}
  .web-search-form input {font-size:13px;padding:0 8px}
  .search-options summary {padding:6px 8px;gap:5px;font-size:11px}
  main {padding:12px 12px 20px}
}
@media(max-width:360px) {.card-grid {grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce) {.sidebar-nav,.site-content {transition:none}}