:root {
  --bg:#0f172a; --card:#ffffff; --muted:#64748b; --accent:#2563eb;
  --accent2:#7c3aed; --line:#e2e8f0; --ok:#059669; --danger:#b91c1c;
  --text:#0f172a; --text-soft:#334155;
  --page-bg:linear-gradient(160deg,#eef2ff,#f8fafc 40%);
  --nav-shadow:0 6px 20px rgba(37,99,235,.25);
  --btn-hover:#1d4ed8;
  --input-bg:#fff; --input-border:#cbd5e1; --focus-ring:#bfdbfe;
  --stat-bg:#f8fafc; --badge-bg:#eef2ff;
  --secondary-bg:#e2e8f0; --secondary-hover:#cbd5e1; --secondary-text:#0f172a;
}
* { box-sizing: border-box; }
body {
  margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--page-bg); color:var(--text); min-height:100vh;
}
a { color: var(--accent); }
nav {
  background: linear-gradient(90deg, var(--accent), var(--accent2)); color:#fff;
  box-shadow: var(--nav-shadow);
}
nav .inner {
  max-width: 1040px; margin:0 auto; padding: 14px 18px;
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
nav .brand { font-weight:700; font-size:1.15rem; letter-spacing:.3px; color:#fff; text-decoration:none; }
nav .links { display:flex; gap:16px; margin-left:auto; align-items:center; flex-wrap:wrap; }
nav .links a { color:#fff; text-decoration:none; opacity:.92; font-size:.95rem; }
nav .links a:hover { opacity:1; text-decoration:underline; }
nav .pts { background:rgba(255,255,255,.2); border-radius:999px; padding:4px 12px; font-size:.85rem; }
nav .lang-switch { display:inline-flex; align-items:center; margin-left:4px; }
nav .lang-switch select {
  background:rgba(255,255,255,.18); color:#fff; border:1px solid rgba(255,255,255,.28);
  border-radius:8px; padding:5px 8px; font-size:.85rem; cursor:pointer; max-width:11em;
}
nav .lang-switch select option { color:#0f172a; }
.visually-hidden {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
html[dir=rtl] nav .links { margin-left:0; margin-right:auto; }
html[dir=rtl] nav .lang-switch { margin-left:0; margin-right:4px; }

.wrap { max-width: 1040px; margin: 26px auto 48px; padding: 0 18px; }
.narrow { max-width: 460px; }
.card {
  background: var(--card); border:1px solid var(--line); border-radius:16px;
  padding: 24px; box-shadow: 0 10px 30px rgba(2,6,23,.06); margin-bottom: 20px;
}
h1.page { margin: 4px 0 18px; font-size:1.5rem; }
h2 { font-size:1.2rem; }
label.field { display:block; margin:14px 0 6px; font-weight:600; font-size:.92rem; }
input[type=text], input[type=email], input[type=password], input[type=number], select {
  width:100%; padding:11px 12px; border:1px solid var(--input-border); border-radius:10px; font-size:1rem;
  background:var(--input-bg); color:var(--text);
}
input:focus, select:focus { outline:2px solid var(--focus-ring); border-color: var(--accent); }
.btn {
  display:inline-block; margin-top:16px; background: var(--accent); color:#fff; border:none;
  padding:12px 22px; border-radius:10px; font-size:1rem; cursor:pointer; transition:.15s; text-decoration:none;
}
.btn:hover { background:var(--btn-hover); }
.btn.secondary { background:var(--secondary-bg); color:var(--secondary-text); }
.btn.secondary:hover { background:var(--secondary-hover); }
.btn.small { padding:7px 12px; font-size:.85rem; margin-top:0; }
.btn.ghost { background:var(--secondary-bg); color:var(--secondary-text); }
.btn.ghost:hover { background:var(--secondary-hover); }
.exports { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.fontsize { display:inline-flex; gap:6px; margin-left:auto; align-items:center; }
.fontsize-btn { min-width:2.2em; font-weight:700; font-size:1.15rem; line-height:1; }
.fontsize-val { min-width:2.6em; text-align:center; font-size:.85rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.queuebox { padding:14px 16px; }
.queuebox #qsummary { font-variant-numeric:tabular-nums; }
.spinrow { display:flex; align-items:center; gap:10px; font-weight:600; }
.spin2 { width:18px; height:18px; border:3px solid #cbd5e1; border-top-color: var(--accent);
  border-radius:50%; display:inline-block; animation:spin2 .8s linear infinite; }
@keyframes spin2 { to { transform:rotate(360deg); } }
.btn[disabled] { opacity:.6; cursor:not-allowed; }
.muted { color:var(--muted); font-size:.9rem; }
.meta { color:var(--muted); font-size:.85rem; margin-top:10px; }
.err { background:#fef2f2; border:1px solid #fecaca; color:var(--danger); padding:13px 15px; border-radius:10px; margin-bottom:14px; }
.ok  { background:#ecfdf5; border:1px solid #a7f3d0; color:#047857; padding:13px 15px; border-radius:10px; margin-bottom:14px; }
.center { text-align:center; }
.linkrow { margin-top:16px; font-size:.9rem; }
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; }
.stat { background:var(--stat-bg); border:1px solid var(--line); border-radius:12px; padding:16px; }
.stat .n { font-size:1.9rem; font-weight:700; color:var(--accent); }
.stat .l { color:var(--muted); font-size:.82rem; margin-top:4px; }
.copyrow { display:flex; gap:8px; margin-top:8px; }
.copyrow input { font-family: ui-monospace, monospace; font-size:.85rem; }
table.data { width:100%; border-collapse:collapse; font-size:.9rem; }
table.data th, table.data td { text-align:left; padding:9px 10px; border-bottom:1px solid var(--line); }
table.data th { color:var(--muted); font-weight:600; }
.pos { color: var(--ok); }
.neg { color: var(--danger); }
.badge { display:inline-block; background:var(--badge-bg); color:var(--accent); border-radius:999px; padding:2px 10px; font-size:.78rem; }

/* Buy points / packages */
.pkg-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:6px; }
.pkg {
  background: var(--card); border:1px solid var(--line); border-radius:16px; padding:22px 18px;
  text-align:center; box-shadow: 0 10px 30px rgba(2,6,23,.06); transition:.15s;
}
.pkg:hover { border-color:#c7d2fe; transform: translateY(-2px); }
.pkg-label { color:var(--muted); font-size:.85rem; text-transform:uppercase; letter-spacing:.5px; }
.pkg-points { font-size:2rem; font-weight:800; color:var(--accent); margin-top:6px; }
.pkg-sub { color:var(--muted); font-size:.8rem; margin-top:-2px; }
.pkg-price { font-size:1.3rem; font-weight:700; margin:12px 0 4px; }
.pkg .btn { width:100%; }

/* OCR tool */
.modes { display:flex; gap:10px; flex-wrap:wrap; margin: 4px 0 18px; }
.mode { flex:1 1 200px; border:2px solid var(--line); border-radius:12px; padding:12px 14px; cursor:pointer; transition:.15s; }
.mode:hover { border-color:#c7d2fe; }
.mode input { margin-right:8px; }
.mode.sel { border-color: var(--accent); background:#eff6ff; }
.mode b { display:block; font-size:.98rem; }
.mode span { color:var(--muted); font-size:.82rem; }
.dropwrap { text-align:center; margin: 8px 0 16px; }
#flipform { text-align:center; }
#flipform .btn { margin-top: 4px; }
.drop { display:inline-block; width:100%; max-width:520px; border:2px dashed rgba(255,255,255,.55);
  border-radius:12px; padding:26px; text-align:center; color:#fff; background:var(--accent);
  transition:.15s; cursor:pointer; font-weight:600; font-size:1.05rem; }
.drop:hover { background:#1d4ed8; }
.drop.drag { border-color:#fff; background:#1d4ed8; color:#fff; }
.drop input { display:none; }
.fname { margin-top:10px; font-size:.9rem; color:#fff; opacity:.95; }
.txt { width:100%; border-collapse:collapse; font-size:.92rem; }
.txt th, .txt td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); }
.txt th { color:var(--muted); font-weight:600; }
.score { font-variant-numeric: tabular-nums; color:var(--ok); }
.imgs { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; margin-top:8px; }
.imgs img { width:100%; border:1px solid var(--line); border-radius:10px; }
.md { line-height:1.6; overflow-x:auto; }
.md table { border-collapse:collapse; }
.md td, .md th { border:1px solid var(--line); padding:6px 10px; }
pre { background:#0f172a; color:#e2e8f0; padding:14px; border-radius:10px; overflow-x:auto; }
.ocrtext { white-space:pre-wrap; word-break:break-word; background:#f8fafc; color:#0f172a;
           border:1px solid var(--line); max-height:600px; overflow:auto; }
details { margin-top:14px; }
summary { cursor:pointer; color:var(--muted); }
.spin { display:none; }
.loading .spin { display:inline-block; }

/* Per-page progress bar */
.pbar { margin-top:12px; height:10px; background:#e2e8f0; border-radius:999px; overflow:hidden; }
.pbar-fill { height:100%; width:0; background:var(--accent); border-radius:999px; transition:width .3s ease; }

/* Two-column compare / edit view */
.cmp-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.cmp-left, .cmp-right { min-width:0; }
.cmp-head { font-weight:600; color:var(--muted); font-size:.85rem; margin-bottom:6px;
  display:flex; align-items:center; gap:8px; justify-content:space-between; }
.cmp-left img { width:100%; border:1px solid var(--line); border-radius:10px; background:#fff; }
.pageedit { width:100%; min-height:320px; resize:vertical; font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:.9rem; line-height:1.5; padding:12px; border:1px solid var(--line); border-radius:10px;
  color:#0f172a; background:#fff; }
.cmp-preview { border:1px solid var(--line); border-radius:10px; padding:12px 16px; min-height:320px; background:#fff; outline:none;
  font-size: var(--ocr-preview-fs, 16px); }
.cmp-preview.md p { margin:0 0 .35em; }
.cmp-preview.md h1, .cmp-preview.md h2, .cmp-preview.md h3,
.cmp-preview.md h4, .cmp-preview.md h5, .cmp-preview.md h6 { margin:.85em 0 .4em; }
.cmp-preview.md ul { margin:0 0 .7em; padding-left:1.3em; }
.cmp-page { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.cmp-page:first-of-type { border-top:0; padding-top:8px; }
.cmp-missing { border:1px dashed var(--line); border-radius:10px; padding:28px 16px;
  color:var(--muted); text-align:center; background:#f8fafc; }
.cmp-preview .ocrtext { max-height:none; }
.mj-edit { cursor:text; border-radius:4px; padding:0 2px; white-space:normal; }
.mj-edit:hover, .mj-edit:focus-within { outline:2px solid #93c5fd; background:#eff6ff; }
.mj-edit.mj-display { display:block; text-align:center; margin:2px 0; padding:0; }
.cmp-preview .katex { font-size:1.06em; }
.cmp-preview .katex-display { margin:0.12em 0; }
.mj-src { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.95rem;
  border:1px solid var(--accent); border-radius:6px; padding:4px 6px; background:#fff; color:#0f172a; }
input.mj-src { min-width:8em; max-width:100%; }
textarea.mj-src { display:block; width:100%; min-height:72px; resize:vertical; }
.mj-edit.mj-editing { display:block; padding:6px; text-align:left; }
.mj-edit:not(.mj-display).mj-editing { display:inline-block; vertical-align:top; min-width:12em; }
.mj-live { margin-top:6px; min-height:1.4em; background:#fff; border-radius:6px; padding:6px 8px;
  overflow-x:auto; }
.mj-live mjx-container { margin:0 !important; }
@media (max-width: 820px) { .cmp-row { grid-template-columns:1fr; } }

/* Ad slots (admin-managed) */
.ad-slot { margin:16px 0; text-align:center; overflow:hidden; }
.ad-slot.ad-top { margin-top:0; }
.license-key { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:1.1rem; letter-spacing:1px; }

/* Branding logo + footer */
.brand-logo { height:28px; width:auto; display:block; }
.site-footer { background: linear-gradient(90deg, var(--accent), var(--accent2)); color:#fff;
  box-shadow: var(--nav-shadow); margin-top:40px; }
.site-footer .inner { max-width:1040px; margin:0 auto; padding:22px 18px; text-align:center; }
.footer-links { display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:center; margin-bottom:10px; }
.footer-links a { color:#fff; text-decoration:none; opacity:.92; font-size:.95rem; }
.footer-links a:hover { opacity:1; text-decoration:underline; }
.footer-copy { color:#fff; opacity:.85; font-size:.85rem; }

/* Landing pricing (Free vs Premium) */
.pricing { margin: 8px 0 28px; }
.pricing-title { text-align:center; font-size:1.7rem; margin: 8px 0 8px; }
.pricing-lead, .pricing-lead-html { text-align:center; margin:0 0 18px; }
.pricing-lead-html p { margin:0 0 8px; }
.hero-html { max-width:560px; margin:0 auto 8px; }
.hero-html p { margin:0 0 8px; }
.plan-html { color:#334155; font-size:.92rem; }
.plan-html ul { margin:0 0 8px; padding-left:1.15em; }
.plan-html li { margin:6px 0; }
.compare-note { margin-top:18px; }
.bill-toggle { display:flex; justify-content:center; gap:8px; margin:0 0 22px; }
.bill-btn { border:1px solid var(--line); background:#fff; color:#0f172a; border-radius:999px;
  padding:8px 16px; cursor:pointer; font-size:.92rem; }
.bill-btn.is-on { background:var(--accent); color:#fff; border-color:var(--accent); }
.bill-save { background:rgba(255,255,255,.22); border-radius:999px; padding:1px 7px; margin-left:4px; font-size:.78rem; }
.plan-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; max-width:820px; margin:0 auto 10px; }
.plan-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px 22px 20px;
  box-shadow: 0 10px 30px rgba(2,6,23,.06); }
.plan-card-hot { border-color:#93c5fd; box-shadow: 0 12px 32px rgba(37,99,235,.14); }
.plan-name { font-size:1.35rem; font-weight:800; }
.plan-for { color:var(--muted); font-size:.85rem; margin:4px 0 12px; }
.plan-price { font-size:2rem; font-weight:800; line-height:1.1; }
.plan-price small { font-size:.95rem; font-weight:600; color:var(--muted); }
.plan-sub { color:var(--muted); font-size:.85rem; margin:6px 0 14px; }
.plan-list { margin:0 0 8px; padding-left:1.15em; color:#334155; font-size:.92rem; }
.plan-list li { margin:6px 0; }
.plan-card .btn { width:100%; text-align:center; margin-top:12px; }
.plan-grid[data-period="month"] .plan-price-year,
.plan-grid[data-period="month"] .plan-sub-year { display:none; }
.plan-grid[data-period="year"] .plan-price-month,
.plan-grid[data-period="year"] .plan-sub-month { display:none; }
.compare-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:16px;
  box-shadow: 0 10px 30px rgba(2,6,23,.06); }
table.compare { width:100%; border-collapse:collapse; font-size:.92rem; }
table.compare th, table.compare td { padding:11px 14px; border-bottom:1px solid var(--line); text-align:center; }
table.compare thead th { background:#f8fafc; font-size:1rem; }
table.compare thead th span { display:block; font-weight:500; color:var(--muted); font-size:.78rem; margin-top:2px; }
table.compare td:first-child, table.compare thead th:first-child { text-align:left; }
table.compare tbody th { background:#eef2ff; color:#1e3a8a; text-align:left; font-size:.82rem; letter-spacing:.02em; }
@media (max-width:640px){ .plan-grid { grid-template-columns:1fr; } }

/* Footer article pages */
.article-body { line-height:1.7; color:#334155; max-width:46rem; }
.article-body h2 { margin-top:28px; font-size:1.25rem; }
.article-body h3 { margin-top:20px; font-size:1.05rem; }
.article-body p { margin:12px 0; }
.article-body ul, .article-body ol { margin:12px 0 12px 20px; }
.article-body .compare { margin:16px 0; font-size:.92rem; }

/* WordPress-style Classic Editor (admin) */
.classic-editor { margin:6px 0 8px; }
.classic-tabs { display:flex; gap:0; }
.classic-tabs button { border:1px solid var(--line); background:#f8fafc; color:#0f172a;
  padding:7px 14px; cursor:pointer; font-size:.85rem; border-bottom:0; border-radius:8px 8px 0 0; }
.classic-tabs button.is-on { background:#fff; font-weight:600; }
.classic-editor textarea { width:100%; min-height:180px; border:1px solid var(--line); border-radius:0 8px 8px 8px;
  padding:10px 12px; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.9rem; }
.classic-editor .tox-tinymce { border-radius:0 8px 8px 8px !important; }

/* Admin log table */
.logtable { width:100%; border-collapse:collapse; font-size:.85rem; }
.logtable th, .logtable td { text-align:left; padding:6px 8px; border-bottom:1px solid #e2e8f0; white-space:nowrap; }
.logtable td.wrap { white-space:normal; word-break:break-all; }

.tool-cat { margin: 22px 0 10px; font-size:1.1rem; color:#334155; }
.tool-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; margin-bottom:8px; }
.tool-card {
  text-align:left; background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:16px 14px; cursor:pointer; box-shadow: 0 8px 20px rgba(2,6,23,.04);
}
.tool-card:hover { border-color:#93c5fd; box-shadow: 0 10px 24px rgba(37,99,235,.12); }
.tool-card { text-decoration:none; color:inherit; display:block; }
.tool-card strong { display:block; font-size:1rem; margin-bottom:6px; }
.tool-card span { display:block; color:var(--muted); font-size:.85rem; line-height:1.35; }
.tool-card .tool-uses { display:block; margin-top:8px; font-style:normal; font-size:.8rem; color:var(--accent); }
.tool-card[disabled] { opacity:.5; cursor:not-allowed; }
.usage-block .usage-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.usage-block .usage-table th, .usage-block .usage-table td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); }
.all-tools { margin: 28px 0 8px; }
.tool-admin-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:8px 14px; }
.tool-admin-item { display:flex; gap:8px; align-items:flex-start; font-size:.92rem; }
.tool-admin-item input { margin-top:4px; }
.tool-admin-item small { display:block; color:var(--muted); font-size:.8rem; line-height:1.3; }
#toolstatus { margin-left:10px; }

.ticket-thread { display:flex; flex-direction:column; gap:10px; margin:12px 0 18px; }
.ticket-msg { border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--stat-bg); }
.ticket-msg.from-admin { border-color:var(--accent); }
.ticket-msg .meta { margin-top:0; margin-bottom:6px; }

.theme-pick { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; margin:12px 0 8px; }
.theme-opt { display:flex; flex-direction:column; gap:4px; border:1px solid var(--line); border-radius:14px;
  padding:12px; cursor:pointer; background:var(--stat-bg); }
.theme-opt:has(input:checked) { border-color:var(--accent); box-shadow:0 0 0 2px var(--focus-ring); }
.theme-opt input { margin:0; }
.theme-opt strong { font-size:.95rem; }
.theme-opt small { color:var(--muted); font-size:.78rem; line-height:1.3; }
.theme-swatch { height:36px; border-radius:8px; display:block; }

.theme-opt-aurora .theme-swatch { background:linear-gradient(90deg,#2563eb,#7c3aed); }
.theme-opt-midnight .theme-swatch { background:linear-gradient(90deg,#1e293b,#38bdf8); }
.theme-opt-ocean .theme-swatch { background:linear-gradient(90deg,#0e7490,#14b8a6); }
.theme-opt-sunset .theme-swatch { background:linear-gradient(90deg,#ea580c,#f59e0b); }
.theme-opt-forest .theme-swatch { background:linear-gradient(90deg,#047857,#65a30d); }
.theme-opt-blossom .theme-swatch { background:linear-gradient(90deg,#db2777,#c026d3); }
.theme-opt-graphite .theme-swatch { background:linear-gradient(90deg,#334155,#64748b); }

html.theme-aurora {
  --accent:#2563eb; --accent2:#7c3aed; --btn-hover:#1d4ed8;
  --page-bg:linear-gradient(160deg,#eef2ff,#f8fafc 40%);
  --nav-shadow:0 6px 20px rgba(37,99,235,.25);
}
html.theme-midnight {
  --text:#e2e8f0; --text-soft:#cbd5e1; --muted:#94a3b8;
  --card:#111827; --line:#1f2937; --stat-bg:#0b1220; --badge-bg:#1e293b;
  --accent:#38bdf8; --accent2:#818cf8; --btn-hover:#0ea5e9;
  --page-bg:radial-gradient(1200px 600px at 10% -10%,#1e293b,transparent 50%), #020617;
  --nav-shadow:0 6px 24px rgba(2,6,23,.6);
  --input-bg:#0b1220; --input-border:#334155; --focus-ring:#164e63;
  --secondary-bg:#1e293b; --secondary-hover:#334155; --secondary-text:#e2e8f0;
}
html.theme-ocean {
  --accent:#0e7490; --accent2:#14b8a6; --btn-hover:#0f766e;
  --page-bg:linear-gradient(160deg,#ecfeff,#f0fdfa 45%);
  --badge-bg:#ccfbf1; --nav-shadow:0 6px 20px rgba(14,116,144,.22);
}
html.theme-sunset {
  --accent:#ea580c; --accent2:#f59e0b; --btn-hover:#c2410c;
  --page-bg:linear-gradient(160deg,#fff7ed,#fffbeb 40%);
  --badge-bg:#ffedd5; --nav-shadow:0 6px 20px rgba(234,88,12,.22);
}
html.theme-forest {
  --accent:#047857; --accent2:#65a30d; --btn-hover:#065f46;
  --page-bg:linear-gradient(160deg,#ecfdf5,#f7fee7 40%);
  --badge-bg:#d1fae5; --nav-shadow:0 6px 20px rgba(4,120,87,.22);
}
html.theme-blossom {
  --accent:#db2777; --accent2:#c026d3; --btn-hover:#be185d;
  --page-bg:linear-gradient(160deg,#fdf2f8,#fae8ff 40%);
  --badge-bg:#fce7f3; --nav-shadow:0 6px 20px rgba(219,39,119,.22);
}
html.theme-graphite {
  --accent:#334155; --accent2:#64748b; --btn-hover:#1e293b;
  --page-bg:linear-gradient(160deg,#f1f5f9,#ffffff 40%);
  --badge-bg:#e2e8f0; --nav-shadow:0 6px 20px rgba(15,23,42,.16);
}

html.theme-midnight .card,
html.theme-midnight .tool-card,
html.theme-midnight .plan-card,
html.theme-midnight .compare-wrap { background:var(--card); color:var(--text); }
html.theme-midnight .plan-html,
html.theme-midnight .article-body { color:var(--text-soft); }
html.theme-midnight table.compare tbody th { background:#1e293b; color:#e2e8f0; }
html.theme-midnight table.compare thead th { background:#0b1220; }

.wrap.flip-wide { max-width:1280px; }
.flip-wrap {
  display:flex; align-items:stretch; gap:0;
  margin-bottom:24px;
}
.flip-text-pane {
  display:none; flex:0 0 34%; max-width:380px; min-width:0;
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  overflow:auto; max-height:640px; padding:16px 18px;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
}
.flip-text-pane.visible { display:block; }
.flip-wrap.is-text-open { gap:12px; }
.flip-wrap.is-text-open .flip-stage { flex:1 1 auto; min-width:0; margin-bottom:0; }
.flip-page-text { display:none; margin:0 0 18px; }
.flip-page-text.visible { display:block; }
.flip-page-label { font-size:.82rem; color:var(--muted); margin:0 0 8px; font-weight:600; }
.flip-page-body { white-space:pre-wrap; font-size:.92rem; line-height:1.55; color:var(--text); }
.flip-no-text { color:var(--muted); font-size:.9rem; margin:0 0 12px; }
.flip-stage {
  background:#0b1220; border-radius:16px; overflow:hidden; min-height:640px;
  margin-bottom:24px; box-shadow:0 10px 30px rgba(2,6,23,.12); flex:1 1 auto;
}
.flip-stage ._df_book { width:100%; }
.flip-head .copyrow { margin-top:12px; flex-wrap:wrap; align-items:center; }
.flip-lang-note { font-size:.85rem; color:var(--muted); margin: 8px 0 0; }
.flip-lang-list {
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:16px 18px 8px; margin:0 0 24px; box-shadow:0 10px 30px rgba(2,6,23,.06);
}
.flip-lang-list h2 { margin:0 0 10px; font-size:1.05rem; }
.flip-lang-row {
  display:flex; gap:12px; align-items:baseline; flex-wrap:wrap;
  padding:8px 0; border-bottom:1px solid var(--line); font-size:.92rem;
}
.flip-lang-row:last-child { border-bottom:0; }
.flip-lang-row.is-current .flip-lang-name { font-weight:700; }
.flip-lang-name { min-width:7.5em; }
.flip-lang-url { font-family:ui-monospace,monospace; font-size:.82rem; word-break:break-all; }
.flip-lang-row.is-wait .flip-lang-url { color:var(--muted); }
.flip-lang-state { color:var(--muted); font-size:.82rem; }
@media (max-width:800px) {
  .flip-wrap.is-text-open { flex-direction:column; }
  .flip-text-pane { max-width:none; flex-basis:auto; max-height:240px; }
}

.live-dot {
  display: inline-block; width: 8px; height: 8px; margin-left: 6px;
  border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,.7);
  animation: live-pulse 1.6s ease-out infinite; vertical-align: middle;
}
@keyframes live-pulse {
  0% { box-shadow: 0 0 0 0 rgba(34,197,94,.55); }
  70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); }
  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}
.process-log {
  max-height: 320px; overflow: auto; font: 12px/1.45 ui-monospace, monospace;
  background: #0b1220; color: #e2e8f0; padding: 12px 14px; border-radius: 10px;
  white-space: pre-wrap; word-break: break-word;
}
.top-flips { margin: 0 0 28px; }
.top-flips h2 { margin: 0 0 12px; font-size: 1.2rem; }
.top-flips-roll { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.top-flips-track {
  display: flex; gap: 14px; width: max-content;
  animation: top-flips-roll 80s linear infinite;
}
.top-flips-track:hover { animation-play-state: paused; }
.top-flip-card {
  flex: 0 0 168px; width: 168px; text-decoration: none; color: inherit;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  overflow: hidden; box-shadow: 0 8px 20px rgba(2,6,23,.06);
}
.top-flip-card img { display: block; width: 100%; height: 220px; object-fit: cover; background: #e2e8f0; }
.top-flip-card .t { display: block; padding: 8px 10px 2px; font-weight: 600; font-size: .86rem; line-height: 1.3; }
.top-flip-card .v { display: block; padding: 0 10px 10px; color: var(--muted); font-size: .78rem; }
@keyframes top-flips-roll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.free-group h2 { margin:0 0 12px; }
.free-cats { margin:0; padding-left:1.2em; columns:2; }
.free-cats li { margin:0 0 6px; break-inside:avoid; }
.free-books { list-style:none; margin:0; padding:0; }
.free-books li {
  display:flex; gap:12px; align-items:center; justify-content:space-between;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.free-books li:last-child { border-bottom:0; }
.free-book-meta { min-width:0; }
.free-book-meta strong { display:block; }
.free-book-hero { display:flex; gap:22px; align-items:flex-start; }
.free-cover { width:140px; max-width:30%; height:auto; border-radius:8px; box-shadow:0 8px 20px rgba(2,6,23,.12); }
.free-summary { margin:18px 0; line-height:1.55; color:var(--text-soft); }
.free-about th { width:34%; color:var(--muted); font-weight:600; }
@media (max-width:700px) {
  .free-cats { columns:1; }
  .free-books li { flex-direction:column; align-items:flex-start; }
}
