/* RTKed — dark theme inspired by VS Code Dark+ */
:root {
  --bg: #1e1e1e;
  --bg-alt: #252526;
  --bg-input: #3c3c3c;
  --bg-hover: #2a2d2e;
  --border: #3c3c3c;
  --text: #d4d4d4;
  --text-bright: #ffffff;
  --muted: #8b949e;
  --blue: #569cd6;
  --light-blue: #9cdcfe;
  --aqua: #4ec9b0;
  --green: #6a9955;
  --bright-green: #b5cea8;
  --accent: #007acc;
  --accent-hover: #1a8ad4;
  --yellow: #dcdcaa;
  --orange: #ce9178;
  --red: #f48771;
  --red-bg: #5a1d1d;
  --radius: 4px;
  --mono: Consolas, "Cascadia Code", "Fira Code", Menlo, monospace;
}

* { box-sizing: border-box; }
html { color-scheme: dark; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 15px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, sans-serif;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main { flex: 1; padding-top: 1.5rem; padding-bottom: 2rem; }
.wrap { max-width: 1100px; margin: 0 auto; padding-left: 1.25rem; padding-right: 1.25rem; }

a { color: var(--light-blue); text-decoration: none; }
a:hover { color: var(--aqua); text-decoration: underline; }
h1, h2, h3 { color: var(--text-bright); font-weight: 600; line-height: 1.25; }
h1 { font-size: 1.6rem; margin: 0 0 .4rem; }
h2 { font-size: 1.1rem; margin: 0 0 .75rem; color: var(--aqua); }
code { font-family: var(--mono); color: var(--orange); background: var(--bg-alt); padding: .1em .35em; border-radius: 3px; }
mark { background: #613214; color: var(--text-bright); padding: 0 .1em; border-radius: 2px; }
.muted { color: var(--muted); }
.req { color: var(--red); }

/* header */
.site-header { background: #181818; border-bottom: 1px solid var(--border); border-top: 3px solid var(--accent); }
.header-inner { display: flex; align-items: center; gap: 1.25rem; padding-top: .7rem; padding-bottom: .7rem; flex-wrap: wrap; }
.brand { font-size: 1.6rem; font-weight: 700; letter-spacing: .02em; font-family: var(--mono); }
.brand:hover { text-decoration: none; }
.brand-mark { color: var(--aqua); }
.brand-ed { color: var(--blue); }
.brand-admin { font-size: .7rem; color: var(--yellow); margin-left: .5rem; text-transform: uppercase; letter-spacing: .1em; vertical-align: middle; border: 1px solid var(--yellow); padding: .05rem .35rem; border-radius: 3px; }
.search { display: flex; flex: 1; min-width: 240px; max-width: 520px; }
.search input { flex: 1; border-radius: var(--radius) 0 0 var(--radius); }
.search button { border-radius: 0 var(--radius) var(--radius) 0; background: var(--accent); color: #fff; border: 1px solid var(--accent); padding: 0 1rem; cursor: pointer; }
.search button:hover { background: var(--accent-hover); }
.admin-nav { display: flex; gap: 1rem; align-items: center; margin-left: auto; }

.site-footer { border-top: 1px solid var(--border); color: var(--muted); padding: 1rem 0; font-size: .85rem; background: #181818; }

/* forms */
input[type=text], input[type=search], input[type=date], input[type=password], textarea, select {
  width: 100%;
  background: var(--bg-input);
  color: var(--text-bright);
  border: 1px solid var(--bg-input);
  border-radius: var(--radius);
  padding: .5rem .6rem;
  font: inherit;
}
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
input.invalid, textarea.invalid { border-color: var(--red); }
.field-error { display: block; color: var(--red); font-size: .85rem; margin-top: .2rem; }
label { display: block; color: var(--light-blue); font-size: .9rem; }
label > input, label > textarea { margin-top: .3rem; }
.grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.25rem; }
.grid .span-2 { grid-column: span 2; }
.grid label:has(textarea) { grid-column: 1 / -1; }
.block { margin-bottom: 1.25rem; }
.block > label { margin-bottom: .3rem; }
@media (max-width: 760px) { .grid { grid-template-columns: 1fr; } .grid .span-2 { grid-column: auto; } }

.btn, button.btn {
  display: inline-block;
  background: #3a3d41;
  color: var(--text-bright);
  border: 1px solid #4a4d51;
  border-radius: var(--radius);
  padding: .45rem .95rem;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { background: #45494e; text-decoration: none; color: var(--text-bright); }
.btn:disabled { opacity: .55; cursor: progress; }
.btn-primary { background: var(--accent); border-color: var(--accent); }
.btn-primary:hover { background: var(--accent-hover); }
.btn-danger { background: transparent; border-color: var(--red); color: var(--red); }
.btn-danger:hover { background: var(--red-bg); color: #fff; }
.btn-small { padding: .2rem .55rem; font-size: .8rem; }
.linkish { background: none; border: 0; color: var(--light-blue); cursor: pointer; font: inherit; padding: 0; display: inline; }
.linkish:hover { color: var(--aqua); text-decoration: underline; }
form.inline { display: inline; }
.form-actions { display: flex; gap: .75rem; margin-top: 1.25rem; }
.danger-zone { margin-top: 3rem; padding-top: 1rem; border-top: 1px dashed var(--border); }

.panel { background: var(--bg-alt); border: 1px solid var(--border); border-radius: 6px; padding: 1rem 1.25rem; margin-bottom: 1.25rem; }
fieldset.panel legend { color: var(--aqua); font-weight: 600; padding: 0 .4rem; }

.alert { padding: .7rem 1rem; border-radius: var(--radius); margin: 0 0 1rem; border-left: 4px solid; }
.alert ul { margin: .4rem 0 0; padding-left: 1.25rem; }
.alert-ok { background: #1e3a2a; border-color: var(--aqua); color: var(--bright-green); }
.alert-error { background: var(--red-bg); border-color: var(--red); color: #ffd7d0; }
.alert-warn { background: #3b3417; border-color: var(--yellow); color: var(--yellow); }

.crumbs { margin: 0 0 .75rem; font-size: .9rem; }
.list-head { margin-bottom: .5rem; }
.list-head p { margin: 0 0 .5rem; }
.empty { color: var(--muted); padding: 2rem 0; text-align: center; }

/* pagination */
.pagination { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin: .9rem 0; }
.page { padding: .25rem .6rem; border: 1px solid var(--border); border-radius: var(--radius); font-size: .88rem; color: var(--light-blue); }
a.page:hover { background: var(--bg-hover); text-decoration: none; }
.page.current { background: var(--accent); border-color: var(--accent); color: #fff; }
.page.disabled { color: #5a5a5a; }
.page.gap { border: 0; color: var(--muted); }
.page-info { margin-left: auto; color: var(--muted); font-size: .85rem; }

/* tree list */
.rtk-tree, .rtk-tree ul { list-style: none; margin: 0; padding: 0; }
.rtk-node { padding: .8rem 0 .9rem; border-bottom: 1px solid #2d2d2d; }
.rtk-title { font-size: 1.12rem; font-weight: 600; }
.rtk-title::before { content: "\25B8"; color: var(--aqua); margin-right: .45rem; }
.rtk-title a { color: var(--text-bright); }
.rtk-title a:hover { color: var(--aqua); }
.small-link { font-size: .8rem; font-weight: normal; margin-left: .6rem; color: var(--muted) !important; }
.rtk-branch { margin: .3rem 0 0 .45rem !important; padding-left: 1.4rem !important; border-left: 1px solid #3f4a4f; }
.rtk-branch > li { position: relative; padding: .12rem 0; }
.rtk-branch > li::before { content: ""; position: absolute; left: -1.4rem; top: .85em; width: 1rem; border-top: 1px solid #3f4a4f; }
.rtk-meta { display: flex; flex-wrap: wrap; gap: .25rem 1.1rem; font-size: .88rem; }
.label { color: var(--blue); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; margin-right: .2rem; }
.rtk-summary { color: var(--text); }
.rtk-snippet { color: var(--muted); font-size: .88rem; font-style: italic; }
.rtk-files ul { display: flex; flex-wrap: wrap; gap: .2rem 1.1rem; font-size: .9rem; }
.file-link { color: var(--bright-green); }
.file-link::before { content: "\2193"; color: var(--green); margin-right: .3rem; font-weight: bold; }
.file-link:hover { color: var(--aqua); }

/* detail */
.rtk-detail h1 { margin-bottom: 1rem; }
.fields { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1.25rem; margin: 0 0 1.5rem; }
.fields dt { color: var(--blue); font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; padding-top: .1rem; }
.fields dd { margin: 0; color: var(--text-bright); }
.keywords { display: flex; flex-wrap: wrap; gap: .35rem; }
.tag { background: #264f78; color: var(--text-bright); border-radius: 3px; padding: .05rem .5rem; font-size: .85rem; }
.tag:hover { background: var(--accent); text-decoration: none; color: #fff; }
.file-list { list-style: none; padding: 0; margin: 0; }
.file-list li { padding: .45rem 0; border-bottom: 1px solid #333; display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: center; }
.file-list li:last-child { border-bottom: 0; }
.file-list .stored { font-family: var(--mono); font-size: .75rem; color: #6a6a6a; }
.file-list .actions { margin-left: auto; display: flex; gap: .4rem; }
.rich-text { color: var(--text); overflow-wrap: anywhere; }
.rich-text img { max-width: 100%; height: auto; }
.rich-text table { border-collapse: collapse; max-width: 100%; }
.rich-text td, .rich-text th { border: 1px solid var(--border); padding: .3rem .5rem; }
.rich-text blockquote { border-left: 3px solid var(--green); margin-left: 0; padding-left: 1rem; color: var(--muted); }
.rich-text pre { background: var(--bg); padding: .75rem; overflow: auto; border-radius: var(--radius); }

/* uploads */
.drop-zone { border: 2px dashed #4a4d51; border-radius: 6px; padding: 1rem; text-align: center; margin-top: .75rem; transition: border-color .15s, background .15s; }
.drop-zone p { margin: .2rem 0; }
.drop-zone.drag { border-color: var(--aqua); background: #1f3330; }
.drop-zone.full { opacity: .6; }
.upload-queue { list-style: none; padding: 0; margin: .75rem 0 0; }
.upload-queue li { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); padding: .55rem .75rem; margin-bottom: .5rem; }
.upload-queue li.failed { border-color: var(--red); }
.q-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.q-name { color: var(--text-bright); overflow-wrap: anywhere; }
.progress { height: 6px; background: #333; border-radius: 3px; margin: .45rem 0 .3rem; overflow: hidden; }
.progress .bar { height: 100%; width: 0; background: linear-gradient(90deg, var(--accent), var(--aqua)); transition: width .15s; }
.progress-text { font-size: .8rem; color: var(--muted); }
.upload-error { color: var(--red); font-size: .85rem; }
.upload-error:empty { display: none; }

/* maintenance */
.maintenance-banner { background: #3b3417; color: var(--yellow); border-bottom: 1px solid var(--yellow); text-align: center; padding: .45rem 1rem; font-size: .9rem; }
.maintenance-panel summary { cursor: pointer; color: var(--aqua); font-weight: 600; }
.maintenance-panel form { margin-top: .75rem; }
.switch { display: inline-flex; align-items: center; gap: .6rem; margin-top: .9rem; cursor: pointer; color: var(--text-bright); }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch .slider { position: relative; width: 42px; height: 22px; background: #555; border-radius: 11px; transition: background .15s; flex: none; }
.switch .slider::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; }
.switch input:checked + .slider { background: var(--yellow); }
.switch-publish { margin: 0 0 1.1rem; }
.switch-publish input:checked + .slider { background: var(--aqua); }
.badge-unpublished { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--yellow); border: 1px solid var(--yellow); border-radius: 3px; padding: .05rem .4rem; margin-left: .6rem; vertical-align: middle; }
.switch input:checked + .slider::after { transform: translateX(20px); }
.switch input:focus-visible + .slider { outline: 2px solid var(--accent); outline-offset: 2px; }
.state-on { color: var(--yellow); }
.state-off { color: var(--bright-green); }
body.maintenance { justify-content: center; align-items: center; }
.maintenance-box { max-width: 560px; text-align: center; padding: 2rem; flex: 0; }
.maintenance-box .brand { font-size: 2.6rem; margin-bottom: 1rem; }
.maintenance-box h1 { color: var(--aqua); }
.maintenance-box p { color: var(--text); font-size: 1.05rem; }

/* admin tables */
.table-wrap { overflow-x: auto; margin: .5rem 0; border: 1px solid var(--border); border-radius: 6px; }
.data-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.data-table th { background: #2d2d30; color: var(--blue); text-align: left; font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; padding: .55rem .7rem; border-bottom: 1px solid var(--border); white-space: nowrap; }
.data-table td { padding: .5rem .7rem; border-bottom: 1px solid #2d2d2d; vertical-align: middle; }
.data-table tbody tr:nth-child(even) { background: #222223; }
.data-table tbody tr:hover { background: var(--bg-hover); }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table td.name a { color: var(--text-bright); font-weight: 600; }
.data-table td.name a:hover { color: var(--aqua); }
.data-table .num { text-align: right; }
.data-table .actions { display: table-cell; }
.data-table .actions .btn, .data-table .actions form { margin-right: .3rem; }
.data-table .badge-unpublished { margin-left: 0; }
.nowrap { white-space: nowrap; }
.mono { font-family: var(--mono); font-size: .82rem; }
.small { font-size: .85rem; }
.restore-form { display: flex; align-items: center; gap: .6rem; white-space: nowrap; }
.restore-upload > label, .restore-options { margin-bottom: .8rem; }
.restore-options { display: flex; flex-direction: column; gap: .3rem; }
.restore-upload .progress { max-width: 480px; }
.restore-upload .progress-text { margin: 0 0 .6rem; }
pre.cmd { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); padding: .7rem .9rem; overflow-x: auto; font-family: var(--mono); font-size: .82rem; color: var(--bright-green); white-space: pre; }
label.check { display: inline-flex; align-items: center; gap: .25rem; color: var(--text); font-size: .85rem; }
.upload-backup { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }

/* public submission */
.public-nav { margin-left: auto; }
.hp-field { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.captcha-row { display: flex; align-items: center; gap: .8rem; margin-bottom: .6rem; flex-wrap: wrap; }
.captcha-row img { border: 1px solid var(--border); border-radius: var(--radius); background: #1e1e1e; }
.captcha-input { display: block; max-width: 220px; font-family: var(--mono); letter-spacing: .15em; text-transform: uppercase; }
.captcha-box legend { color: var(--aqua); font-weight: 600; padding: 0 .4rem; }
.submit-done { max-width: 640px; }
.file-name { color: var(--bright-green); }

/* review status */
.status-switches { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin-bottom: 1.1rem; }
.status-switches .switch { margin: 0; }
.switch-review input:checked + .slider { background: var(--orange); }
.badge-review { font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: #1e1e1e; background: var(--orange); border-radius: 3px; padding: .05rem .4rem; margin-left: .4rem; vertical-align: middle; }
.status-filter { display: flex; flex-wrap: wrap; gap: .4rem; margin: .4rem 0 .6rem; }
.status-filter a { padding: .25rem .7rem; border: 1px solid var(--border); border-radius: 999px; font-size: .85rem; color: var(--light-blue); }
.status-filter a:hover { background: var(--bg-hover); text-decoration: none; }
.status-filter a.current { background: var(--accent); border-color: var(--accent); color: #fff; }
.status-filter a.has-review:not(.current) { border-color: var(--orange); color: var(--orange); }
.status-filter .count { opacity: .75; margin-left: .2rem; }

/* extracted text */
.extracted-text > summary, .extracted-file > summary { cursor: pointer; }
.extracted-text > summary { color: var(--aqua); font-weight: 600; }
.extracted-file { margin: .6rem 0 0 .4rem; }
.extracted-file > summary { color: var(--bright-green); }
pre.extracted { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); padding: .7rem .9rem; margin: .5rem 0; max-height: 420px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--mono); font-size: .8rem; color: var(--text); }

/* login */
.login-box { max-width: 380px; margin: 3rem auto; }
.login-box label { margin-bottom: .9rem; }
.login-box .btn { width: 100%; }

/* backup parts */
.backup-parts { list-style: none; padding: 0; margin: .5rem 0 0; display: flex; flex-direction: column; gap: .5rem; }
.backup-parts form { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }