/* ════════════════════════════════════════════════════════════════════
   check.vinsight.ru — expert marking console.
   Tokens + screen styles from the Claude Design handoff (design/check-console).
   SELF-HOSTED FONTS ONLY. Google Fonts and every CDN are throttled on RU paths —
   the same reason the app pre-compiles Babel. The delivered mock had no @font-face
   at all and fell back to system-ui; these are the real subsets, copied from
   public/vendor/fonts and served same-origin under the vhost's default-src 'self'.
   ════════════════════════════════════════════════════════════════════ */
@font-face { font-family: "Baloo 2"; src: url("fonts/baloo2-var.woff2") format("woff2"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Golos Text"; src: url("fonts/golostext-cyrillic-ext.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Golos Text"; src: url("fonts/golostext-cyrillic.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; src: url("fonts/golostext-latin.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Onest"; src: url("fonts/onest-cyrillic-ext.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Onest"; src: url("fonts/onest-cyrillic.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Onest"; src: url("fonts/onest-latin.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Design tokens (delivered). */
:root, :root[data-theme="light"]{
  --bg:#f3f6f5; --bg-2:#eef2f2; --bg-3:#e2e9e8;
  --ink:#10201d; --ink-2:#4a5a57; --ink-3:#7c8c89; --ink-4:#a7b3b0;
  --rule:#e2e8e7; --rule-2:#d2dcda; --card:#ffffff;
  --accent:#13a292; --accent-ink:#0d7468; --accent-deep:#0a5b52;
  --accent-soft:color-mix(in oklab, var(--accent) 12%, var(--bg));
  --accent-tint:color-mix(in oklab, var(--accent) 8%, var(--card));
  --ok:#1f9d57; --warn:#b87b0a; --no:#d2483f;
  --ok-soft:color-mix(in oklab, var(--ok) 13%, var(--bg));
  --no-soft:color-mix(in oklab, var(--no) 12%, var(--bg));
  --warn-soft:color-mix(in oklab, var(--warn) 14%, var(--bg));
  --k1:#3b6fc4; --k2:#b3720d; --k3:#8a63c9; --k4:#b8547f; --k5:#5c7d33;
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:20px;
  --sans:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:"Onest","Golos Text",system-ui,sans-serif;
  --wordmark:"Baloo 2",var(--display);
  --num:var(--sans);
  --shadow-card:0 1px 2px rgba(16,32,29,.05);
  --shadow-pop:0 2px 6px rgba(16,32,29,.06),0 24px 48px -28px rgba(16,32,29,.28);
}
:root[data-theme="dark"]{
  --bg:#0c1413; --bg-2:#1b2724; --bg-3:#223230;
  --ink:#e8efed; --ink-2:#a9b7b4; --ink-3:#7b8a87; --ink-4:#566763;
  --rule:#24302d; --rule-2:#31403c; --card:#15201d;
  --accent:#2bbfa9; --accent-ink:#59d2bd; --accent-deep:#16857a;
  --accent-soft:color-mix(in oklab, var(--accent) 20%, var(--bg-2));
  --accent-tint:color-mix(in oklab, var(--accent) 13%, var(--card));
  --ok:#34b169; --warn:#e0a02e; --no:#e0604f;
  --ok-soft:color-mix(in oklab, var(--ok) 20%, var(--bg-2));
  --no-soft:color-mix(in oklab, var(--no) 18%, var(--bg-2));
  --warn-soft:color-mix(in oklab, var(--warn) 20%, var(--bg-2));
  --k1:#7ea3e8; --k2:#dba14a; --k3:#b39ae6; --k4:#e08bb0; --k5:#9ab866;
  --shadow-card:0 1px 2px rgba(0,0,0,.3);
  --shadow-pop:0 2px 6px rgba(0,0,0,.35),0 24px 48px -26px rgba(0,0,0,.65);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:400 14px/1.5 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent-ink);text-decoration:none}
a:hover{color:var(--accent-deep);text-decoration:underline}
:root[data-theme="dark"] a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
::selection{background:color-mix(in oklab, var(--accent) 28%, transparent)}
h1,h2,h3{margin:0;font-family:var(--display)}
strong{font-weight:600}
.num{font-variant-numeric:tabular-nums;letter-spacing:.01em}

/* ── topbar ── */
.topbar{display:flex;align-items:center;gap:20px;height:52px;padding:0 20px;background:var(--card);border-bottom:1px solid var(--rule)}
.brand{display:inline-flex;align-items:center;gap:9px}
.brand .mk{font:700 19px var(--wordmark);letter-spacing:-.01em;color:var(--ink)}
.brand .mk b{color:var(--accent);font-weight:700}
.brand .app{font:600 11px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-soft);border:1px solid color-mix(in oklab, var(--accent) 26%, transparent);border-radius:var(--radius-sm);padding:2px 7px}
.topnav{display:flex;gap:4px;margin-left:8px}
.topnav a{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:var(--radius-md);font:600 13.5px var(--sans);color:var(--ink-3);text-decoration:none}
.topnav a:hover{background:var(--bg-2);color:var(--ink);text-decoration:none}
.topnav a.is-on{background:var(--bg-2);color:var(--ink)}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.who{font:600 13px var(--sans);color:var(--ink-2)}
.who span{font-weight:400;color:var(--ink-4);margin-right:7px}
.icon-btn{display:grid;place-items:center;width:32px;height:32px;border-radius:var(--radius-md);color:var(--ink-3);border:1px solid var(--rule-2);background:var(--card)}
.icon-btn:hover{color:var(--ink);background:var(--bg-2)}
.icon-btn svg{width:16px;height:16px}
.linkish{font:600 13px var(--sans);color:var(--ink-3)}
.linkish:hover{color:var(--ink)}

/* ── controls ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:0 18px;border-radius:var(--radius-md);font:600 14px/1 var(--sans);white-space:nowrap;transition:filter .12s ease,background .12s ease}
.btn-primary{background:var(--accent);color:#07120f;font-weight:700}
.btn-primary:hover{filter:brightness(1.05)}
.btn-primary:disabled{opacity:.4;cursor:not-allowed}
.btn-secondary{background:var(--bg-2);color:var(--ink-2);border:1px solid var(--rule-2)}
.btn-secondary:hover{background:var(--bg-3);color:var(--ink)}
.btn-ghost{color:var(--ink-3);min-height:34px;padding:0 12px}
.btn-ghost:hover{background:var(--bg-2);color:var(--ink)}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:600 12.5px var(--sans);color:var(--ink-2)}
.input{height:40px;padding:0 12px;border-radius:var(--radius-md);border:1px solid var(--rule-2);background:var(--card);color:var(--ink);width:100%}
.input::placeholder{color:var(--ink-4)}
.input:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
.input:disabled{background:var(--bg-2);color:var(--ink-4);cursor:not-allowed}
select.input{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 49%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 51%);background-position:right 16px center,right 11px center;background-size:5px 5px;background-repeat:no-repeat}
.seg{display:inline-flex;background:var(--bg-2);border:1px solid var(--rule);border-radius:var(--radius-md);padding:3px;gap:2px}
.seg button{height:30px;padding:0 12px;border-radius:7px;font:600 13px var(--sans);color:var(--ink-3)}
.seg button:hover{color:var(--ink)}
.seg button.is-on{background:var(--card);color:var(--ink);box-shadow:var(--shadow-card)}
.check{display:inline-flex;align-items:center;gap:8px;font:500 13.5px var(--sans);color:var(--ink-2);cursor:pointer;user-select:none}
.check input{appearance:none;width:17px;height:17px;margin:0;border:1.5px solid var(--rule-2);border-radius:5px;background:var(--card);cursor:pointer;display:grid;place-items:center}
.check input:checked{background:var(--accent);border-color:var(--accent)}
.check input:checked::before{content:"";width:9px;height:5px;border:2px solid #07120f;border-top:0;border-right:0;transform:rotate(-45deg) translateY(-1px)}

/* ── chips ── */
.chip{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--radius-sm);font:600 11.5px var(--sans);letter-spacing:.02em;white-space:nowrap}
.chip.exam{background:var(--bg-2);border:1px solid var(--rule-2);color:var(--ink-2)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.ok{background:var(--ok-soft);color:var(--ok)}
.kchip{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:var(--radius-sm);font:700 11px var(--num);color:var(--kc);background:color-mix(in oklab, var(--kc) 13%, transparent)}
.kchip.k1{--kc:var(--k1)}.kchip.k2{--kc:var(--k2)}.kchip.k3{--kc:var(--k3)}.kchip.k4{--kc:var(--k4)}.kchip.k5{--kc:var(--k5)}

/* ── data table ── */
.tbl{width:100%;border-collapse:collapse}
.tbl th{font:600 11.5px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4);text-align:left;padding:8px 12px;border-bottom:1px solid var(--rule-2);white-space:nowrap}
.tbl td{padding:11px 12px;border-bottom:1px solid var(--rule);font-size:13.5px;vertical-align:middle}
.tbl .r{text-align:right}
.mono-id{font:600 13px var(--num);color:var(--ink-2);letter-spacing:.03em;white-space:nowrap}
.tbl-scroll{overflow-x:auto}

/* ── page scaffold ── */
.page{min-height:100vh;display:flex;flex-direction:column}
.page-main{flex:1;width:100%;max-width:1440px;margin:0 auto;padding:22px 24px 80px}
.page-h{display:flex;align-items:baseline;gap:14px;margin:2px 0 16px}
.page-h h1{font:650 20px/1.2 var(--display);letter-spacing:-.01em}
.page-h .sub{font-size:13px;color:var(--ink-3)}

/* ── screen styles, lifted verbatim from the delivered design's per-screen <style> blocks ── */

/* ---- Вход ---- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{width:380px;max-width:100%;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:30px 30px 26px;display:flex;flex-direction:column;gap:18px}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;margin-bottom:2px}
.login-brand .row{display:flex;align-items:center;gap:9px}
.login-brand .mk{font:700 26px var(--wordmark);color:var(--ink)}
.login-brand .mk b{color:var(--accent);font-weight:700}
.login-brand .app{font:600 11px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-soft);border:1px solid color-mix(in oklab, var(--accent) 26%, transparent);border-radius:var(--radius-sm);padding:2px 7px}
.login-brand p{margin:0;font-size:13px;color:var(--ink-3)}
.handle-wrap{position:relative}
.handle-wrap .hash{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ink-4);font-weight:600}
.handle-wrap .input{padding-left:27px}
/* Visibility is driven by the APP, not by the mock's body[data-state] switcher — those rules
   could never fire here and made a real login error invisible. */
.form-msg{display:none;font-size:13px;line-height:1.45;border-radius:var(--radius-md);padding:10px 12px}
.form-msg.is-on{display:block}
.msg-error{background:var(--no-soft);color:var(--no)}
.msg-locked{background:var(--warn-soft);color:var(--warn)}

.login-foot{font-size:12.5px;color:var(--ink-4);text-align:center}
.login-note{margin-top:14px;text-align:center;font-size:12px;color:var(--ink-4)}

/* ---- Очередь ---- */
.claim-note{display:flex;align-items:center;gap:14px;background:var(--warn-soft);border:1px solid color-mix(in oklab, var(--warn) 30%, transparent);border-radius:var(--radius-md);padding:10px 14px;margin-bottom:16px;font-size:13.5px;color:var(--ink-2)}
.claim-note b{color:var(--warn);font-weight:600}
.claim-note .btn{margin-left:auto;min-height:32px;padding:0 14px;font-size:13px}
.q-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.q-toolbar .input{width:auto;height:36px;font-size:13.5px}
.q-toolbar .spacer{flex:1}
.q-count{font-size:13px;color:var(--ink-3)}
.q-card{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card)}
.tbl tbody tr.is-free{cursor:pointer}
.tbl tbody tr.is-free:hover{background:var(--accent-tint)}
.tbl tbody tr.is-free:hover .go{opacity:1}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr.is-locked td{color:var(--ink-4)}
.tbl tbody tr.is-locked .mono-id{color:var(--ink-4)}
.tbl tbody tr.is-mine{background:color-mix(in oklab, var(--warn) 5%, var(--card))}
.t-title{font-weight:500;color:var(--ink);max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.is-locked .t-title{color:var(--ink-4)}
.wc-off{color:var(--warn);font-weight:600}
.wait{color:var(--ink-2)}
.wait.long{color:var(--ink);font-weight:600}
.lockline{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-4);white-space:nowrap}
.lockline svg{width:13px;height:13px;flex:none}
.go{opacity:0;font:600 13px var(--sans);color:var(--accent-ink);white-space:nowrap;transition:opacity .1s ease}
.mine-cell{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.mine-cell .btn{min-height:30px;padding:0 12px;font-size:12.5px}
.q-foot{padding:12px 16px;border-top:1px solid var(--rule);font-size:12.5px;color:var(--ink-4);display:flex;gap:18px;flex-wrap:wrap}
.q-empty{display:none;padding:80px 20px;text-align:center}
.q-empty .big{font:600 17px var(--display);color:var(--ink-2);margin-bottom:8px}
.q-empty p{margin:0;font-size:13.5px;color:var(--ink-4)}


/* ---- Проверка ---- */
html,body{height:100%}
body{overflow:hidden}
.mark-app{height:100vh;display:flex;flex-direction:column}
.workbar{display:flex;align-items:center;gap:14px;padding:9px 20px;background:var(--card);border-bottom:1px solid var(--rule);font-size:13px}
.workbar .back{font:600 13px var(--sans);color:var(--ink-3);text-decoration:none}
.workbar .back:hover{color:var(--ink)}
.workbar .vsep{width:1px;height:18px;background:var(--rule-2)}
.workbar .wid{font:700 14px var(--num);color:var(--ink)}
.claim-t{margin-left:auto;display:inline-flex;align-items:center;gap:7px;color:var(--ink-3)}
.claim-t b{font:600 13px var(--num);color:var(--ink-2)}
.claim-t .dot{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.m-grid{flex:1;min-height:0;display:grid;grid-template-columns:288px minmax(460px,1fr) 348px}
.pane{min-height:0;overflow-y:auto;padding-bottom:76px}
.pane-task{border-right:1px solid var(--rule);padding:18px 20px 76px;background:var(--bg)}
.pane-text{background:var(--card)}
.pane-rail{border-left:1px solid var(--rule);background:var(--bg);display:flex;flex-direction:column;overflow:hidden;padding-bottom:0}
.sect-h{font:700 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);margin:0 0 10px}
.task-block{margin-bottom:22px}
.task-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.stimulus{border:1px solid var(--rule-2);border-radius:var(--radius-md);background:var(--card);padding:12px 14px;font-size:13px;line-height:1.55;color:var(--ink-2)}
.stimulus .en{font-style:italic}
.stimulus .qs{color:var(--ink);font-weight:500}
.task-req{font-size:12.5px;line-height:1.55;color:var(--ink-3);margin:10px 0 0}
.task-req b{color:var(--ink-2);font-weight:600}
.hint-line{font-size:12.5px;line-height:1.5;color:var(--ink-4);border-top:1px solid var(--rule);padding-top:12px}
kbd{font:600 11px var(--num);background:var(--bg-2);border:1px solid var(--rule-2);border-bottom-width:2px;border-radius:5px;padding:1px 5px;color:var(--ink-2)}
/* center */
.text-head{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:12px 34px;background:color-mix(in oklab, var(--card) 88%, transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
.text-head .t{font:650 14px var(--display)}
.wc{margin-left:auto;display:inline-flex;align-items:center;gap:8px;font:500 13px var(--num);color:var(--ink-3)}
.wc b{font-weight:700;color:var(--ink)}
.wc .chip{height:20px}
.essay{max-width:66ch;margin:0 auto;padding:30px 34px 40px;font:400 17.5px/1.85 var(--sans);color:var(--ink);letter-spacing:.004em}
.essay p{margin:0 0 1em}
.essay .sig{margin-bottom:0}
.hl{--kc:var(--ink-3);background:color-mix(in oklab, var(--kc) 12%, transparent);border-bottom:2px solid color-mix(in oklab, var(--kc) 62%, transparent);padding:1px 1px 1.5px;border-radius:2px;color:inherit;cursor:pointer;transition:background .12s ease}
.hl.k1{--kc:var(--k1)}.hl.k2{--kc:var(--k2)}.hl.k3{--kc:var(--k3)}.hl.k4{--kc:var(--k4)}.hl.k5{--kc:var(--k5)}
.hl .hl{box-shadow:0 3.5px 0 0 color-mix(in oklab, var(--kc-outer) 62%, transparent)}
.hl.is-hot{background:color-mix(in oklab, var(--kc) 26%, transparent)}
.fn{font:700 10.5px var(--num);color:var(--kc);margin-left:1px;user-select:none}
.fakesel{display:none}

.selpop{position:absolute;z-index:40;display:none;align-items:center;gap:8px;background:var(--ink);color:var(--bg);border-radius:var(--radius-md);padding:8px 10px;box-shadow:var(--shadow-pop);font:600 12px var(--sans)}
:root[data-theme="dark"] .selpop{background:#26332f;color:var(--ink)}
.selpop .cap{opacity:.65;font-weight:500;margin-right:2px}
.selpop button{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:var(--radius-sm);font:700 12px var(--num);color:#fff;background:var(--kc)}
.selpop button:hover{filter:brightness(1.12)}
.selpop button.pk1{--kc:var(--k1)}.selpop button.pk2{--kc:var(--k2)}.selpop button.pk3{--kc:var(--k3)}.selpop button.pk4{--kc:var(--k4)}.selpop button.pk5{--kc:var(--k5)}
/* rail */
.rail-scroll{flex:1;min-height:0;overflow-y:auto;padding:18px 18px 20px}
.crit{border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--card);padding:12px 13px 11px;margin-bottom:9px}
.crit:focus-within{border-color:color-mix(in oklab, var(--accent) 45%, var(--rule))}
.crit-h{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.crit-h .nm{font:600 13px var(--sans);color:var(--ink);flex:1;min-width:0}
.crit-h .mx{font:500 11.5px var(--num);color:var(--ink-4);white-space:nowrap}
.bands{display:flex;gap:5px}
.band{flex:1;height:32px;border-radius:var(--radius-sm);border:1px solid var(--rule-2);background:var(--card);font:700 13.5px var(--num);color:var(--ink-3)}
.band:hover{background:var(--bg-2);color:var(--ink)}
.band.is-on{background:var(--accent);border-color:var(--accent);color:#07120f}
.crit-note{font-size:12px;line-height:1.45;color:var(--ink-4);margin:8px 0 0;min-height:16px}
.crit.unset .crit-note{color:var(--warn)}
.crit.forced{opacity:.55}
.crit.forced .band{pointer-events:none;background:var(--bg-2);color:var(--ink-4);border-color:var(--rule)}
.crit.forced .band.is-on{background:var(--bg-3);border-color:var(--rule-2);color:var(--ink-2)}
.k1zero{display:none;background:var(--no-soft);border:1px solid color-mix(in oklab, var(--no) 30%, transparent);border-radius:var(--radius-md);padding:11px 13px;font-size:12.5px;line-height:1.5;color:var(--no);margin-bottom:9px}
.rail.k1-zero .k1zero{display:block}
.cmts{margin-top:20px}
.cmt{position:relative;display:flex;gap:10px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--card);padding:11px 30px 11px 12px;margin-bottom:8px;cursor:pointer;transition:border-color .12s ease}
.cmt:hover,.cmt.is-hot{border-color:color-mix(in oklab, var(--kc,var(--accent)) 50%, var(--rule))}
.cmt.k1{--kc:var(--k1)}.cmt.k2{--kc:var(--k2)}.cmt.k3{--kc:var(--k3)}
.cnum{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font:700 11px var(--num);color:#fff;background:var(--kc);margin-top:1px}
.cnum.g{background:var(--bg-3);color:var(--ink-3)}
.cmt-b{min-width:0}
.cmt-h{display:flex;align-items:center;gap:7px;margin-bottom:3px;flex-wrap:wrap}
.cq{font:500 12px var(--num);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.cmt p{margin:0;font-size:13px;line-height:1.5;color:var(--ink-2)}
.cmt p[contenteditable]:focus{outline:none;color:var(--ink)}
.cx{position:absolute;top:7px;right:7px;width:20px;height:20px;border-radius:6px;color:var(--ink-4);font-size:14px;line-height:1;display:grid;place-items:center}
.cx:hover{background:var(--no-soft);color:var(--no)}
.rail-foot{border-top:1px solid var(--rule);background:var(--card);padding:13px 18px 15px}
.total{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}
.total b{font:700 18px var(--num);color:var(--ink)}
.total span{font-size:12.5px;color:var(--ink-3)}
.total .miss{color:var(--warn);font-weight:600}
.rail-foot .btn{width:100%;min-height:42px}
.save-sub{margin:8px 0 0;font-size:12px;line-height:1.45;color:var(--ink-4);text-align:center}
.task-fallback{display:none;margin:14px 34px 0;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--bg);font-size:13px;color:var(--ink-2)}
.task-fallback summary{cursor:pointer;font:600 13px var(--sans);color:var(--ink-2);padding:10px 14px}
.task-fallback .inner{padding:0 14px 12px}
@media (max-width:1360px){.m-grid{grid-template-columns:260px minmax(430px,1fr) 330px}}
@media (max-width:1150px){.m-grid{grid-template-columns:minmax(400px,1fr) 320px}.pane-task{display:none}.task-fallback{display:block}}

/* ---- Сравнение ---- */
.workbar{display:flex;align-items:center;gap:14px;padding:9px 20px;background:var(--card);border-bottom:1px solid var(--rule);font-size:13px}
.workbar .back{font:600 13px var(--sans);color:var(--ink-3);text-decoration:none}
.workbar .back:hover{color:var(--ink)}
.workbar .vsep{width:1px;height:18px;background:var(--rule-2)}
.workbar .wid{font:700 14px var(--num)}
.saved{margin-left:auto;font-size:12.5px;color:var(--ink-3)}
.cmp-grid{display:grid;grid-template-columns:400px minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:1150px){.cmp-grid{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}
.card-h{display:flex;align-items:baseline;gap:10px;padding:14px 18px 0}
.card-h h2{font:650 15px var(--display)}
.card-h .sub{font-size:12.5px;color:var(--ink-4)}
.score-tbl{width:100%;border-collapse:collapse;margin-top:10px}
.score-tbl th{font:600 11px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4);text-align:right;padding:6px 18px 8px 0;border-bottom:1px solid var(--rule)}
.score-tbl th:first-child{text-align:left;padding-left:18px}
.score-tbl td{padding:11px 18px 11px 0;border-bottom:1px solid var(--rule);font-size:13.5px;text-align:right}
.score-tbl td:first-child{text-align:left;padding-left:18px}
.score-tbl tr:last-child td{border-bottom:0}
.score-tbl .cn{display:inline-flex;align-items:center;gap:8px;font-weight:500}
.score-tbl .v{font:600 14px var(--num)}
.score-tbl .v.ai{color:var(--ink-3);font-weight:500}
.score-tbl tfoot td{border-top:1px solid var(--rule-2);border-bottom:0;font-weight:700}
.score-tbl tfoot .v.ai{font-weight:600}
.dchip{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--radius-sm);font:700 12px var(--num)}
.dchip.same{background:var(--bg-2);color:var(--ink-4);font-weight:600}
.dchip.d1{background:var(--warn-soft);color:var(--warn)}
.dchip.d2{background:var(--no-soft);color:var(--no)}
.evid{display:flex;align-items:center;gap:10px;padding:13px 18px;border-top:1px solid var(--rule);font-size:12.5px;color:var(--ink-3)}
.evid svg{width:15px;height:15px;flex:none;color:var(--ink-4)}
.actions{padding:16px 18px;display:flex;flex-direction:column;gap:9px}
.actions .btn{width:100%;min-height:42px}
.act-note{margin:2px 0 0;font-size:12px;line-height:1.5;color:var(--ink-4);text-align:center}
.delta-line{display:flex;align-items:center;gap:9px;margin:0 0 16px;font-size:13.5px;color:var(--ink-2)}
/* paired comments */
.pairs{padding:6px 0 8px}
.pair-head,.pair{display:grid;grid-template-columns:200px 1fr 1fr;gap:0}
.pair-head span{font:600 11px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4);padding:10px 18px 8px;border-bottom:1px solid var(--rule)}
.pair>div{padding:11px 18px;border-bottom:1px solid var(--rule);font-size:13px;line-height:1.5}
.pair:last-child>div{border-bottom:0}
.pair .pq{font:500 12.5px var(--num);color:var(--ink-3);overflow-wrap:break-word}
.pair .pq .w{color:var(--ink-2)}
.pcell{color:var(--ink-2)}
.pcell .kchip{margin-right:7px;vertical-align:1px}
.pcell.none{color:var(--ink-4)}
.pcell.ai-only p,.pcell p{display:inline;margin:0}
.ai-flag{display:inline-block;margin-left:7px;font:600 10.5px var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-4)}
@media (max-width:900px){.pair-head,.pair{grid-template-columns:150px 1fr 1fr}}

/* ---- Расхождения ---- */
.dv-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.dv-toolbar .input{width:auto;height:36px;font-size:13.5px}
.headline{font-size:14.5px;line-height:1.55;color:var(--ink-2);margin:0 0 16px;max-width:72ch}
.headline b{color:var(--ink);font-weight:650}
.headline .kchip{vertical-align:1px}
.card{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}
.card-h{display:flex;align-items:baseline;gap:10px;padding:15px 18px 12px}
.card-h h2{font:650 15px var(--display)}
.card-h .sub{font-size:12.5px;color:var(--ink-4)}
.card-h .leg{margin-left:auto;font:500 11.5px var(--num);color:var(--ink-4)}
/* diverging bars */
.dvg{padding:2px 18px 16px}
.g-head{font:700 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);padding:14px 0 8px;display:flex;align-items:baseline;gap:8px}
.g-head .n{font:500 11px var(--num);letter-spacing:0;text-transform:none}
.dvrow{display:grid;grid-template-columns:236px 1fr 74px 92px;gap:14px;align-items:center;padding:5px 0}
.dvrow .lab{display:flex;align-items:center;gap:8px;font:500 13px var(--sans);color:var(--ink-2);white-space:nowrap;overflow:hidden}
.dvrow .lab span.t{overflow:hidden;text-overflow:ellipsis}
.axis{position:relative;height:20px}
.axis .zero{position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:var(--rule-2)}
.axis .bar{position:absolute;top:3px;height:14px;border-radius:3px;background:color-mix(in oklab, var(--ink-3) 32%, var(--bg-3))}
.axis .bar.hot{background:var(--warn);opacity:.75}
.axis .bar.pos{left:50%}
.axis .bar.neg{right:50%}
.dvrow .mean{font:650 13px var(--num);text-align:right;color:var(--ink-2)}
.dvrow .mean.hot{color:var(--warn)}
.dvrow .share{font:500 12px var(--num);text-align:right;color:var(--ink-4)}
.dvrow.max-row .lab,.dvrow.max-row .mean{color:var(--ink);font-weight:650}
.axis-cap{display:grid;grid-template-columns:236px 1fr 74px 92px;gap:14px;padding:2px 0 6px;border-bottom:1px solid var(--rule);margin-bottom:2px}
.axis-cap .c{position:relative;font:500 11px var(--num);color:var(--ink-4)}
.axis-cap .c .l{position:absolute;right:52%}
.axis-cap .c .r{position:absolute;left:52%}
.axis-cap .h{font:600 10.5px var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-4);text-align:right}
/* worst table */
.tbl tbody tr:hover{background:var(--accent-tint)}
.tbl tbody tr{cursor:pointer}
.tbl tbody tr:last-child td{border-bottom:0}
.dchip{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--radius-sm);font:700 12px var(--num)}
.dchip.d1{background:var(--warn-soft);color:var(--warn)}
.dchip.d2{background:var(--no-soft);color:var(--no)}
.vv{font:600 13px var(--num)}
.vv i{font-style:normal;color:var(--ink-4);font-weight:500}
.foot-note{font-size:12px;color:var(--ink-4);margin:10px 2px 0}
.two-col{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:18px;align-items:start}
@media (max-width:1250px){.two-col{grid-template-columns:1fr}}

/* ---- Протоколы ---- */
.priv{font-size:12.5px;color:var(--ink-4);margin:-8px 0 18px}
.card{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}
.method{display:flex;align-items:center;gap:24px;padding:18px 20px;margin-bottom:18px}
.method .eyebrow{font:700 10.5px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--accent-ink);margin:0 0 6px}
.method h2{font:650 16px var(--display);margin:0 0 6px}
.method p{margin:0;font-size:13px;line-height:1.55;color:var(--ink-3);max-width:62ch}
.method .meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font:500 12px var(--num);color:var(--ink-4)}
.method .meta b{font-weight:600;color:var(--ink-3)}
.method .btn{margin-left:auto;flex:none}
.dl{font:600 13px var(--sans);white-space:nowrap}
.ev{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:var(--radius-sm);font:600 11.5px var(--sans);white-space:nowrap}
.ev.snap{background:var(--accent-soft);color:var(--accent-ink)}
.ev.rec{background:var(--bg-2);border:1px solid var(--rule-2);color:var(--ink-3)}
.sub-id{font-weight:500;color:var(--ink-4);font-size:12px}
.tbl tbody tr:last-child td{border-bottom:0}
.foot-note{font-size:12px;line-height:1.55;color:var(--ink-4);margin:10px 2px 0;max-width:86ch}
.p-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.p-toolbar .input{width:auto;height:36px;font-size:13.5px}

/* ── app-only: states the mock had no need for (loading, empty, inline errors) ── */
.app-msg{margin:18px 0;padding:12px 14px;border-radius:var(--radius-md);font:500 13.5px var(--sans)}
.app-msg.is-error{background:var(--no-soft);color:var(--no)}
.app-msg.is-info{background:var(--bg-2);color:var(--ink-2);border:1px solid var(--rule)}
.app-busy{color:var(--ink-3);font:500 13.5px var(--sans);padding:24px 0}
.is-hidden{display:none !important}
/* The ungraded tail. An over-length work was graded on its first N words only; everything past
   the cut is shown but visibly not-marked, so an expert never marks text the AI never read. */
.cut-tail{opacity:.42;text-decoration:line-through;text-decoration-color:color-mix(in oklab, var(--ink) 30%, transparent)}
.cut-mark{display:block;margin:10px 0;border-top:2px dashed var(--rule-2);font:600 11.5px var(--sans);color:var(--ink-3);padding-top:6px}

/* ── criterion-anchored comments ──
   OFFSETS MUST STAY EXACT. The expert selects a range in the rendered article and the server
   verifies the quote by SEARCHING the stored text, so article.textContent has to equal the
   student's text byte for byte. Anything the console adds — footnote numbers, the cut notice —
   is therefore CSS content, never a text node: a single stray character would shift every
   subsequent offset and silently mis-anchor the comment after it. */
.hl[data-n]::after{content:attr(data-n);font:700 10.5px var(--num);color:var(--kc);margin-left:1px;vertical-align:super;user-select:none}
.essay .cut-tail::before{content:attr(data-cut);display:block;margin:10px 0 6px;padding-top:6px;border-top:2px dashed var(--rule-2);font:600 11.5px var(--sans);color:var(--ink-3);user-select:none}
.ecmt-list{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.ecmt{display:block;border:1px solid var(--rule);border-radius:var(--radius-md);padding:8px 9px;background:var(--bg-2)}
.ecmt-h{display:flex;align-items:center;gap:7px;margin-bottom:5px}
.ecmt-h .q{flex:1;font:500 12px var(--sans);color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ecmt-h .x{color:var(--ink-4);font:600 14px var(--sans);padding:0 4px}
.ecmt-h .x:hover{color:var(--no)}
.ecmt textarea{width:100%;min-height:46px;border:1px solid var(--rule-2);border-radius:var(--radius-sm);background:var(--card);color:var(--ink);padding:6px 8px;font:400 13px var(--sans);resize:vertical}
.ecmt-hint{font:500 12px var(--sans);color:var(--ink-4);margin:6px 0 0}
