:root { --ink:#17211d; --muted:#68736e; --line:#d9dfdc; --paper:#f4f3ee; --card:#fff; --accent:#176b52; --accent-dark:#0e503d; --warn:#a15c16; --edited:#fff4c7; --deleted:#f5e5e2; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; }
header { max-width:1180px; margin:auto; padding:34px 26px 22px; display:flex; align-items:flex-end; justify-content:space-between; border-bottom:1px solid var(--line); }
.eyebrow,.step { margin:0 0 4px; color:var(--accent); font-size:11px; font-weight:800; letter-spacing:.18em; }
h1 { margin:0; font:600 34px/1.1 Georgia, serif; } h2 { margin:0; font:600 24px/1.1 Georgia, serif; } h3 { margin:0 0 8px; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.record-meta { display:flex; align-items:center; gap:14px; }
.review-statuses { display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
.other-status { font-size:11px; }
.user-menu { display:flex; align-items:center; gap:8px; padding-left:4px; font-size:12px; color:var(--muted); }
.user-menu form { margin:0; }
.text-button { border:0; padding:3px; background:transparent; color:var(--accent-dark); text-decoration:underline; }
.id-jump-form { display:grid; grid-template-columns:auto minmax(120px,180px) auto; align-items:center; gap:7px; position:relative; }
.id-jump-form label { font-size:12px; color:var(--muted); }
.entry-id { margin:0; padding:7px 11px; border:1px solid var(--line); border-radius:7px; background:#fff; font:600 13px ui-monospace, monospace; }
.entry-id.not-found { border-color:#b84f38; outline:3px solid rgba(184,79,56,.12); }
.id-jump-message { position:absolute; top:100%; right:0; padding-top:4px; color:#9a3f2c; font-size:11px; white-space:nowrap; }
.status { font-size:12px; font-weight:700; }.saved { color:var(--accent); }.unsaved { color:var(--warn); }
main { max-width:1180px; margin:24px auto 110px; padding:0 26px; display:grid; gap:20px; }
.panel { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:24px; box-shadow:0 6px 24px rgba(28,38,33,.04); }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:20px; }
.hint { margin:0; color:var(--muted); font-size:13px; }
label { display:block; font-size:13px; font-weight:750; } label span, th span, summary span { color:var(--muted); font-weight:500; font-family:ui-monospace,monospace; }
textarea,input { width:100%; margin-top:7px; border:1px solid #cbd3cf; border-radius:8px; background:#fcfcfa; color:var(--ink); font:15px/1.55 inherit; padding:12px; resize:vertical; transition:.15s; }
textarea:focus,input:focus { outline:3px solid rgba(23,107,82,.13); border-color:var(--accent); background:#fff; }
textarea.edited,input.edited { background:var(--edited); border-color:#d6b94f; }
textarea.edited:focus,input.edited:focus { background:#fff8dc; }
.translation-grid { display:grid; grid-template-columns:1fr; gap:18px; margin-top:18px; }
.reference-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:18px; }
details { margin-top:20px; border-top:1px solid var(--line); padding-top:14px; } summary { cursor:pointer; font-weight:700; color:#3e4d46; }
.reference-grid p { margin:0; color:#5d6863; font-size:13px; line-height:1.55; }
button { cursor:pointer; border-radius:8px; font:700 13px inherit; }
.secondary { border:1px solid var(--line); padding:9px 13px; background:#fff; color:var(--accent-dark); }
.table-wrap { overflow-x:auto; } table { width:100%; border-collapse:collapse; } th { text-align:left; color:#4c5953; font-size:12px; padding:0 8px 8px; } td { border-top:1px solid #e6eae8; padding:9px 8px; } td input { margin:0; padding:9px 10px; } th:last-child,td:last-child { width:45px; }
.delete { min-width:62px; height:32px; padding:0 9px; border:0; background:#f4e9e6; color:#9a3f2c; font-size:12px; }
tr.deleted td { background:var(--deleted); opacity:.72; }
tr.deleted input { text-decoration:line-through; background:var(--deleted); }
tr.deleted .delete { color:var(--accent-dark); background:#dcebe5; }
.empty { text-align:center; color:var(--muted); padding:18px; }
footer { position:fixed; z-index:5; bottom:0; left:0; right:0; display:flex; align-items:center; justify-content:center; gap:14px; padding:14px 26px; background:rgba(255,255,255,.96); border-top:1px solid var(--line); backdrop-filter:blur(8px); }
.nav-button,.save-button { min-width:110px; padding:11px 16px; }.nav-button { border:1px solid var(--line); background:#fff; }.save-button { border:1px solid var(--accent); background:var(--accent); color:#fff; }.save-button:hover { background:var(--accent-dark); }.nav-button:disabled,button:disabled { opacity:.4; cursor:not-allowed; }
.progress-wrap { width:min(340px,35vw); text-align:center; }.progress-wrap p { margin:0 0 6px; font-size:12px; }.progress-wrap span { color:var(--muted); }.progress { height:4px; border-radius:4px; background:#e1e5e3; overflow:hidden; }.progress div { height:100%; background:var(--accent); transition:width .2s; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-card { width:min(420px,100%); margin:0; padding:34px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 14px 50px rgba(28,38,33,.09); }
.login-card h1 { margin-top:4px; }
.login-intro { margin:12px 0 22px; color:var(--muted); }
.login-form { display:grid; gap:16px; }
.login-form .save-button { margin-top:4px; }
.login-error { padding:10px 12px; border-radius:7px; background:#f7e6e2; color:#8b3524; font-size:13px; }
@media (max-width:720px) { header { align-items:flex-start; gap:16px; flex-direction:column; } .record-meta { width:100%; justify-content:space-between; } .id-jump-form { grid-template-columns:auto minmax(0,1fr) auto; flex:1; } .reference-grid { grid-template-columns:1fr; } .section-heading { align-items:flex-start; } footer { gap:8px; padding:10px; }.progress-wrap { width:auto; flex:1; }.progress-wrap span { display:none; }.nav-button,.save-button { min-width:0; } }
