/* TReev — layout: app header + review tab bar; screening is a three-pane desk (list | article | filters) */
:root{
  --bg:#f3f4f7; --surface:#ffffff; --sunk:#eceef3; --hover:#f5f6fa; --line:#dde1e8; --line-strong:#c3c9d4;
  --fg:#161b26; --muted:#556073; --faint:#8a92a3;
  --accent:#3f4fc2; --accent-ink:#ffffff; --accent-soft:#e7eafa;
  --inc:#18794a; --inc-soft:#dbf1e4; --inc-btn:#d6f2e2;
  --may:#a36307; --may-soft:#fbecd0; --may-btn:#fbe7c4;
  --exc:#c0362c; --exc-soft:#fbe0dc; --exc-btn:#fbdcd8;
  --conf:#7841b8; --conf-soft:#efe5fa;
  --hl-inc:#c8ecd6; --hl-exc:#f8d2cc;
  --shadow:0 1px 2px rgba(18,24,40,.06),0 6px 20px rgba(18,24,40,.08);
  --f-ui:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --f-art:Arial,Helvetica,sans-serif; --art-size:16px;
  --r:7px; --hdr:52px; --foot:40px; --fz:1;
}
/* Light palettes (data-palette on <html>). Dark mode keeps its own neutrals and only takes each palette's accent. */
:root[data-palette="teal"]{--bg:#f1f6f6;--surface:#ffffff;--sunk:#e6eff0;--hover:#f2f8f8;--line:#d4e1e2;--line-strong:#b3c7c9;--fg:#122224;--muted:#4b6264;--faint:#829698;--accent:#0b7480;--accent-ink:#ffffff;--accent-soft:#d9eff0}
:root[data-palette="navy"]{--bg:#f2f4f8;--surface:#ffffff;--sunk:#e7ebf3;--hover:#f4f6fa;--line:#d5dbe7;--line-strong:#b5c0d3;--fg:#0f1f3a;--muted:#4a5a76;--faint:#8390a7;--accent:#1b3a75;--accent-ink:#ffffff;--accent-soft:#dfe6f4}
:root[data-palette="graphite"]{--bg:#f4f4f3;--surface:#ffffff;--sunk:#eaeae8;--hover:#f6f6f4;--line:#dadad7;--line-strong:#bdbdb9;--fg:#1b1b1a;--muted:#585855;--faint:#8e8e89;--accent:#2e3a4b;--accent-ink:#ffffff;--accent-soft:#e2e6ec}
:root[data-palette="paper"]{--bg:#f7f4ee;--surface:#fffdf9;--sunk:#efe9df;--hover:#faf6ef;--line:#e2d9cb;--line-strong:#cbbda8;--fg:#251d14;--muted:#64574a;--faint:#9a8c7c;--accent:#6c4a2c;--accent-ink:#ffffff;--accent-soft:#efe4d6}
:root[data-palette="meadow"]{--bg:#f1f6f1;--surface:#ffffff;--sunk:#e4eee5;--hover:#f3f8f3;--line:#d3e1d5;--line-strong:#b2c8b6;--fg:#132116;--muted:#4b604f;--faint:#829585;--accent:#2d6a43;--accent-ink:#ffffff;--accent-soft:#dbeedf}
:root[data-palette="saffron"]{--bg:#fbf8ec;--surface:#fffef8;--sunk:#f4eed4;--hover:#fdfaef;--line:#e9e0bb;--line-strong:#d6c98f;--fg:#231e0c;--muted:#615a3c;--faint:#978f6c;--accent:#836300;--accent-ink:#ffffff;--accent-soft:#f6ecc0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#10131a; --surface:#181c25; --sunk:#222733; --hover:#1e2330; --line:#2c3341; --line-strong:#434c5d;
  --fg:#e6e9ef; --muted:#a3acbd; --faint:#737d90;
  --accent:#8e9cf3; --accent-ink:#0f1322; --accent-soft:#252c4d;
  --inc:#5cc68f; --inc-soft:#183a29; --inc-btn:#1b3f2d; --may:#e7ae4e; --may-soft:#3c2f15; --may-btn:#45351a; --exc:#f08074; --exc-soft:#43201c; --exc-btn:#4a2420;
  --conf:#bd98f0; --conf-soft:#322449; --hl-inc:#234e37; --hl-exc:#5b2a24; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#10131a; --surface:#181c25; --sunk:#222733; --hover:#1e2330; --line:#2c3341; --line-strong:#434c5d;
  --fg:#e6e9ef; --muted:#a3acbd; --faint:#737d90;
  --accent:#8e9cf3; --accent-ink:#0f1322; --accent-soft:#252c4d;
  --inc:#5cc68f; --inc-soft:#183a29; --inc-btn:#1b3f2d; --may:#e7ae4e; --may-soft:#3c2f15; --may-btn:#45351a; --exc:#f08074; --exc-soft:#43201c; --exc-btn:#4a2420;
  --conf:#bd98f0; --conf-soft:#322449; --hl-inc:#234e37; --hl-exc:#5b2a24; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark}
@media (prefers-color-scheme:dark){
  :root[data-palette="teal"]:not([data-theme="light"]){--accent:#5cc3c9;--accent-soft:#16383b}
  :root[data-palette="navy"]:not([data-theme="light"]){--accent:#8fb0ee;--accent-soft:#1f2f4f}
  :root[data-palette="graphite"]:not([data-theme="light"]){--accent:#b9c3d1;--accent-ink:#14171c;--accent-soft:#2a313b}
  :root[data-palette="paper"]:not([data-theme="light"]){--accent:#d6ae84;--accent-ink:#1d150d;--accent-soft:#3a2d20}
  :root[data-palette="meadow"]:not([data-theme="light"]){--accent:#7fca97;--accent-ink:#0f1d14;--accent-soft:#1c3826}
  :root[data-palette="saffron"]:not([data-theme="light"]){--accent:#e6c35a;--accent-ink:#1f1903;--accent-soft:#3b3313}}
:root[data-theme="dark"][data-palette="teal"]{--accent:#5cc3c9;--accent-soft:#16383b}
:root[data-theme="dark"][data-palette="navy"]{--accent:#8fb0ee;--accent-soft:#1f2f4f}
:root[data-theme="dark"][data-palette="graphite"]{--accent:#b9c3d1;--accent-ink:#14171c;--accent-soft:#2a313b}
:root[data-theme="dark"][data-palette="paper"]{--accent:#d6ae84;--accent-ink:#1d150d;--accent-soft:#3a2d20}
:root[data-theme="dark"][data-palette="meadow"]{--accent:#7fca97;--accent-ink:#0f1d14;--accent-soft:#1c3826}
:root[data-theme="dark"][data-palette="saffron"]{--accent:#e6c35a;--accent-ink:#1f1903;--accent-soft:#3b3313}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--fg);font:calc(14px * var(--fz))/1.5 var(--f-ui)}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1,h2,h3{margin:0;text-wrap:balance;line-height:1.25}
h1{font-size:calc(24px * var(--fz));font-weight:600;letter-spacing:-.01em} h2{font-size:calc(17px * var(--fz));font-weight:600} h3{font-size:calc(15px * var(--fz));font-weight:600}
p{margin:0}
[hidden]{display:none!important}
.muted{color:var(--muted)} .faint{color:var(--faint)} .small{font-size:calc(12.5px * var(--fz))} .mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap} .danger{color:var(--exc)} .err{color:var(--exc);font-size:calc(13px * var(--fz))} .warn{color:var(--may)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .row.end{justify-content:flex-end} .row.between{justify-content:space-between}
.stack{display:flex;flex-direction:column;gap:14px}
.grid2c{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px}
.note{background:var(--accent-soft);border-radius:8px;padding:10px 12px;font-size:calc(13px * var(--fz))}
.pad8{padding:8px}
hr{border:0;border-top:1px solid var(--line);margin:4px 0}

/* buttons & inputs */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--r);padding:7px 13px;cursor:pointer;font-weight:500;white-space:nowrap;line-height:1.3}
.btn:hover{border-color:var(--fg)} .btn:disabled{opacity:.5;cursor:not-allowed}
.btn-p{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)} .btn-p:hover{filter:brightness(1.07);border-color:var(--accent)}
.btn-sm{padding:5px 10px;font-size:calc(13px * var(--fz))} .btn-xs{padding:2px 8px;font-size:calc(12px * var(--fz));border-radius:5px} .btn-block{width:100%}
.btn-danger-f{background:var(--exc);border-color:var(--exc);color:#fff}
.btn-link{border:0;background:none;color:var(--accent);cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:4px}
.iconbtn{border:0;background:none;color:var(--muted);cursor:pointer;padding:5px;border-radius:6px;display:inline-flex;align-items:center}
.iconbtn:hover{background:var(--sunk);color:var(--fg)} .iconbtn.sm{padding:2px}
.btn.iconish{padding:5px 9px;position:relative}
.badge{position:absolute;top:-6px;right:-6px;background:var(--exc);color:#fff;font-size:calc(11px * var(--fz));font-weight:600;border-radius:9px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 5px}
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],select,textarea{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);padding:7px 10px;width:100%;min-width:0}
textarea{resize:vertical;line-height:1.45}
.field{display:flex;flex-direction:column;gap:5px} .field label,.flabel{font-weight:500;font-size:calc(13px * var(--fz))} .hint{font-size:calc(12px * var(--fz));color:var(--faint)}
.check{display:flex;gap:7px;align-items:center;cursor:pointer} .check.sm{font-size:calc(13px * var(--fz));color:var(--muted)}
.fs{border:1px solid var(--line);border-radius:8px;padding:10px 12px 12px;display:flex;flex-direction:column;gap:10px} .fs legend{font-weight:600;font-size:calc(13px * var(--fz));padding:0 4px}
.switch{position:relative;display:inline-block;width:34px;height:20px;flex:none}
.switch input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;z-index:1}
.switch span{position:absolute;inset:0;background:var(--line-strong);border-radius:10px;transition:background .15s}
.switch span::after{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .15s}
.switch input:checked+span{background:var(--accent)} .switch input:checked+span::after{transform:translateX(14px)}
.switch input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px} .switch input:disabled+span{opacity:.55}
.tgl{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer}
kbd{font-family:var(--f-mono);font-size:calc(10.5px * var(--fz));border:1px solid currentColor;border-radius:4px;padding:0 4px;opacity:.6;line-height:15px}
.prog{height:7px;background:var(--sunk);border-radius:4px;overflow:hidden} .prog>i{display:block;height:100%;background:var(--accent);border-radius:4px;width:0;transition:width .3s}
.prog.sm{height:5px;margin-top:5px}
.scroll{overflow-x:auto}
.copyrow{display:flex;gap:8px;margin-top:6px}

/* chips */
.chip{display:inline-flex;align-items:center;gap:4px;font-size:calc(12px * var(--fz));font-weight:600;padding:1px 8px;border-radius:10px;white-space:nowrap;background:var(--sunk);color:var(--muted);vertical-align:middle}
.v-i,.s-inc{background:var(--inc-soft);color:var(--inc)} .v-e,.s-exc{background:var(--exc-soft);color:var(--exc)} .v-m,.s-may{background:var(--may-soft);color:var(--may)}
.s-conf{background:var(--conf-soft);color:var(--conf)} .s-und,.s-part{background:var(--sunk);color:var(--muted)}
.role-owner{background:var(--accent-soft);color:var(--accent)} .role-collaborator{background:var(--conf-soft);color:var(--conf)} .role-reviewer{background:var(--sunk);color:var(--muted)}
.st-active{background:var(--inc-soft);color:var(--inc)} .st-inv{background:var(--may-soft);color:var(--may)}
.lchip{display:inline-flex;align-items:center;gap:5px;font-size:calc(12px * var(--fz));font-weight:500;padding:1px 8px;border-radius:10px;border:1px solid var(--lc);color:var(--fg);background:color-mix(in srgb,var(--lc) 14%,transparent)}
.lchip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lc)}
.ldot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:2px;vertical-align:middle}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;vertical-align:middle} .dot-i{background:var(--inc)} .dot-e{background:var(--exc)}
mark{border-radius:2px;padding:0 1px;color:inherit} mark.hi{background:var(--hl-inc)} mark.he{background:var(--hl-exc)}
.avatar{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;color:#fff;font-size:calc(11px * var(--fz));font-weight:600;flex:none;vertical-align:middle}

/* top bar */
.topbar{position:sticky;top:0;z-index:30;background:var(--surface);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;gap:16px;height:var(--hdr);padding:0 max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))}
.brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:calc(17px * var(--fz));color:var(--fg);letter-spacing:-.01em} .brand:hover{text-decoration:none}
.topbar-mid{flex:1;min-width:0}
.rtitle{display:flex;align-items:center;gap:8px;min-width:0} .rt-text{font-weight:600;font-size:calc(15px * var(--fz));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.userbtn{display:flex;align-items:center;gap:8px;border:0;background:none;cursor:pointer;padding:4px 6px;border-radius:8px} .userbtn:hover{background:var(--sunk)}
@media (max-width:640px){.uname{display:none}}

/* review bar */
.rbar{position:sticky;top:var(--hdr);z-index:25;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:var(--bg);padding:8px max(16px,env(safe-area-inset-right,0px)) 8px max(16px,env(safe-area-inset-left,0px));border-bottom:1px solid var(--line)}
.rtabs{display:flex;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:3px;overflow-x:auto;max-width:100%}
.rtab{padding:5px 12px;border-radius:7px;color:var(--muted);font-weight:500;white-space:nowrap} .rtab:hover{background:var(--sunk);color:var(--fg);text-decoration:none}
.rtab[aria-current="page"]{background:var(--accent-soft);color:var(--accent)}
.rctl{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.blindsw{display:flex;align-items:center;gap:8px;border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--r);padding:4px 10px;font-size:calc(13px * var(--fz));font-weight:500;cursor:pointer} .blindsw.ro{cursor:default}
.save{font-size:calc(12px * var(--fz));color:var(--faint);margin-right:4px} .save.saving,.save.pending{color:var(--may)} .save.error{color:var(--exc)}
@media (max-width:860px){.hide-s{display:none}}

/* pages */
.page{max-width:1180px;margin:0 auto;padding:24px max(16px,env(safe-area-inset-right,0px)) 60px max(16px,env(safe-area-inset-left,0px))}
.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.sect{font-size:calc(13px * var(--fz));letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px;display:flex;gap:8px;align-items:center}
.count{background:var(--sunk);border-radius:9px;padding:0 7px;font-size:calc(12px * var(--fz));letter-spacing:0}
.archived summary{cursor:pointer;list-style:none} .archived summary::-webkit-details-marker{display:none}
.empty{text-align:center;padding:40px 20px;color:var(--muted)} .empty h3{color:var(--fg);margin-bottom:6px}
.center-card{max-width:560px;margin:40px auto;padding:28px;display:flex;flex-direction:column;gap:12px}
.dev{text-align:center;align-items:center} .devicon{width:48px;height:48px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.tablecard{overflow:hidden}
.tbl{border-collapse:collapse;width:100%;font-size:calc(13.5px * var(--fz))}
.tbl th{text-align:left;font-weight:600;color:var(--muted);font-size:calc(12px * var(--fz));padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface)}
.tbl td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.tbl.hover tbody tr{cursor:pointer} .tbl.hover tbody tr:hover{background:var(--hover)}
.tbl .ttl a{font-weight:600;color:var(--fg)} .wrapcell{max-width:240px;overflow-wrap:anywhere}

/* auth */
.auth-wrap{min-height:calc(100vh - var(--foot));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px 16px}
.auth-brand{display:flex;align-items:center;gap:10px;font-size:calc(22px * var(--fz));font-weight:700}
.auth-card{width:min(420px,100%);padding:26px;display:flex;flex-direction:column;gap:14px}
.auth-foot{color:var(--faint);font-size:calc(12.5px * var(--fz))}

/* modal / popover / toast */
#modal{position:fixed;inset:0;z-index:60;background:rgba(10,14,24,.45);display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:max(28px,env(safe-area-inset-top,0px)) 12px 28px}
.mbox{background:var(--surface);border-radius:12px;box-shadow:var(--shadow);width:min(560px,100%);max-width:100%}
.mbox.wide{width:min(980px,100%)}
.mhead{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 0}
.mbody{padding:16px 20px 20px}
.popover{position:fixed;z-index:70;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:70vh;overflow:auto}
.menu{display:flex;flex-direction:column;padding:6px}
.menu button,.menu .mopt{display:flex;align-items:center;gap:8px;border:0;background:none;padding:7px 10px;border-radius:6px;cursor:pointer;text-align:left;width:100%}
.menu button:hover:not(:disabled),.menu .mopt:hover{background:var(--sunk)} .menu button:disabled{opacity:.5;cursor:not-allowed}
.menu-head{display:flex;flex-direction:column;padding:6px 10px 8px;border-bottom:1px solid var(--line);margin-bottom:4px;font-size:calc(13px * var(--fz))}
.menu-sec{font-size:calc(11px * var(--fz));text-transform:uppercase;letter-spacing:.07em;color:var(--faint);padding:8px 10px 2px}
.pform{display:flex;flex-direction:column;gap:8px;padding:12px} .pform.inline{flex-direction:row;padding:6px 4px 2px;border-top:1px solid var(--line);margin-top:4px}
.swatches{display:flex;gap:6px} .swatches label{cursor:pointer} .swatches input{position:absolute;opacity:0} .swatches span{display:block;width:22px;height:22px;border-radius:50%;border:2px solid transparent}
.swatches input:checked+span{border-color:var(--fg)} .swatches input:focus-visible+span{outline:2px solid var(--accent)}
.disp{display:flex;flex-direction:column;gap:12px;padding:14px;font-size:calc(13.5px * var(--fz))} .disp input[type=range]{width:100%}
#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:80;background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:10px;box-shadow:var(--shadow);max-width:min(620px,calc(100% - 32px));display:flex;align-items:center;gap:12px;font-size:calc(13.5px * var(--fz))}
@media (min-width:900px){#toast{left:auto;right:max(20px,env(safe-area-inset-right,0px));top:calc(var(--hdr) + 62px);bottom:auto;transform:none;max-width:440px}}
#toast .toast-body{cursor:default} #toast .btn{background:transparent;color:var(--bg);border-color:currentColor}
.keys{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;align-items:center} .keys kbd{font-size:calc(12px * var(--fz));padding:1px 6px;opacity:.85;justify-self:start}

/* dashboard */
.rmain{padding:16px max(16px,env(safe-area-inset-right,0px)) 40px max(16px,env(safe-area-inset-left,0px))}
.dash{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;max-width:1400px;margin:0 auto}
.dcard{padding:18px 20px;display:flex;flex-direction:column;gap:14px;min-width:0}
.d-info{grid-column:span 5} .d-data{grid-column:span 7} .d-prog{grid-column:span 12} .d-members{grid-column:span 12}
@media (max-width:980px){.d-info,.d-data{grid-column:span 12}}
.dhead{display:flex;justify-content:space-between;align-items:center;gap:10px}
.dhead h2{font-size:calc(14px * var(--fz));text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.rinfo-title{font-size:calc(18px * var(--fz))}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0} .kv dt{color:var(--muted)} .kv dd{margin:0;font-weight:500;overflow-wrap:anywhere} .kv.small{font-size:calc(13px * var(--fz));margin-top:8px}
.drow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.big{font-family:var(--f-mono);font-size:calc(24px * var(--fz));font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dedup{display:grid;grid-template-columns:repeat(4,1fr);gap:8px} .dedup div{background:var(--sunk);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column}
.dedup b{font-family:var(--f-mono);font-size:calc(17px * var(--fz));font-weight:500} .dedup span{font-size:calc(12px * var(--fz));color:var(--muted)}
@media (max-width:520px){.dedup{grid-template-columns:repeat(2,1fr)}}
.sbar{display:flex;height:16px;border-radius:8px;overflow:hidden;background:var(--sunk)} .sbar i{display:block;height:100%}
.sb-inc{background:var(--inc)} .sb-may{background:var(--may)} .sb-exc{background:var(--exc)} .sb-conf{background:var(--conf)} .sb-und{background:var(--line-strong)}
.slegend,.dlegend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:calc(13px * var(--fz))} .slegend div,.dlegend div{display:flex;align-items:center;gap:7px} .slegend b,.dlegend b{font-family:var(--f-mono);font-weight:500;margin-left:4px}
.sw{width:10px;height:10px;border-radius:50%;display:inline-block}
.prow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:20px;margin-top:6px}
@media (max-width:900px){.prow{grid-template-columns:minmax(0,1fr)}}
.minih{font-size:calc(13px * var(--fz));color:var(--muted);font-weight:600;margin:6px 0} .minih.inc{color:var(--inc)} .minih.exc{color:var(--exc)}
.myprog,.teamprog{border:1px solid var(--line);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.donutwrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap} .dlegend{flex-direction:column;gap:8px;flex:1;min-width:150px} .dlegend div{justify-content:flex-start} .dlegend b{margin-left:auto}
.donut .d-num{font:600 22px var(--f-mono);fill:var(--fg)} .donut .d-lab{font:12px var(--f-ui);fill:var(--muted)}
.mystats{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid var(--line);padding-top:12px} .mystats div{display:flex;flex-direction:column} .mystats b{font-size:calc(15px * var(--fz))}
.tm{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)} .tm:last-child{border-bottom:0}
.tm-n{flex:1;min-width:0} .tm-s{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}

/* review data */
.tab-data,.tab-screen{padding-bottom:12px}
.datagrid{display:grid;grid-template-columns:250px minmax(0,1fr) 280px;gap:12px;height:calc(100vh - var(--hdr) - 88px - var(--foot));min-height:520px}
.dleft,.dcenter,.fside,.slist{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.dleft{overflow:auto}
.pane-h{padding:12px 14px;border-bottom:1px solid var(--line)}
.lsec{padding:10px 12px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px} .lsec .btn{margin-top:8px}
.lsec-h{font-size:calc(12px * var(--fz));font-weight:600;color:var(--muted);padding:2px 2px 6px}
.lopt,.fopt{display:flex;align-items:center;gap:8px;padding:5px 4px;border-radius:6px;cursor:pointer;font-size:calc(13.5px * var(--fz));min-width:0}
.lopt:hover,.fopt:hover{background:var(--hover)} .lopt>span:not(.fcount),.fopt>span:not(.fcount){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.fcount{margin-left:auto;font-family:var(--f-mono);font-size:calc(12px * var(--fz));color:var(--muted)}
.xs{border:0;background:none;color:var(--faint);cursor:pointer;padding:2px;display:inline-flex;border-radius:4px} .xs:hover{color:var(--exc);background:var(--sunk)} .xs svg{width:13px;height:13px}
.listbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px}
.lb-r{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.searchbox{display:flex;align-items:center;gap:6px;border:1px solid var(--line-strong);border-radius:var(--r);padding:0 9px;background:var(--surface);color:var(--muted);min-width:0}
.searchbox input{border:0;padding:6px 0;width:min(280px,52vw);background:transparent} .searchbox input:focus{outline:none} .searchbox:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.afilters{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px;align-items:center}
.afchip{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line-strong);background:var(--sunk);border-radius:12px;padding:1px 6px 1px 10px;font-size:calc(12px * var(--fz));cursor:pointer} .afchip svg{width:12px;height:12px}
.dtable{display:flex;flex-direction:column;min-height:0;flex:1;border-top:1px solid var(--line);overflow-x:auto}
.dthead,.drow2{display:grid;grid-template-columns:48px minmax(260px,3fr) 100px minmax(120px,1.2fr) minmax(120px,1.3fr) minmax(130px,1.2fr);min-width:820px}
.dthead{border-bottom:1px solid var(--line);background:var(--surface)}
.dth{border:0;background:none;text-align:left;font-weight:600;font-size:calc(12px * var(--fz));color:var(--muted);padding:9px 10px;cursor:pointer;display:flex;align-items:center;gap:4px} .dth:hover{color:var(--fg)} .dth-n{cursor:default}
.dtbody{flex:1;min-height:0;min-width:820px}
.vlist{position:relative;overflow-y:auto} .vl-rows{position:absolute;inset:0 0 auto 0} .vl-row{position:absolute;left:0;right:0}
.drow2{height:100%;align-items:center;border-bottom:1px solid var(--line);cursor:pointer;font-size:calc(13.5px * var(--fz))} .drow2:hover{background:var(--hover)}
.drow2>span{padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dc-t{white-space:normal!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-weight:500;line-height:1.35}
.dc-n{font-family:var(--f-mono);font-size:calc(12px * var(--fz));color:var(--faint)} .dc-d,.dc-o{font-family:var(--f-mono);font-size:calc(12px * var(--fz))} .dc-a,.dc-j{color:var(--muted)}
.fside{overflow:auto}
.fside-in{display:flex;flex-direction:column}
.fsearch{display:flex;gap:6px;align-items:center;margin:10px 12px;border:1px solid var(--line-strong);border-radius:var(--r);padding:0 9px;color:var(--muted)} .fsearch input{border:0;padding:6px 0;background:transparent} .fsearch input:focus{outline:none}
.fsec{border-top:1px solid var(--line)} .fsec header{display:flex;align-items:center;gap:6px;padding:9px 12px 6px}
.fsec-t{border:0;background:none;font-weight:600;font-size:calc(13.5px * var(--fz));cursor:pointer;padding:0;text-align:left;flex:1}
.fsec-c,.fsec-add{border:0;background:none;color:var(--muted);cursor:pointer;padding:3px;border-radius:5px;display:inline-flex} .fsec-c:hover,.fsec-add:hover{background:var(--sunk);color:var(--fg)}
.fsec-b{padding:0 10px 10px} .fsec.col .fsec-b{display:none} .fsec.col .fsec-c{transform:rotate(-90deg)}
.selall{border:0;background:none;color:var(--accent);font-size:calc(12px * var(--fz));cursor:pointer;padding:2px 4px}
.kw-i{color:var(--fg)} .kw-e{color:var(--fg)}
.pico-k{font-size:calc(11px * var(--fz));text-transform:uppercase;letter-spacing:.07em;color:var(--faint);margin:6px 4px 2px}
.show-m,.show-s{display:none}
@media (max-width:1180px){.datagrid{grid-template-columns:220px minmax(0,1fr)}.fside{position:fixed;right:0;top:calc(var(--hdr) + 50px);bottom:0;width:min(320px,90vw);z-index:40;box-shadow:var(--shadow);transform:translateX(105%);transition:transform .2s;border-radius:10px 0 0 10px}.fside.open{transform:none}.show-m{display:inline-flex}}
@media (max-width:760px){.datagrid{grid-template-columns:minmax(0,1fr);height:auto}.dleft{max-height:none}.dcenter{height:70vh}}

/* screening */
.scrgrid{display:grid;grid-template-columns:330px minmax(0,1fr) 280px;gap:12px;height:calc(100vh - var(--hdr) - 88px - var(--foot));min-height:560px}
.slist .sl-head{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}
.sl-ctl{display:flex;gap:6px} .sl-ctl select{padding:5px 8px;font-size:calc(13px * var(--fz))}
.sl-body{flex:1;min-height:0}
.srow{height:100%;display:flex;gap:8px;padding:10px 12px 10px 8px;border-bottom:1px solid var(--line);cursor:pointer;border-left:3px solid transparent}
.srow:hover{background:var(--hover)} .srow.cur{background:var(--accent-soft);border-left-color:var(--accent)}
.srow-ck{padding-top:2px} .srow-n{font-family:var(--f-mono);font-size:calc(11.5px * var(--fz));color:var(--faint);padding-top:2px;min-width:22px}
.srow-b{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.srow-t{font-weight:600;font-size:calc(13.5px * var(--fz));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow-m{font-size:calc(12px * var(--fz));color:var(--muted);display:flex;gap:6px;align-items:center;font-family:var(--f-mono)} .srow-m .chip{font-family:var(--f-ui);font-size:calc(11px * var(--fz));padding:0 6px}
.srow-a{font-size:calc(12px * var(--fz));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bulkbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:var(--accent-soft);border-bottom:1px solid var(--line);font-size:calc(13px * var(--fz))}
.rankmsg{padding:8px 12px;font-size:calc(12px * var(--fz));color:var(--muted);background:var(--sunk);border-bottom:1px solid var(--line)}
.sdetail{display:flex;flex-direction:column;min-width:0;min-height:0}
.sdetail .listbar{padding:0 0 8px}
.sdetail .afilters{padding:0 0 8px}
.sdet{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.art{flex:1;overflow:auto;padding:20px 26px;font-family:var(--f-art);display:flex;flex-direction:column;gap:10px}
.recmodal .art{padding:20px 22px 12px;max-height:none}
.art-top{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-family:var(--f-ui);font-size:calc(13px * var(--fz))}
.doi{margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:7px;padding:2px 4px 2px 6px;font-size:calc(12.5px * var(--fz));max-width:100%;min-width:0}
.doi a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px;color:var(--fg)} .doi-l{font-weight:700;font-size:calc(11px * var(--fz));color:var(--muted)}
.art-title{font-size:1.3em;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.art-au,.art-j{color:var(--muted);font-size:.9em;display:flex;gap:6px;align-items:flex-start;overflow-wrap:anywhere} .art-au svg,.art-j svg{flex:none;margin-top:3px}
.abs-h{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:12px;margin-top:4px;font-family:var(--f-ui)}
.art-abs{line-height:1.65;overflow-wrap:anywhere;max-width:80ch} .art-abs .lbl{font-size:.85em;letter-spacing:.04em;color:var(--muted)}
.art-labels{display:flex;gap:6px;flex-wrap:wrap}
.others{display:flex;gap:6px;flex-wrap:wrap;align-items:center;border-top:1px dashed var(--line);padding-top:10px;font-family:var(--f-ui)}
.lab{font-size:calc(11px * var(--fz));text-transform:uppercase;letter-spacing:.07em;color:var(--faint);font-weight:600;font-family:var(--f-ui)}
.mynote{font-size:calc(13px * var(--fz));color:var(--muted);font-family:var(--f-ui);display:flex;gap:6px;align-items:center}
.resolve{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-family:var(--f-ui)}
.dec-i-s{color:var(--inc);border-color:var(--inc)} .dec-e-s{color:var(--exc);border-color:var(--exc)}
.dbar{border-top:1px solid var(--line);padding:12px 14px;display:flex;flex-direction:column;gap:10px;background:var(--surface);border-radius:0 0 10px 10px}
.dbar-main{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
@media (max-width:700px){.dbar-main{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dbtn{display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:9px 8px;cursor:pointer;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.dbtn kbd{margin-left:2px}
.d-i{background:var(--inc-btn);border-color:transparent;color:var(--inc)} .d-m{background:var(--may-btn);border-color:transparent;color:var(--may)} .d-e{background:var(--exc-btn);border-color:transparent;color:var(--exc)}
.d-i:hover,.d-i.on{background:var(--inc);color:#fff} .d-m:hover,.d-m.on{background:var(--may);color:#fff} .d-e:hover,.d-e.on{background:var(--exc);color:#fff}
.d-r.on{border-color:var(--exc);color:var(--exc)} .dbtn:hover{border-color:var(--fg)}
.notebar{display:flex;gap:8px;align-items:center} .notebar input{flex:1}
@media (max-width:1180px){.scrgrid{grid-template-columns:300px minmax(0,1fr)}}
@media (max-width:820px){.scrgrid{grid-template-columns:minmax(0,1fr);height:auto}.sdet{min-height:70vh;overflow:visible}.sdet .art{overflow:visible}.sdet .dbar{position:sticky;bottom:0;z-index:5;box-shadow:0 -6px 16px rgba(0,0,0,.06)}.slist{position:fixed;left:0;top:calc(var(--hdr) + 50px);bottom:0;width:min(340px,92vw);z-index:40;transform:translateX(-105%);transition:transform .2s;box-shadow:var(--shadow);border-radius:0 10px 10px 0}.slist.open{transform:none}.show-s{display:inline-flex}}

/* modals content */
.drop{display:flex;flex-direction:column;align-items:center;gap:6px;border:1.5px dashed var(--line-strong);border-radius:10px;padding:26px;text-align:center;cursor:pointer;color:var(--muted)} .drop b{color:var(--fg)}
.drop.over{border-color:var(--accent);background:var(--accent-soft)} .drop.sm{padding:16px}
.fmts{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:6px} .fmts span{font-family:var(--f-mono);font-size:calc(11px * var(--fz));border:1px solid var(--line);border-radius:4px;padding:1px 6px}
.mapgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.maprow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:10px;align-items:center}
.maprow3{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,minmax(0,1fr));gap:8px;align-items:end} .maprow3 label{display:flex;flex-direction:column;gap:2px}
@media (max-width:640px){.maprow3{grid-template-columns:1fr 1fr}}
.dupg{padding:12px} .dupg-h{display:flex;gap:10px;align-items:center;margin-bottom:8px} .dupg-h .btn{margin-left:auto}
.duptbl th{width:90px;vertical-align:top;background:transparent} .duptbl td{vertical-align:top;font-size:calc(13px * var(--fz));min-width:200px;overflow-wrap:anywhere}
.pager{display:flex;gap:10px;align-items:center;justify-content:center;padding:10px}
.setgrid{display:grid;grid-template-columns:190px minmax(0,1fr);gap:20px}
@media (max-width:700px){.setgrid{grid-template-columns:minmax(0,1fr)}}
.setnav{display:flex;flex-direction:column;gap:2px} .setnav button{border:0;background:none;text-align:left;padding:7px 10px;border-radius:7px;cursor:pointer;color:var(--muted);font-weight:500}
.setnav button:hover{background:var(--sunk);color:var(--fg)} .setnav button.on{background:var(--accent-soft);color:var(--accent)}
@media (max-width:700px){.setnav{flex-direction:row;flex-wrap:wrap}}
.labrow{display:flex;gap:8px;align-items:center} .labrow input[type=color]{width:36px;height:34px;padding:2px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface)}
.crit{white-space:pre-wrap;font-size:calc(13.5px * var(--fz));background:var(--sunk);border-radius:8px;padding:10px 12px}

/* chat */
.chat{position:fixed;right:0;top:var(--hdr);bottom:0;width:min(380px,100vw);z-index:50;background:var(--surface);border-left:1px solid var(--line);box-shadow:var(--shadow);display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom,0px)}
.chat-h{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.chat-list{flex:1;overflow:auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.chat-day{text-align:center;font-size:calc(11.5px * var(--fz));color:var(--faint);margin:6px 0}
.msg{display:flex;gap:8px;align-items:flex-start} .msg.mine{justify-content:flex-end}
.msg-b{max-width:80%;background:var(--sunk);border-radius:10px;padding:7px 10px} .msg.mine .msg-b{background:var(--accent-soft)}
.msg-h{display:flex;gap:8px;font-size:calc(12px * var(--fz));align-items:baseline} .msg-t{white-space:pre-wrap;overflow-wrap:anywhere}
.chat-f{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);align-items:flex-end}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* appearance picker */
.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.theme-card{border:1.5px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;background:var(--surface);display:flex;flex-direction:column;align-items:stretch;gap:8px;text-align:left;width:100%}
.theme-card:hover{border-color:var(--line-strong)} .theme-card[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.theme-prev{height:58px;width:100%;align-self:stretch;border-radius:7px;border:1px solid rgba(0,0,0,.08);display:grid;grid-template-columns:28% 1fr;overflow:hidden}
.theme-prev i{display:block} .theme-prev .tp-main{display:flex;flex-direction:column;gap:5px;padding:8px}
.theme-prev .tp-main span{height:6px;border-radius:3px;display:block}
.theme-name{font-weight:600;font-size:calc(13.5px * var(--fz))} .theme-desc{font-size:calc(12px * var(--fz));color:var(--muted)}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden} .seg button{border:0;background:var(--surface);padding:6px 14px;cursor:pointer;font-weight:500}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)} .seg button+button{border-left:1px solid var(--line-strong)}

/* PRISMA dialog */
.prgrid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:20px;align-items:start}
.prform{max-height:72vh;overflow:auto;padding-right:6px}
.prprev{display:flex;flex-direction:column;gap:10px;position:sticky;top:0}
.prcanvas{padding:8px;background:#fff;max-height:64vh;overflow:auto}
@media (max-width:760px){.prgrid{grid-template-columns:minmax(0,1fr)}.prform{max-height:none}}

/* footer credit line */
.site-foot{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 8px;min-height:var(--foot);padding:8px max(16px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));font-size:calc(12.5px * var(--fz));color:var(--muted);border-top:1px solid var(--line);background:var(--bg)}
.site-foot a{color:var(--accent);font-weight:500}
.site-foot .sep{color:var(--faint)}
.site-foot .bmc{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line-strong);border-radius:14px;padding:2px 10px;color:var(--fg);background:var(--surface)}
.site-foot .bmc:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}

/* screening list: decision, reason and labels under each article */
.srow-c{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px;overflow:hidden;max-height:22px}
.srow-c .chip,.srow-c .lchip{font-size:calc(11.5px * var(--fz));padding:0 7px;line-height:18px}
.srow-c .chip svg{width:11px;height:11px}
.srow.decided .srow-t{color:var(--muted)}
