:root {
  --bg: #0b0d11;
  --panel: #12161d;
  --panel-2: #171c24;
  --border: #262d38;
  --text: #f5f7fb;
  --muted: #98a2b3;
  --accent: #e23b3b;
  --accent-2: #2777ff;
  --success: #39b86b;
  --warning: #e4a43b;
  --danger: #ef5350;
  --shadow: 0 20px 60px rgba(0,0,0,.28);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.small { font-size: .84rem; }

.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(360px,.75fr); }
.brand-panel { padding: 9vw; display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at 20% 15%, rgba(226,59,59,.20), transparent 38%), radial-gradient(circle at 90% 80%, rgba(39,119,255,.18), transparent 34%); }
.brand-panel h1 { font-size: clamp(2.6rem, 6vw, 5.8rem); margin: 24px 0 12px; letter-spacing: -.06em; }
.brand-panel p { font-size: 1.2rem; color: #c5cbd5; max-width: 650px; line-height: 1.6; }
.logo-mark { width: 76px; height: 76px; border-radius: 22px; display: grid; place-items: center; font-weight: 900; letter-spacing: -.08em; font-size: 1.6rem; background: linear-gradient(135deg,var(--accent),var(--accent-2)); box-shadow: 0 16px 45px rgba(39,119,255,.18); }
.brand-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.brand-stats span { border: 1px solid var(--border); background: rgba(18,22,29,.8); border-radius: 999px; padding: 10px 14px; color: #d3d9e3; }
.auth-card { align-self: center; margin: 48px; padding: 34px; border: 1px solid var(--border); background: rgba(18,22,29,.96); border-radius: 28px; box-shadow: var(--shadow); }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 24px; }
.tab-button, .nav-item, .nav-link { border: 0; color: var(--muted); background: transparent; border-radius: 12px; padding: 12px 14px; text-decoration: none; text-align: left; }
.tab-button.active, .nav-item.active { background: #202630; color: white; }
.auth-form { display: grid; gap: 17px; }
label { display: grid; gap: 8px; color: #cfd5df; font-size: .92rem; }
input, select { width: 100%; border: 1px solid var(--border); border-radius: 12px; background: #0c1016; color: white; padding: 12px 14px; outline: none; }
input:focus, select:focus { border-color: #4b7cff; box-shadow: 0 0 0 3px rgba(75,124,255,.12); }
button.primary, button.danger, .pager button, .status-button { border: 0; border-radius: 12px; padding: 11px 15px; color: white; font-weight: 650; }
button.primary { background: linear-gradient(135deg,#da3939,#b52d41); }
button.danger { background: #5b2325; color: #ffb8b8; }
.wide { width: 100%; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 240px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 22px 16px; border-right: 1px solid var(--border); display: flex; flex-direction: column; background: #0d1015; }
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 4px 8px 24px; }
.sidebar-brand span { display: block; color: var(--muted); font-size: .78rem; margin-top: 2px; }
.small-logo { width: 38px; height: 38px; border-radius: 11px; font-size: .82rem; }
.sidebar nav { display: grid; gap: 6px; }
.sidebar-bottom { margin-top: auto; display: grid; gap: 6px; }
.danger-soft { color: #f19999; }
.content { padding: 30px; min-width: 0; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 26px; }
.topbar h2 { margin: 0 0 4px; font-size: 2rem; letter-spacing: -.03em; }
.topbar p { margin: 0; }
.user-badge { border: 1px solid var(--border); padding: 10px 14px; border-radius: 14px; background: var(--panel); font-size: .9rem; }

.stats-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }
.stat-card { border: 1px solid var(--border); border-radius: 18px; padding: 18px; background: var(--panel); }
.stat-card .eyebrow { font-size: .78rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.stat-card .value { font-size: 2rem; font-weight: 800; margin-top: 8px; }
.stat-card .detail { color: var(--muted); margin-top: 5px; font-size: .86rem; }
.panel { border: 1px solid var(--border); border-radius: 20px; background: var(--panel); padding: 20px; margin-bottom: 20px; }
.panel-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.panel h3 { margin: 0 0 4px; }
.panel p { margin: 0; }
.comic-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: 12px; }
.comic-card { border: 1px solid var(--border); background: var(--panel-2); border-radius: 16px; padding: 15px; transition: transform .15s,border-color .15s; }
.comic-card:hover, .list-row:hover { transform: translateY(-1px); border-color: #414c5d; }
.comic-title { font-weight: 750; line-height: 1.32; }
.comic-meta { color: var(--muted); font-size: .84rem; margin-top: 7px; }
.publisher-pill, .status-pill, .availability-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 5px 9px; font-size: .72rem; font-weight: 750; }
.publisher-pill.marvel { background: rgba(226,59,59,.14); color: #ff8b8b; }
.publisher-pill.dc { background: rgba(39,119,255,.15); color: #7caaff; }
.status-pill { background: #252b35; color: #d0d6df; }
.status-READ { color: #7fe0a1; background: rgba(57,184,107,.12); }
.status-READING { color: #87b0ff; background: rgba(39,119,255,.13); }
.status-SKIPPED { color: #f1c173; background: rgba(228,164,59,.12); }
.availability-pill.have { color: #7fe0a1; background: rgba(57,184,107,.12); }
.availability-pill.missing { color: #c1c7d0; background: #222832; }
.library-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 14px; }
.library-card { border: 1px solid var(--border); border-radius: 16px; padding: 16px; background: var(--panel-2); }
.progress-track { height: 8px; background: #252b34; border-radius: 999px; overflow: hidden; margin: 12px 0 7px; }
.progress-fill { height: 100%; background: linear-gradient(90deg,var(--accent),var(--accent-2)); }
.series-progress-panel { overflow: hidden; }
.series-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.series-summary-card { border:1px solid var(--border); background:var(--panel-2); border-radius:14px; padding:13px 14px; min-width:0; }
.series-summary-card .eyebrow { color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.07em; }
.series-summary-card strong { display:block; font-size:1.35rem; margin-top:5px; }
.series-summary-card span { display:block; color:var(--muted); font-size:.78rem; margin-top:3px; }
.series-progress-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.series-progress-card { border:1px solid var(--border); background:var(--panel-2); border-radius:16px; padding:14px; min-width:0; }
.series-progress-title { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; }
.series-progress-title h4 { margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.series-progress-title span { color:var(--muted); font-size:.76rem; }
.series-progress-title strong { font-size:1rem; white-space:nowrap; }
.series-progress-meta { display:flex; flex-wrap:wrap; gap:7px 12px; color:var(--muted); font-size:.75rem; align-items:center; }
.series-progress-meta b { color:#d8dee8; }
.series-progress-percent { margin-left:auto; color:#d8dee8; font-weight:750; }
.series-progress-empty { grid-column:1/-1; border:1px dashed var(--border); border-radius:14px; padding:18px; text-align:center; }
.progress-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 2px 12px; }
.progress-section-head h3 { margin:0; }
.filters-panel { padding: 15px; }
.filters-row { display: grid; grid-template-columns: minmax(230px,2fr) repeat(2,minmax(150px,.7fr)) auto; gap: 10px; align-items: center; }
.result-count { margin-top: 11px; }
.list-stack { display: grid; gap: 10px; }
.list-row { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; border: 1px solid var(--border); background: var(--panel); border-radius: 16px; padding: 14px 16px; transition: transform .15s,border-color .15s; }
.list-row-main { min-width: 0; }
.list-row-main .title-line { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.list-row-main h4 { margin: 0; font-size: 1rem; }
.list-row-main p { margin: 6px 0 0; color: var(--muted); font-size: .85rem; }
.pager { display: flex; justify-content: center; align-items: center; gap: 14px; margin: 18px 0 4px; }
.pager button { background: #202630; }
.pager button:disabled { opacity: .35; cursor: default; }

.modal { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; padding: 22px; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.72); backdrop-filter: blur(7px); }
.modal-card { position: relative; z-index: 1; width: min(720px,100%); max-height: 90vh; overflow: auto; background: #11151c; border: 1px solid #313846; border-radius: 24px; padding: 24px; box-shadow: var(--shadow); }
.modal-close { position: absolute; right: 14px; top: 12px; width: 38px; height: 38px; border-radius: 12px; border: 0; background: #202630; color: white; font-size: 1.45rem; }
.modal-title { padding-right: 46px; margin: 0; font-size: 1.7rem; }
.detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 18px 0; }
.detail-box { background: #171c24; border: 1px solid var(--border); border-radius: 14px; padding: 13px; }
.detail-box span { display: block; color: var(--muted); font-size: .75rem; margin-bottom: 5px; }
.status-actions { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-top: 12px; }
.status-button { background: #202630; }
.status-button.active { outline: 2px solid #5e8cff; background: #263550; }
.page-form { display: grid; grid-template-columns: 1fr auto; gap: 9px; margin-top: 12px; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 100; border: 1px solid #3a4555; background: #151a22; border-radius: 14px; padding: 13px 16px; box-shadow: var(--shadow); max-width: 420px; }

@media (max-width: 980px) {
  .auth-shell { grid-template-columns: 1fr; }
  .brand-panel { padding: 42px 24px 10px; }
  .auth-card { margin: 24px; }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; flex-direction: row; align-items: center; gap: 10px; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--border); }
  .sidebar-brand { padding: 0 12px 0 0; flex: 0 0 auto; }
  .sidebar nav { display: flex; }
  .sidebar-bottom { margin: 0 0 0 auto; display: flex; }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .series-summary-grid { grid-template-columns: repeat(2,1fr); }
  .series-progress-grid { grid-template-columns: 1fr; }
  .filters-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .content { padding: 18px; }
  .topbar { align-items: flex-start; }
  .stats-grid, .detail-grid { grid-template-columns: 1fr; }
  .series-summary-grid { grid-template-columns: 1fr 1fr; }
  .series-progress-title { grid-template-columns: auto minmax(0,1fr); }
  .series-progress-title > strong { grid-column: 2; }
  .filters-row { grid-template-columns: 1fr; }
  .list-row { grid-template-columns: 1fr; }
  .status-actions { grid-template-columns: repeat(2,1fr); }
  .sidebar-brand span, .sidebar-brand strong { display: none; }
}


/* Stage 5: S3 upload + native web reader. */
.reader-primary { width:100%; border:0; border-radius:14px; padding:14px 18px; margin:4px 0 20px; color:white; font-weight:800; background:linear-gradient(135deg,#2777ff,#1556c0); }
.reader-unavailable { margin:4px 0 20px; padding:13px 15px; border:1px dashed var(--border); border-radius:14px; color:var(--muted); }
.admin-upload-box { margin-top:22px; padding:16px; background:#171c24; border:1px solid var(--border); border-radius:16px; }
.admin-upload-box h3 { margin:0 0 5px; }
.admin-upload-box input[type=file] { margin:12px 0; }
.admin-upload-actions { display:flex; gap:8px; flex-wrap:wrap; }
.reader-open { overflow:hidden; }
.reader-view { position:fixed; inset:0; z-index:200; background:#050608; display:flex; flex-direction:column; }
.reader-toolbar { height:58px; flex:0 0 58px; display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; padding:8px 12px; background:rgba(10,12,16,.97); border-bottom:1px solid #252b35; }
.reader-heading { min-width:0; text-align:center; display:grid; }
.reader-heading strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reader-heading span { font-size:.78rem; color:var(--muted); }
.reader-tool-button,.reader-finish { border:0; border-radius:10px; padding:9px 12px; color:white; background:#202630; }
.reader-finish { background:#17653b; }
.reader-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; }
.reader-pages { width:min(100%,1100px); margin:0 auto; background:#0a0b0e; }
.reader-page { margin:0; min-height:180px; display:grid; place-items:center; position:relative; }
.reader-page img { display:block; width:100%; height:auto; background:#11151c; }
.reader-page figcaption { position:absolute; right:9px; bottom:9px; padding:3px 7px; border-radius:8px; color:#ddd; background:rgba(0,0,0,.58); font-size:.72rem; }
@media (max-width:640px) { .reader-toolbar { grid-template-columns:auto 1fr auto; gap:6px; padding:6px; } .reader-tool-button,.reader-finish { padding:8px; font-size:.8rem; } }

/* Stage 5.1: RU/EN editions. */
.sidebar-language { color:var(--muted); font-size:.74rem; padding:8px 10px; display:grid; gap:6px; }
.sidebar-language select { padding:8px 10px; font-size:.82rem; }
.edition-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:10px 0 16px; }
.edition-choice { border:1px solid var(--border); background:#171c24; color:white; border-radius:14px; padding:12px; display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; text-align:left; }
.edition-choice span:last-child { color:var(--muted); font-size:.76rem; }
.edition-choice.active { border-color:#4b7cff; box-shadow:0 0 0 3px rgba(75,124,255,.12); }
.edition-choice.missing { opacity:.72; }
.language-pill { display:inline-flex; min-width:34px; justify-content:center; border-radius:999px; padding:4px 7px; font-size:.7rem; font-weight:800; }
.language-pill.have { color:#8ad7ff; background:rgba(39,119,255,.16); }
.language-pill.missing { color:#a9afb8; background:#252b35; }
.reader-toolbar-actions { display:flex; align-items:center; gap:8px; }
.reader-language-select { width:auto; min-width:92px; padding:8px 10px; background:#171c24; }
@media (max-width:640px) {
  .edition-switch { grid-template-columns:1fr; }
  .reader-language-select { min-width:76px; max-width:96px; font-size:.78rem; }
}
.language-stats { margin-top:10px; color:var(--muted); font-size:.82rem; display:flex; align-items:center; gap:6px; }


/* Stage 5.1.2: comic cover display. */
.catalog-with-cover { grid-template-columns: 58px minmax(0,1fr) auto; padding: 9px 14px 9px 9px; }
.catalog-cover-slot { width: 50px; height: 74px; border-radius: 8px; overflow: hidden; background: #171c24; border: 1px solid var(--border); }
.catalog-cover { width: 100%; height: 100%; object-fit: cover; display: block; }
.catalog-cover-placeholder { display: grid; place-items: center; color: var(--muted); font-size: .78rem; font-weight: 800; background: linear-gradient(145deg,#181e28,#0d1118); }
.comic-detail-hero { display: grid; grid-template-columns: 170px minmax(0,1fr); gap: 20px; align-items: start; margin-bottom: 18px; padding-right: 40px; }
.comic-detail-cover-wrap { width: 170px; aspect-ratio: 2 / 3; border-radius: 14px; overflow: hidden; border: 1px solid var(--border); background: #171c24; box-shadow: 0 14px 34px rgba(0,0,0,.28); }
.comic-detail-cover { width: 100%; height: 100%; object-fit: cover; display: block; }
.comic-detail-cover-placeholder { display: grid; place-items: center; padding: 16px; text-align: center; color: var(--muted); font-size: .82rem; }
.comic-detail-copy { min-width: 0; padding-top: 4px; }
@media (max-width:640px) {
  .catalog-with-cover { grid-template-columns: 52px minmax(0,1fr); }
  .catalog-with-cover > :last-child { grid-column: 2; justify-self: start; }
  .catalog-cover-slot { width: 46px; height: 68px; }
  .comic-detail-hero { grid-template-columns: 105px minmax(0,1fr); gap: 14px; padding-right: 34px; }
  .comic-detail-cover-wrap { width: 105px; }
  .comic-detail-hero .modal-title { font-size: 1.35rem; }
}

/* Stage 5.1.4: richer catalog search and date filters. */
.catalog-filter-form { display: grid; gap: 12px; }
.catalog-filter-main { grid-template-columns: minmax(260px,2fr) minmax(130px,.7fr) minmax(145px,.8fr) minmax(190px,1fr) auto; }
.advanced-filters { border-top: 1px solid var(--border); padding-top: 10px; }
.advanced-filters summary { cursor: pointer; color: #d8dee8; font-weight: 700; user-select: none; width: fit-content; }
.date-filter-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 12px; }
.date-filter-group { min-width: 0; margin: 0; border: 1px solid var(--border); border-radius: 14px; padding: 12px; background: #10141a; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.date-filter-group legend { padding: 0 6px; color: #e4e8ef; font-size: .86rem; font-weight: 750; }
.date-filter-group label { font-size: .76rem; color: var(--muted); }
.date-filter-group input { margin-top: 2px; padding: 9px 10px; }
.date-filter-group p { grid-column: 1 / -1; color: var(--muted); font-size: .72rem; line-height: 1.4; margin: 1px 0 0; }
.filter-actions { display: flex; justify-content: flex-end; margin-top: 10px; }
.filter-actions button { border: 1px solid var(--border); background: #171c24; color: #dce2eb; border-radius: 10px; padding: 8px 12px; }
.catalog-id-line { opacity: .78; font-size: .76rem !important; margin-top: 3px !important; }
@media (max-width: 1180px) {
  .catalog-filter-main { grid-template-columns: minmax(230px,2fr) repeat(2,minmax(145px,1fr)); }
  .catalog-filter-main button, .catalog-filter-main #catalogSort { grid-column: auto; }
  .date-filter-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .catalog-filter-main, .date-filter-grid { grid-template-columns: 1fr; }
  .date-filter-group { grid-template-columns: 1fr 1fr; }
}

/* Stage 6 bulk import */
.import-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.compact-stats { margin-top:16px; }
.import-job { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:start; }
.import-job-main h4 { margin:0; overflow-wrap:anywhere; }
.import-job-main p { margin:6px 0; }
.import-job-actions { display:flex; flex-direction:column; gap:8px; min-width:210px; }
.import-job-actions select, .import-job-actions button { width:100%; }
.import-error { color:#ff8f8f; font-size:13px; white-space:pre-wrap; }
.import-progress { display:grid; grid-template-columns:minmax(140px,260px) auto; align-items:center; gap:10px; margin-top:10px; font-size:12px; color:var(--muted); }
@media (max-width: 820px) {
  .import-job { grid-template-columns:1fr; }
  .import-job-actions { min-width:0; }
}

/* Stage 6.0.1 — Admin UI redesign */
:root {
  --bg: #090c12;
  --panel: #111722;
  --panel-2: #151d2a;
  --border: #273246;
  --text: #f6f8fc;
  --muted: #8f9bad;
  --accent: #ff4d5f;
  --accent-2: #4c82ff;
  --admin: #705cff;
  --admin-2: #18b6a4;
  --success: #36c578;
  --warning: #f0ae49;
  --danger: #ff5f6d;
  --shadow: 0 24px 70px rgba(0,0,0,.34);
}
body { background:
  radial-gradient(circle at 75% -10%, rgba(63,82,168,.10), transparent 30%),
  var(--bg); }
.app-shell { grid-template-columns: 272px minmax(0,1fr); }
.sidebar {
  padding: 20px 14px;
  background: linear-gradient(180deg,#0d121c 0%,#0a0e15 100%);
  border-right: 1px solid rgba(101,119,151,.18);
}
.sidebar-brand { padding: 5px 8px 26px; }
.sidebar-brand strong { font-size: .98rem; letter-spacing: -.01em; }
.logo-mark { background: linear-gradient(135deg,#ff4b57 0%,#694dff 58%,#2d8cff 100%); }
.nav-section-label {
  color: #59667a; font-size: .66rem; text-transform: uppercase; letter-spacing: .14em;
  padding: 18px 12px 7px; font-weight: 800;
}
.nav-item { display:flex; align-items:center; gap:11px; position:relative; min-height:44px; width:100%; }
.nav-item:hover { color:#e8edf6; background:#141b27; }
.nav-item.active { background: linear-gradient(90deg,rgba(76,130,255,.18),rgba(112,92,255,.08)); color:#fff; box-shadow: inset 2px 0 #668cff; }
.nav-icon { width:22px; height:22px; display:grid; place-items:center; font-size:1rem; color:#8fa1bc; }
.nav-item.active .nav-icon { color:#9bb5ff; }
.admin-nav-item { color:#b9b1ff; }
.admin-nav-item.active { background:linear-gradient(90deg,rgba(112,92,255,.20),rgba(24,182,164,.05)); box-shadow:inset 2px 0 #806fff; }
.nav-dot { width:6px; height:6px; border-radius:50%; background:#7866ff; margin-left:auto; box-shadow:0 0 12px rgba(120,102,255,.7); }
.content { padding: 32px clamp(20px,3vw,42px); max-width: 1680px; width:100%; margin:0 auto; }
.topbar { margin-bottom: 30px; }
.topbar h2 { font-size:2.1rem; }
.user-badge { background:linear-gradient(180deg,#151c28,#101620); box-shadow:0 8px 24px rgba(0,0,0,.18); }
.panel { box-shadow:0 8px 28px rgba(0,0,0,.12); }

.admin-view { animation: adminFade .22s ease-out; }
@keyframes adminFade { from {opacity:0; transform:translateY(5px)} to {opacity:1; transform:none} }
.admin-hero {
  border:1px solid rgba(118,104,255,.28);
  border-radius:24px;
  padding:26px 28px;
  margin-bottom:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  overflow:hidden;
  position:relative;
  background:
    radial-gradient(circle at 92% 16%,rgba(87,101,255,.28),transparent 28%),
    radial-gradient(circle at 72% 120%,rgba(20,185,166,.18),transparent 36%),
    linear-gradient(135deg,#15172a 0%,#111927 48%,#0f1720 100%);
  box-shadow:0 20px 55px rgba(0,0,0,.20);
}
.admin-hero::after { content:""; position:absolute; width:220px; height:220px; border:1px solid rgba(255,255,255,.04); border-radius:50%; right:-60px; top:-95px; }
.admin-hero-copy { position:relative; z-index:1; max-width:760px; }
.admin-kicker { color:#8c82ff; font-size:.68rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; margin-bottom:7px; }
.admin-hero h3 { margin:0; font-size:clamp(1.45rem,2.4vw,2.15rem); letter-spacing:-.035em; }
.admin-hero p { margin:8px 0 0; color:#aeb8ca; line-height:1.55; }
.admin-hero-actions { position:relative; z-index:1; flex:0 0 auto; }
.admin-hero-actions button { border-radius:13px; padding:12px 16px; font-weight:750; border:1px solid rgba(255,255,255,.08); color:#fff; }
.admin-action-primary { box-shadow:0 12px 26px rgba(90,75,255,.20); }
.admin-action-secondary { background:rgba(255,255,255,.055); }
.admin-action-secondary:hover { background:rgba(255,255,255,.09); }

.admin-stats-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:11px; margin-bottom:12px; }
.admin-stat-card {
  min-width:0; padding:15px; border-radius:17px; border:1px solid var(--border);
  background:linear-gradient(180deg,#141b27,#101620); display:flex; gap:11px; align-items:flex-start;
  box-shadow:0 8px 22px rgba(0,0,0,.12);
}
.admin-stat-icon { width:9px; height:38px; border-radius:999px; flex:0 0 9px; background:#63708a; }
.tone-ready .admin-stat-icon { background:#678eff; box-shadow:0 0 18px rgba(103,142,255,.25); }
.tone-review .admin-stat-icon { background:#efb34f; box-shadow:0 0 18px rgba(239,179,79,.20); }
.tone-active .admin-stat-icon { background:#7a67ff; box-shadow:0 0 18px rgba(122,103,255,.28); }
.tone-done .admin-stat-icon { background:#34c77a; box-shadow:0 0 18px rgba(52,199,122,.22); }
.tone-error .admin-stat-icon { background:#ff6471; box-shadow:0 0 18px rgba(255,100,113,.20); }
.tone-duplicate .admin-stat-icon { background:#8a95a8; }
.admin-stat-label { color:#97a5ba; font-size:.72rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.admin-stat-value { font-size:1.55rem; font-weight:850; line-height:1.1; margin:4px 0 3px; letter-spacing:-.035em; }
.admin-stat-detail { color:#657287; font-size:.7rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.scan-banner {
  min-height:44px; display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-bottom:18px;
  padding:10px 14px; border:1px solid #273247; border-radius:14px; background:#0f151f; color:#8e9bad; font-size:.78rem;
}
.scan-banner strong { color:#dfe5ef; }
.scan-dot { width:8px; height:8px; border-radius:50%; background:#667085; }
.scan-dot.ok { background:#37c87b; box-shadow:0 0 12px rgba(55,200,123,.45); }
.scan-dot.working { background:#7a67ff; box-shadow:0 0 14px rgba(122,103,255,.55); animation:pulseDot 1.2s infinite alternate; }
@keyframes pulseDot { from{opacity:.55} to{opacity:1} }

.import-queue-panel { padding:0; overflow:hidden; border-radius:22px; }
.import-queue-head {
  padding:19px 20px; display:flex; justify-content:space-between; gap:18px; align-items:center;
  border-bottom:1px solid var(--border); background:linear-gradient(180deg,#141b27,#111721);
}
.import-queue-head h3 { margin:0 0 3px; }
.import-filter-bar { display:grid; grid-template-columns:175px minmax(220px,320px) 42px; gap:8px; align-items:center; }
.import-filter-bar input,.import-filter-bar select { padding:10px 11px; background:#0b1018; }
.icon-button { width:42px; height:42px; border:1px solid var(--border); border-radius:11px; background:#171f2b; color:#dbe3ee; font-size:1.1rem; }
.icon-button:hover { background:#202a39; }
.import-job-list { display:grid; gap:0; }
.import-job-card {
  position:relative; display:grid; grid-template-columns:5px minmax(0,1fr) minmax(190px,230px); gap:0;
  border-bottom:1px solid rgba(47,59,78,.72); background:#10161f; transition:background .16s;
}
.import-job-card:hover { background:#131b26; }
.import-job-card:last-child { border-bottom:0; }
.import-job-rail { background:#667085; }
.import-job-card.status-NEEDS_REVIEW .import-job-rail { background:#efb34f; }
.import-job-card.status-MATCHED .import-job-rail { background:#5e8cff; }
.import-job-card.status-QUEUED .import-job-rail,.import-job-card.status-PROCESSING .import-job-rail,.import-job-card.status-UPLOADING .import-job-rail { background:#7a67ff; }
.import-job-card.status-DONE .import-job-rail { background:#34c77a; }
.import-job-card.status-ERROR .import-job-rail { background:#ff6471; }
.import-job-card.status-DUPLICATE .import-job-rail { background:#788497; }
.import-job-content { padding:17px 18px 16px; min-width:0; }
.import-job-header { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.import-job-title-wrap { min-width:0; display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.import-job-title-wrap h4 { margin:0; font-size:.95rem; overflow-wrap:anywhere; color:#eef2f8; }
.import-status { padding:5px 8px; border-radius:999px; font-size:.66rem; font-weight:850; letter-spacing:.02em; background:#222b38; color:#c8d0dc; white-space:nowrap; }
.import-status-NEEDS_REVIEW { background:rgba(239,179,79,.13); color:#f4c56f; }
.import-status-MATCHED { background:rgba(94,140,255,.14); color:#8eafff; }
.import-status-QUEUED,.import-status-PROCESSING,.import-status-UPLOADING { background:rgba(122,103,255,.14); color:#a89bff; }
.import-status-DONE { background:rgba(52,199,122,.13); color:#75dfa3; }
.import-status-ERROR { background:rgba(255,100,113,.13); color:#ff9ca5; }
.import-status-DUPLICATE { background:rgba(120,132,151,.14); color:#aeb8c8; }
.import-file-tags { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.import-file-tags span { border:1px solid #2a3547; border-radius:8px; background:#141c27; color:#8593a8; padding:4px 7px; font-size:.66rem; font-weight:750; }
.import-meta-grid { display:grid; grid-template-columns:1.2fr 1fr 1.25fr .85fr; gap:10px; margin-top:14px; }
.import-meta-block { min-width:0; padding:9px 10px; border:1px solid rgba(43,54,72,.75); border-radius:11px; background:#0d131c; }
.import-meta-block>span { display:block; color:#68768b; font-size:.63rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; font-weight:750; }
.import-meta-block>strong { display:block; color:#cdd5e1; font-size:.76rem; line-height:1.35; overflow-wrap:anywhere; }
.confidence-row { display:grid; gap:6px; }
.confidence-track { height:5px; border-radius:99px; background:#222b38; overflow:hidden; }
.confidence-fill { height:100%; border-radius:99px; background:#64748b; }
.confidence-fill.good { background:#35c67a; }.confidence-fill.warn { background:#eeb34f; }.confidence-fill.bad { background:#ff6471; }
.import-progress-modern { margin-top:12px; }
.import-progress-head { display:flex; justify-content:space-between; gap:10px; color:#78869b; font-size:.7rem; margin-bottom:6px; }
.import-progress-head strong { color:#aeb9ca; }
.import-progress-modern .progress-track { margin:0; height:6px; }
.import-error-box { margin-top:12px; border:1px solid rgba(255,100,113,.23); border-radius:11px; padding:10px 12px; background:rgba(84,29,36,.22); }
.import-error-box strong { color:#ff9ba4; font-size:.75rem; }
.import-error-box pre { white-space:pre-wrap; margin:5px 0 0; color:#d6a5aa; font:inherit; font-size:.72rem; }
.import-job-actions { border-left:1px solid rgba(47,59,78,.72); padding:15px; background:rgba(9,13,19,.34); display:flex; flex-direction:column; gap:8px; justify-content:center; }
.import-job-actions label { font-size:.67rem; gap:5px; color:#718097; }
.import-job-actions select { padding:9px 10px; font-size:.75rem; }
.import-job-actions button { width:100%; min-height:38px; border-radius:10px; border:1px solid #2b3749; background:#18212d; color:#dce4ef; font-weight:700; }
.import-job-actions button.primary { border:0; background:linear-gradient(135deg,#5c71ff,#705cff); }
.import-job-actions .subtle-button:hover { background:#202b3a; }
.import-pager { padding:15px 18px 17px; margin:0; border-top:1px solid var(--border); background:#0f151f; }

.admin-upload-box { background:linear-gradient(180deg,#171f2b,#121923); border-color:#2b3850; box-shadow:inset 0 1px rgba(255,255,255,.02); }
.admin-upload-box h3::before { content:"ADMIN"; display:inline-block; margin-right:8px; color:#9489ff; font-size:.58rem; letter-spacing:.12em; vertical-align:middle; }

@media (max-width: 1350px) {
  .admin-stats-grid { grid-template-columns:repeat(3,1fr); }
  .import-meta-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 980px) {
  .app-shell { grid-template-columns:1fr; }
  .admin-hero { align-items:flex-start; flex-direction:column; }
  .admin-hero-actions { width:100%; }
  .import-queue-head { align-items:flex-start; flex-direction:column; }
  .import-filter-bar { width:100%; grid-template-columns:1fr 1fr 42px; }
  .import-job-card { grid-template-columns:5px minmax(0,1fr); }
  .import-job-actions { grid-column:2; border-left:0; border-top:1px solid rgba(47,59,78,.72); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .admin-stats-grid { grid-template-columns:1fr 1fr; }
  .admin-hero { padding:20px; border-radius:19px; }
  .admin-hero-actions { display:grid; grid-template-columns:1fr; }
  .import-filter-bar { grid-template-columns:1fr 42px; }
  .import-filter-bar select { grid-column:1 / -1; }
  .import-meta-grid { grid-template-columns:1fr; }
  .import-job-actions { grid-template-columns:1fr; }
  .import-job-header { flex-direction:column; }
  .import-file-tags { justify-content:flex-start; }
}

/* Stage 6.0.2: paged comic reader (Com-X-like navigation). */
.reader-mode-select { width:auto; min-width:126px; padding:8px 10px; background:#171c24; color:white; border:1px solid var(--border); border-radius:10px; }
.reader-scroll-paged { overflow:hidden; display:flex; align-items:stretch; background:#020305; touch-action:pan-y; }
.reader-pages-paged { position:relative; width:100%; max-width:none; height:100%; margin:0; display:grid; place-items:center; background:#020305; overflow:hidden; }
.reader-page-single { margin:0; width:100%; height:100%; min-height:0; display:grid; place-items:center; position:relative; cursor:pointer; user-select:none; -webkit-user-select:none; }
.reader-page-single img { display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; background:#050608; cursor:pointer; user-select:none; -webkit-user-drag:none; }
.reader-page-single figcaption { position:absolute; right:18px; bottom:16px; padding:5px 9px; border-radius:9px; color:#e9edf4; background:rgba(0,0,0,.62); font-size:.76rem; pointer-events:none; }
.reader-nav { position:absolute; z-index:4; top:50%; transform:translateY(-50%); width:50px; height:76px; border:0; border-radius:16px; display:grid; place-items:center; color:white; background:rgba(17,22,30,.68); backdrop-filter:blur(8px); font-size:2.3rem; line-height:1; cursor:pointer; transition:background .15s, opacity .15s; }
.reader-nav:hover { background:rgba(39,119,255,.76); }
.reader-nav:disabled { opacity:.16; cursor:default; }
.reader-nav-prev { left:14px; }
.reader-nav-next { right:14px; }
@media (max-width:820px) {
  .reader-toolbar { height:auto; min-height:58px; flex-basis:auto; grid-template-columns:auto minmax(0,1fr); }
  .reader-toolbar-actions { grid-column:1 / -1; justify-content:center; padding-bottom:3px; }
  .reader-mode-select { min-width:112px; max-width:128px; font-size:.78rem; }
  .reader-nav { width:42px; height:64px; border-radius:13px; font-size:2rem; background:rgba(17,22,30,.52); }
  .reader-nav-prev { left:6px; }
  .reader-nav-next { right:6px; }
}
@media (max-width:520px) {
  .reader-page-single figcaption { right:8px; bottom:8px; }
  .reader-nav { width:36px; height:54px; font-size:1.7rem; }
  .reader-mode-select { min-width:102px; }
}


/* Stage 6.0.3: tall-page scrolling + manual catalog search in bulk import. */
.reader-scroll-paged {
  overflow-x:hidden;
  overflow-y:auto;
  display:block;
  align-items:initial;
  background:#020305;
  touch-action:pan-y;
  overscroll-behavior-y:contain;
}
.reader-pages-paged {
  position:relative;
  width:100%;
  max-width:none;
  min-height:100%;
  height:auto;
  margin:0;
  display:block;
  background:#020305;
  overflow:visible;
}
.reader-page-single {
  margin:0 auto;
  width:100%;
  min-height:100%;
  height:auto;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  position:relative;
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
}
.reader-page-single img {
  display:block;
  max-width:100%;
  max-height:none;
  width:auto;
  height:auto;
  object-fit:initial;
  background:#050608;
  cursor:pointer;
  user-select:none;
  -webkit-user-drag:none;
}
.reader-nav { position:fixed; }
.import-catalog-search { display:grid; gap:7px; padding-top:3px; }
.import-catalog-search > label { font-size:.67rem; color:#718097; }
.import-search-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; }
.import-search-row input,
.import-search-results {
  width:100%;
  min-width:0;
  border:1px solid #2b3749;
  border-radius:9px;
  background:#101721;
  color:#e8edf5;
  padding:9px 10px;
  font:inherit;
  font-size:.76rem;
}
.import-search-row button { width:auto !important; min-width:66px; }
.import-search-results { min-height:40px; }
.import-search-hint { color:#65748a; font-size:.66rem; line-height:1.35; }
@media (max-width:520px) {
  .import-search-row { grid-template-columns:1fr; }
  .import-search-row button { width:100% !important; }
}


/* Stage 6.0.6: cover-first series view. */
.series-progress-card { width:100%; color:inherit; text-align:left; font:inherit; cursor:pointer; }
.series-progress-card:hover { transform:translateY(-1px); border-color:#414c5d; }
.series-page-toolbar { display:flex; align-items:center; margin-bottom:12px; }
.series-back-button { border:1px solid var(--border); background:var(--panel); color:var(--text); border-radius:12px; padding:9px 13px; }
.series-hero { padding:18px 20px; }
.series-hero-main { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; }
.series-hero-main h2 { margin:8px 0 5px; font-size:1.55rem; }
.series-hero-publisher { min-height:26px; }
.series-hero-score { text-align:right; min-width:110px; }
.series-hero-score strong { display:block; font-size:1.7rem; }
.series-hero-score span { color:var(--muted); font-size:.78rem; }
.series-hero-progress { margin-top:17px; }
.series-hero-stats { display:flex; flex-wrap:wrap; gap:8px 18px; color:var(--muted); font-size:.82rem; }
.series-hero-stats b { color:var(--text); }
.series-issues-head { display:flex; justify-content:space-between; align-items:end; gap:16px; margin:6px 2px 13px; }
.series-issues-head h3 { margin:0 0 4px; }
.series-issues-head p { margin:0; }
.series-cover-legend { font-size:.78rem; }
.series-issue-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:18px 14px; align-items:start; }
.series-issue-card { min-width:0; padding:0; border:0; background:transparent; color:inherit; text-align:left; border-radius:14px; }
.series-cover-wrap { aspect-ratio:2 / 3; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--panel-2); position:relative; box-shadow:0 10px 28px rgba(0,0,0,.18); transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.series-issue-card:hover .series-cover-wrap { transform:translateY(-3px); border-color:#596578; box-shadow:0 16px 34px rgba(0,0,0,.28); }
.series-cover-wrap > img { display:block; width:100%; height:100%; object-fit:cover; }
.series-cover-placeholder { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:16px; text-align:center; background:linear-gradient(145deg,#1a202a,#11151c); color:#dbe2ec; }
.series-cover-placeholder span { font-weight:850; font-size:1.3rem; }
.series-cover-placeholder small { color:var(--muted); text-transform:uppercase; letter-spacing:.06em; font-size:.62rem; }
.series-cover-status { position:absolute; left:7px; top:7px; max-width:calc(100% - 14px); }
.series-cover-status .status-pill { padding:4px 7px; font-size:.61rem; box-shadow:0 3px 10px rgba(0,0,0,.26); }
.series-cover-languages { position:absolute; right:7px; bottom:7px; display:flex; gap:4px; }
.series-cover-languages .language-pill { padding:3px 6px; font-size:.58rem; box-shadow:0 3px 10px rgba(0,0,0,.28); }
.series-issue-copy { display:grid; gap:3px; padding:9px 2px 0; min-width:0; }
.series-issue-copy strong { font-size:.94rem; }
.series-issue-copy span { font-size:.78rem; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.series-issue-copy small { color:var(--muted); font-size:.68rem; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.detail-series-button { border:0; padding:0; background:transparent; color:#8eb4ff; font:inherit; font-weight:700; text-align:left; }
.detail-series-button:hover { text-decoration:underline; }
.series-loading { padding:10px 0; }
@media (max-width:640px) {
  .series-hero-main { gap:12px; }
  .series-hero-score { min-width:86px; }
  .series-issue-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 10px; }
  .series-issues-head { align-items:flex-start; }
  .series-cover-legend { display:none; }
}

/* Stage 6.0.9 — CBL / CBRO reading orders */
.reading-lists-hero{display:flex;justify-content:space-between;gap:24px;align-items:end;padding:26px 28px;margin-bottom:14px;border:1px solid var(--border);border-radius:22px;background:radial-gradient(circle at 85% 10%,rgba(122,103,255,.13),transparent 32%),linear-gradient(145deg,#141b27,#0d131c)}
.reading-lists-hero h3{font-size:1.9rem;margin:4px 0 6px;letter-spacing:-.035em}.reading-lists-hero p{margin:0;max-width:720px}.reading-list-filters{display:grid;grid-template-columns:minmax(220px,340px) 145px auto;gap:8px;min-width:min(100%,650px)}
.reading-list-admin{border-color:rgba(122,103,255,.28);background:linear-gradient(180deg,rgba(122,103,255,.055),rgba(17,23,34,.95))}.reading-list-admin-grid{display:grid;grid-template-columns:.8fr 1.6fr;gap:14px}.reading-list-import-box{padding:16px;border:1px solid var(--border);border-radius:16px;background:#0d131c;display:grid;gap:10px}.reading-list-import-box h4{margin:0}.reading-list-github-search{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:7px}.reading-list-github-results{display:grid;gap:7px;max-height:360px;overflow:auto;padding-right:3px}.github-cbl-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 11px;border:1px solid #263246;border-radius:11px;background:#111923}.github-cbl-row strong{display:block;color:#dbe3ef;font-size:.78rem}.github-cbl-row small{display:block;color:#697991;font-size:.67rem;margin-top:3px;overflow-wrap:anywhere}.github-cbl-row button{white-space:nowrap}
.reading-list-catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:13px}.reading-list-card{border:1px solid var(--border);border-radius:17px;overflow:hidden;background:linear-gradient(180deg,#151d29,#0f151e);text-align:left;color:inherit;padding:0;display:grid;grid-template-columns:94px minmax(0,1fr);min-height:142px;transition:.16s transform,.16s border-color,.16s box-shadow}.reading-list-card:hover{transform:translateY(-2px);border-color:#465675;box-shadow:0 16px 34px rgba(0,0,0,.18)}.reading-list-card-cover{width:94px;height:100%;min-height:142px;object-fit:cover;background:#0a0f16}.reading-list-card-placeholder{display:grid;place-items:center;font-size:2rem;font-weight:900;color:#3c4a60;background:linear-gradient(145deg,#141c28,#090e15)}.reading-list-card-body{padding:14px 14px 12px;min-width:0}.reading-list-card-body h4{margin:5px 0 6px;line-height:1.2}.reading-list-card-path{color:#6f7e94;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reading-list-card-stats{display:flex;gap:8px;flex-wrap:wrap;color:#8e9cb0;font-size:.69rem;margin-top:9px}.reading-list-card .progress-track{margin-top:9px;height:5px}
.reading-list-detail-header{margin:13px 0 15px;padding:20px 22px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(145deg,#151d29,#0e141d);display:flex;gap:18px;align-items:center}.reading-list-detail-cover{width:96px;aspect-ratio:2/3;border-radius:11px;object-fit:cover;background:#0a0f16}.reading-list-detail-copy{min-width:0;flex:1}.reading-list-detail-copy h3{font-size:1.6rem;margin:3px 0 6px}.reading-list-detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.reading-list-detail-meta span{padding:6px 9px;border:1px solid #2a3649;border-radius:999px;background:#101720;color:#94a3b8;font-size:.7rem}.reading-list-admin-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.reading-list-items{display:grid;gap:8px}.reading-order-item{display:grid;grid-template-columns:52px 64px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 12px;border:1px solid var(--border);border-radius:14px;background:#111823}.reading-order-pos{font-size:1.15rem;font-weight:900;color:#67758a;text-align:center}.reading-order-cover{width:64px;aspect-ratio:2/3;border-radius:7px;object-fit:cover;background:#0a0f16}.reading-order-cover.placeholder{display:grid;place-items:center;color:#3d4b60;font-weight:800}.reading-order-main{min-width:0}.reading-order-title{font-weight:800;color:#e7ecf5}.reading-order-cbl{font-size:.68rem;color:#68778d;margin-top:4px}.reading-order-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}.reading-order-tag{font-size:.62rem;padding:4px 6px;border-radius:999px;background:#1a2432;color:#8fa0b7}.reading-order-tag.ok{background:rgba(52,199,122,.12);color:#75dfa3}.reading-order-tag.warn{background:rgba(239,179,79,.12);color:#f4c56f}.reading-order-tag.bad{background:rgba(255,100,113,.12);color:#ff9ca5}.reading-order-actions{display:flex;gap:7px;align-items:center}.reading-order-actions button{white-space:nowrap}.reading-order-item.unmatched{border-color:rgba(239,179,79,.18);background:#15171b}
@media(max-width:900px){.reading-lists-hero{align-items:stretch;flex-direction:column}.reading-list-filters{grid-template-columns:1fr 130px auto;min-width:0}.reading-list-admin-grid{grid-template-columns:1fr}.reading-order-item{grid-template-columns:42px 58px minmax(0,1fr)}.reading-order-actions{grid-column:2/-1}.reading-list-detail-header{align-items:flex-start}}
@media(max-width:620px){.reading-list-filters,.reading-list-github-search{grid-template-columns:1fr}.reading-list-catalog{grid-template-columns:1fr}.reading-order-item{grid-template-columns:38px 52px minmax(0,1fr);gap:8px;padding:8px}.reading-list-detail-cover{width:76px}}