/* ═══════════════════════ THE NIGHT DOCKET ═══════════════════════
   PlagLab workspace — a document examiner's instrument panel at night.
   Committed dark, self-contained: these surfaces keep their own canvas in
   both site themes. Semantic colour system —
     vermilion = similarity · violet = AI · green = clean · brass = chrome.
   Loaded last; overrides the older hero/upload styling it replaces. */

:root{
  --ws-ink:#0a0f1c; --ws-ink2:#0d1424; --ws-panel:#111a2e; --ws-panel2:#0e1526;
  --ws-line:rgba(151,173,222,.13); --ws-line2:rgba(151,173,222,.3);
  --ws-txt:#e9edf8; --ws-soft:#9aa7c2; --ws-mut:#5e6b87;
  --ws-brass:#e2b263; --ws-brass-dim:#9a793a;
  --ws-sim:#ff6a4d; --ws-ai:#8f7bff; --ws-ok:#31c690; --ws-warn:#e7b13c;
  --ws-serif:'Fraunces',Georgia,serif;
  --ws-mono:'IBM Plex Mono',ui-monospace,monospace;
  --ws-sans:'Inter',system-ui,sans-serif;
}

/* page canvas — the lab is dark in either theme */
body{ background:var(--ws-ink); }
html[data-theme="light"] body{ background:#0c1220; }

/* ───────────────────────── masthead — the brass plate ─────────────────── */
header.masthead.ws-masthead{
  max-width:1180px; margin:clamp(1.2rem,3vw,2.4rem) auto 0; padding:0 clamp(1rem,3vw,2rem);
  text-align:left; border:none; background:none; animation:ws-rise .7s .05s both;
}
.wsm-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.ws-masthead h1{
  font-family:var(--ws-serif); font-weight:600; letter-spacing:-.015em;
  font-size:clamp(2.4rem,5vw,3.6rem); line-height:1; margin:0;
  background:linear-gradient(105deg,#f4e3bd,var(--ws-brass) 45%,#caa050 70%,#f0d9a8);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.ws-masthead h1 .amp{ color:transparent; }
.wsm-tag{ margin:.45rem 0 0; font:500 .78rem/1 var(--ws-mono); letter-spacing:.34em;
  text-transform:uppercase; color:var(--ws-soft); }
.wsm-data{ display:flex; align-items:flex-end; gap:clamp(1.1rem,2.5vw,2.2rem); flex-wrap:wrap; }
.wsm-datum{ display:flex; flex-direction:column; gap:.3rem; }
.wsm-datum b{ font:600 1.05rem/1 var(--ws-mono); color:var(--ws-txt); }
.wsm-datum small{ font:500 .6rem/1 var(--ws-mono); letter-spacing:.14em;
  text-transform:uppercase; color:var(--ws-mut); }
.wsm-datum.case-no{ font:600 .78rem/1.6 var(--ws-mono); color:var(--ws-brass);
  border:1px solid var(--ws-line2); border-radius:8px; padding:.45rem .7rem;
  background:var(--ws-panel2); letter-spacing:.08em; }
.wsm-rule{ position:relative; height:5px; margin-top:1.1rem; overflow:hidden;
  border-top:1px solid var(--ws-brass-dim); border-bottom:1px solid var(--ws-line2); }
.wsm-rule i{ position:absolute; inset:0; width:38%;
  background:linear-gradient(90deg,transparent,rgba(226,178,99,.5),transparent);
  animation:ws-sweep 1.6s .4s cubic-bezier(.6,.05,.3,1) both; }
@keyframes ws-sweep{ from{ transform:translateX(-120%);} to{ transform:translateX(300%);} }
.wsm-scope{ margin:.85rem 0 0; font:500 .68rem/1.7 var(--ws-mono); letter-spacing:.1em;
  color:var(--ws-mut); text-transform:uppercase; }
.wsm-scope::before{ content:"◆ "; color:var(--ws-brass); }

/* the app view container */
#view-upload{ max-width:1180px; margin:0 auto; padding:clamp(1.4rem,3vw,2.2rem) clamp(1rem,3vw,2rem) 4rem; }

.ws-panel-eyebrow{ font:600 .64rem/1 var(--ws-mono); letter-spacing:.22em;
  text-transform:uppercase; color:var(--ws-brass); margin-bottom:.85rem; }

/* ───────────────────────── intake console ─────────────────────────────── */
.ws-console{ display:grid; grid-template-columns:1.7fr 1fr; gap:1rem; animation:ws-rise .7s .18s both; }
@media(max-width:880px){ .ws-console{ grid-template-columns:1fr; } }

.ws-tray-col,.ws-scope-col{ background:var(--ws-panel); border:1px solid var(--ws-line);
  border-radius:18px; padding:clamp(1.1rem,2.4vw,1.6rem); }

.ws-tray{ position:relative; overflow:hidden; cursor:pointer; text-align:center;
  border:1.5px dashed var(--ws-line2); border-radius:14px;
  padding:clamp(1.8rem,4vw,3rem) 1.4rem; background:var(--ws-panel2);
  transition:border-color .3s,background .3s,transform .3s; }
.ws-tray:hover,.ws-tray:focus-visible,.ws-tray.drag{
  border-color:var(--ws-brass); background:#101a30; transform:translateY(-2px); }
.ws-tray:focus-visible{ outline:2px solid var(--ws-brass); outline-offset:3px; }
.ws-laser{ position:absolute; left:6%; right:6%; top:0; height:1.5px; opacity:0;
  background:linear-gradient(90deg,transparent,var(--ws-sim),transparent); pointer-events:none; }
.ws-tray:hover .ws-laser,.ws-tray.drag .ws-laser{ opacity:.85; animation:ws-scan 1.8s linear infinite; }
@keyframes ws-scan{ 0%{ top:4%; } 50%{ top:92%; } 100%{ top:4%; } }
.ws-up{ width:44px; height:44px; color:var(--ws-brass); opacity:.9; }
.ws-tray-title{ font-family:var(--ws-serif); font-size:clamp(1.5rem,2.8vw,2rem);
  font-weight:600; letter-spacing:-.01em; color:var(--ws-txt); margin-top:.6rem; }
.ws-tray-sub{ color:var(--ws-soft); font-size:.92rem; margin-top:.45rem; }
.ws-browse{ color:var(--ws-brass); font-weight:600; text-decoration:underline dotted; }
.ws-fmts{ display:flex; justify-content:center; align-items:center; gap:.45rem;
  flex-wrap:wrap; margin-top:1.3rem; }
.ws-fmts span{ font:600 .68rem/1 var(--ws-mono); letter-spacing:.06em; color:var(--ws-soft);
  border:1px solid var(--ws-line2); border-radius:6px; padding:.35rem .55rem; }
.ws-fmts i{ font:400 .74rem/1 var(--ws-sans); font-style:normal; color:var(--ws-mut); margin-left:.35rem; }
.ws-tray-foot{ display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; margin-top:1rem; }
.ws-privacy{ font-size:.78rem; color:var(--ws-mut); }

.ws-ghost{ font:600 .82rem/1 var(--ws-sans); color:var(--ws-soft); background:none;
  border:1px solid var(--ws-line2); border-radius:9px; padding:.6rem .95rem; cursor:pointer;
  transition:color .25s,border-color .25s,background .25s; }
.ws-ghost:hover{ color:var(--ws-txt); border-color:var(--ws-brass); background:rgba(226,178,99,.07); }

/* depth switches */
.ws-depth{ display:flex; gap:.8rem; align-items:flex-start; padding:.8rem; margin:0 -0.35rem;
  border-radius:12px; cursor:pointer; transition:background .25s; }
.ws-depth:hover{ background:rgba(151,173,222,.06); }
.ws-depth input{ position:absolute; opacity:0; }
.ws-switch{ flex:none; width:34px; height:19px; margin-top:.15rem; border-radius:999px;
  background:#252f47; border:1px solid var(--ws-line2); position:relative; transition:background .25s; }
.ws-switch::after{ content:""; position:absolute; top:2px; left:2px; width:13px; height:13px;
  border-radius:50%; background:var(--ws-soft); transition:transform .25s,background .25s; }
.ws-depth input:checked + .ws-switch{ background:var(--ws-brass-dim); border-color:var(--ws-brass); }
.ws-depth input:checked + .ws-switch::after{ transform:translateX(15px); background:#ffe9c2; }
.ws-depth input:focus-visible + .ws-switch{ outline:2px solid var(--ws-brass); outline-offset:2px; }
.ws-depth-txt b{ display:block; font-size:.9rem; color:var(--ws-txt); }
.ws-depth-txt small{ display:block; margin-top:.25rem; font-size:.76rem; line-height:1.5; color:var(--ws-mut); }
.ws-src-head{ margin-top:1.4rem; }
.ws-srcs{ display:flex; flex-wrap:wrap; gap:.4rem; }
.ws-srcs span{ font:500 .7rem/1 var(--ws-mono); color:var(--ws-soft);
  background:var(--ws-panel2); border:1px solid var(--ws-line); border-radius:999px; padding:.34rem .6rem; }

/* ───────────────────────── the docket ─────────────────────────────────── */
.ws-docket{ margin-top:clamp(2.2rem,5vw,3.4rem); animation:ws-rise .7s .3s both; }
.ws-docket-head{ display:flex; align-items:flex-end; justify-content:space-between;
  gap:1.2rem; flex-wrap:wrap; margin-bottom:1.1rem; }
.ws-docket-head h2{ font-family:var(--ws-serif); font-weight:600; letter-spacing:-.01em;
  font-size:clamp(1.6rem,3.2vw,2.2rem); color:var(--ws-txt); margin:.1rem 0 0; }
.ws-stats{ display:flex; gap:clamp(1rem,2.4vw,2rem); flex-wrap:wrap; }
.ws-stat{ display:flex; flex-direction:column; gap:.28rem; }
.ws-stat b{ font:600 1.15rem/1 var(--ws-mono); color:var(--ws-txt); }
.ws-stat b.sim{ color:var(--ws-sim); } .ws-stat b.ai{ color:var(--ws-ai); }
.ws-stat small{ font:500 .6rem/1 var(--ws-mono); letter-spacing:.13em;
  text-transform:uppercase; color:var(--ws-mut); }

/* toolbar */
.ws-tools{ display:flex; gap:.7rem; align-items:center; flex-wrap:wrap;
  padding:.75rem; background:var(--ws-panel); border:1px solid var(--ws-line);
  border-radius:14px 14px 0 0; border-bottom:none; }
#wsSearch{ flex:1 1 200px; min-width:0; font:500 .86rem/1 var(--ws-sans); color:var(--ws-txt);
  background:var(--ws-panel2); border:1px solid var(--ws-line2); border-radius:9px;
  padding:.62rem .8rem; }
#wsSearch::placeholder{ color:var(--ws-mut); }
#wsSearch:focus{ outline:none; border-color:var(--ws-brass); }
.ws-filters{ display:flex; gap:.3rem; }
.ws-filters button{ font:600 .74rem/1 var(--ws-sans); color:var(--ws-soft); background:none;
  border:1px solid transparent; border-radius:999px; padding:.5rem .8rem; cursor:pointer;
  transition:color .2s,background .2s,border-color .2s; }
.ws-filters button:hover{ color:var(--ws-txt); }
.ws-filters button.on{ color:var(--ws-txt); background:var(--ws-panel2); border-color:var(--ws-line2); }
#wsSort{ font:600 .78rem/1 var(--ws-sans); color:var(--ws-soft); background:var(--ws-panel2);
  border:1px solid var(--ws-line2); border-radius:9px; padding:.55rem .6rem; cursor:pointer; }

/* ledger rows */
.ws-ledger{ list-style:none; margin:0; padding:0; border:1px solid var(--ws-line);
  border-radius:0 0 14px 14px; overflow:hidden; background:var(--ws-panel2); }
.ws-ledger:first-child,.ws-tools[hidden] + .ws-ledger{ border-radius:14px; }
.ws-row{ display:grid; grid-template-columns:64px minmax(0,2.2fr) minmax(0,1.6fr) 108px auto;
  gap:clamp(.7rem,1.6vw,1.3rem); align-items:center;
  padding:.95rem clamp(.8rem,2vw,1.3rem); border-top:1px solid var(--ws-line);
  background:var(--ws-panel2); transition:background .25s; animation:ws-rise .5s both; }
.ws-row:first-child{ border-top:none; }
.ws-row:hover{ background:#131c31; }

/* twin-bore meter — the signature */
.ws-meter{ position:relative; width:56px; height:56px; }
.ws-meter svg{ width:56px; height:56px; transform:rotate(-90deg); }
.ws-meter .tr{ fill:none; stroke:rgba(151,173,222,.14); stroke-width:3.4; }
.ws-meter .sim{ fill:none; stroke:var(--ws-sim); stroke-width:3.4; stroke-linecap:round;
  transition:stroke-dashoffset 1s cubic-bezier(.25,.8,.3,1); }
.ws-meter .ai{ fill:none; stroke:var(--ws-ai); stroke-width:3.4; stroke-linecap:round;
  transition:stroke-dashoffset 1s .12s cubic-bezier(.25,.8,.3,1); }
.ws-meter b{ position:absolute; inset:0; display:grid; place-items:center;
  font:600 .78rem/1 var(--ws-mono); color:var(--ws-txt); }

.ws-row-doc{ min-width:0; }
.ws-row-doc h3{ font:600 .95rem/1.35 var(--ws-sans); letter-spacing:-.005em; color:var(--ws-txt);
  margin:0; overflow:hidden; text-overflow:ellipsis; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ws-row-doc small{ display:block; margin-top:.3rem; font:500 .68rem/1.5 var(--ws-mono);
  color:var(--ws-mut); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ws-legacy{ color:var(--ws-brass-dim); }

/* score bars */
.ws-row-scores{ display:flex; flex-direction:column; gap:.5rem; min-width:0; }
.ws-bar{ display:grid; grid-template-columns:2.4rem 1fr 2.6rem; gap:.55rem; align-items:center; }
.ws-bar label{ font:600 .58rem/1 var(--ws-mono); letter-spacing:.1em; color:var(--ws-mut); }
.ws-bar .tube{ height:5px; border-radius:999px; background:rgba(151,173,222,.12); overflow:hidden; }
.ws-bar .fill{ display:block; height:100%; border-radius:999px; width:0;
  transition:width 1s cubic-bezier(.25,.8,.3,1); }
.ws-bar.sim .fill{ background:linear-gradient(90deg,#c9502f,var(--ws-sim)); }
.ws-bar.ai .fill{ background:linear-gradient(90deg,#5b4bd4,var(--ws-ai)); }
.ws-bar b{ font:600 .74rem/1 var(--ws-mono); color:var(--ws-soft); text-align:right; }

/* verdict stamp */
.ws-stamp{ justify-self:start; font:700 .62rem/1 var(--ws-mono); letter-spacing:.12em;
  padding:.42rem .6rem; border-radius:6px; border:1.5px solid; transform:rotate(-2deg); }
.ws-stamp.v-clean{ color:var(--ws-ok); border-color:var(--ws-ok); background:rgba(49,198,144,.08); }
.ws-stamp.v-suspicious{ color:var(--ws-warn); border-color:var(--ws-warn); background:rgba(231,177,60,.08); }
.ws-stamp.v-plagiarized{ color:var(--ws-sim); border-color:var(--ws-sim); background:rgba(255,106,77,.09); }

/* actions */
.ws-row-acts{ display:flex; gap:.4rem; }
.ws-act{ font:600 .76rem/1 var(--ws-sans); color:var(--ws-soft); background:none;
  border:1px solid var(--ws-line2); border-radius:8px; padding:.5rem .7rem; cursor:pointer;
  white-space:nowrap; transition:color .2s,border-color .2s,background .2s; }
.ws-act:hover{ color:var(--ws-txt); border-color:var(--ws-brass); background:rgba(226,178,99,.07); }
.ws-act.open{ color:var(--ws-brass); border-color:var(--ws-brass-dim); }
.ws-act.open:hover{ color:#ffe9c2; }
.ws-act.del:hover{ color:#ff8d75; border-color:var(--ws-sim); background:rgba(255,106,77,.08); }
.ws-act.del.confirm{ color:#fff; background:var(--ws-sim); border-color:var(--ws-sim); }
.ws-act[disabled]{ opacity:.5; cursor:wait; }

/* row leaving */
.ws-row.leaving{ animation:ws-leave .4s forwards; }
@keyframes ws-leave{ to{ opacity:0; transform:translateX(26px); max-height:0;
  padding-top:0; padding-bottom:0; } }

/* empty state */
.ws-empty{ text-align:center; padding:3.4rem 1rem; color:var(--ws-soft);
  border:1px solid var(--ws-line); border-radius:14px; background:var(--ws-panel2); }
.ws-empty svg{ width:72px; height:72px; color:var(--ws-brass); }
.ws-empty p{ margin:.9rem 0 0; font-size:.95rem; line-height:1.7; }
.ws-empty b{ font-family:var(--ws-serif); font-weight:600; font-size:1.15rem; color:var(--ws-txt); }

/* toast (gate / errors) */
.ws-toast{ position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(8px);
  z-index:60; background:#182240; color:var(--ws-txt);
  border:1px solid var(--ws-line2); border-left:3px solid var(--ws-brass);
  border-radius:12px; padding:.85rem 1.1rem; font:500 .86rem/1.5 var(--ws-sans);
  box-shadow:0 18px 50px -18px rgba(0,0,0,.7); opacity:0; transition:opacity .3s,transform .3s; }
.ws-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.ws-toast a{ color:var(--ws-brass); font-weight:700; }

/* why strip */
.ws-why{ margin-top:clamp(2.2rem,5vw,3.2rem); border:1px solid var(--ws-line);
  border-radius:16px; background:var(--ws-panel); overflow:hidden; animation:ws-rise .7s .4s both; }
.ws-why summary{ cursor:pointer; list-style:none; padding:1.1rem 1.4rem;
  font:600 .8rem/1 var(--ws-mono); letter-spacing:.16em; text-transform:uppercase;
  color:var(--ws-soft); transition:color .25s; }
.ws-why summary:hover{ color:var(--ws-brass); }
.ws-why summary::before{ content:"▸ "; color:var(--ws-brass); }
.ws-why[open] summary::before{ content:"▾ "; }
.ws-why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--ws-line); border-top:1px solid var(--ws-line); }
@media(max-width:880px){ .ws-why-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .ws-why-grid{ grid-template-columns:1fr; } }
.ws-why-grid > div{ background:var(--ws-panel); padding:1.2rem 1.3rem; }
.ws-why-grid i{ font-style:normal; color:var(--ws-brass); }
.ws-why-grid b{ display:block; margin-top:.5rem; font-size:.92rem; color:var(--ws-txt); }
.ws-why-grid p{ margin:.4rem 0 0; font-size:.8rem; line-height:1.6; color:var(--ws-soft); }
.ws-why .vs-table{ margin:1.2rem; width:calc(100% - 2.4rem); }

/* mobile ledger */
@media(max-width:760px){
  .ws-row{ grid-template-columns:56px minmax(0,1fr); grid-template-areas:
      "meter doc" "scores scores" "stamp stamp" "acts acts"; row-gap:.75rem; }
  .ws-meter{ grid-area:meter; } .ws-row-doc{ grid-area:doc; }
  .ws-row-scores{ grid-area:scores; } .ws-stamp{ grid-area:stamp; }
  .ws-row-acts{ grid-area:acts; flex-wrap:wrap; }
  .wsm-data{ gap:1rem; }
}

@keyframes ws-rise{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }

/* ── remediation target-loop verdict (report view) ── */
.rem-loop{ border-radius:14px; padding:1rem 1.2rem; margin:0 0 1rem;
  border:1.5px solid; font-size:.9rem; }
.rem-loop.ok{ color:var(--ws-ok); border-color:var(--ws-ok);
  background:rgba(49,198,144,.08); }
.rem-loop.warn{ color:var(--ws-warn); border-color:var(--ws-warn);
  background:rgba(231,177,60,.08); }
.rem-loop .rl-head{ display:flex; gap:.8rem; align-items:baseline; flex-wrap:wrap; }
.rem-loop .rl-head b{ font:700 .8rem/1 var(--ws-mono); letter-spacing:.1em; }
.rem-loop .rl-head span{ opacity:.85; }
.rl-passes{ display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.7rem; }
.rl-pass{ font:500 .7rem/1 var(--ws-mono); padding:.35rem .6rem; border-radius:999px;
  border:1px solid currentColor; opacity:.75; }
.rl-pass.ok{ opacity:1; font-weight:700; }
.rl-note{ margin-top:.7rem; font-size:.8rem; opacity:.85; line-height:1.5; }

@media (prefers-reduced-motion:reduce){
  .ws-masthead,.ws-console,.ws-docket,.ws-why,.ws-row{ animation:none; }
  .wsm-rule i{ animation:none; opacity:0; }
  .ws-laser{ display:none; }
  .ws-meter .sim,.ws-meter .ai,.ws-bar .fill{ transition:none; }
}