:root{
  --bg:#ffffff; --panel:#ffffff; --panel2:#f4f4f5; --line:#e4e4e7;
  --txt:#18181b; --muted:#71717a; --accent:#18181b; --accent2:#3f3f46;
  --ok:#18181b; --warn:#52525b; --bad:#27272a; --info:#3f3f46;
  --radius:10px; --shadow:0 4px 18px rgba(0,0,0,.08);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font-size:14px;line-height:1.5}
a{color:inherit;text-decoration:none}
h1{font-size:22px;margin:0 0 4px}
h2{font-size:16px}
.muted{color:var(--muted)}

/* ---------- login ---------- */
.login-page{display:grid;place-items:center;min-height:100vh;padding:24px;position:relative;
  background:radial-gradient(1100px 620px at 50% -8%, #212836, #0f1218 60%)}
.login-page::before{content:'';position:absolute;inset:0;
  background:radial-gradient(700px 380px at 50% 0%, rgba(255,255,255,.06), transparent 70%)}
.login-brand{text-align:center;font-size:22px;font-weight:800;letter-spacing:-.4px;margin:0 0 6px}
.login-card{position:relative;z-index:1;background:#fff;padding:36px 32px;border:1px solid rgba(0,0,0,.06);
  border-radius:16px;width:360px;max-width:100%;box-shadow:0 24px 70px rgba(0,0,0,.4)}
.login-logo{display:block;max-width:180px;max-height:60px;width:auto;height:auto;margin:0 auto 18px;filter:invert(1)}
.login-welcome{font-size:26px;letter-spacing:.3px;text-align:center;margin:0 0 4px}
.login-sub{text-align:center;font-size:13px;margin:0 0 22px}
.login-foot{text-align:center;font-size:11px;color:var(--muted);letter-spacing:.4px;margin:22px 0 0}
.login-card label{display:block;margin:14px 0 0;font-size:12px;color:var(--muted)}
.login-card input{width:100%;margin-top:6px;padding:11px 12px;background:#fff;
  border:1px solid var(--line);border-radius:8px;color:var(--txt)}
.login-card input:focus{outline:none;border-color:var(--accent)}
.login-card button{margin-top:20px;width:100%;padding:12px;border:0;border-radius:8px;
  background:var(--accent);color:#fff;font-weight:600;cursor:pointer}
.login-card button:hover{background:#000}
.alert{background:#f4f4f5;border:1px solid var(--line);color:var(--txt);
  padding:9px 12px;border-radius:8px;margin-top:14px;font-size:13px}

/* ---------- topbar ---------- */
.topbar{display:flex;align-items:center;gap:24px;padding:0 20px;height:58px;
  background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.brand{font-weight:800;letter-spacing:.5px}
.brand span{color:var(--muted);font-weight:600;margin-left:6px;font-size:11px;
  letter-spacing:2px;text-transform:uppercase}
.phases{display:flex;gap:8px;margin-left:auto}
.loggedin{margin-left:auto;font-size:13px;color:var(--muted)}
.loggedin b{color:var(--txt);font-weight:600}
.phase{font-size:12px;padding:6px 12px;border-radius:20px;border:1px solid var(--line);color:var(--muted)}
.phase.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.phase.locked{opacity:.6}
.user{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:13px}
.badge{font-size:10px;text-transform:uppercase;letter-spacing:1px;padding:3px 8px;border-radius:6px;
  border:1px solid var(--line);color:var(--muted)}
.badge.admin{background:var(--accent);color:#fff;border-color:var(--accent)}
.badge.client{background:#f4f4f5;color:var(--txt)}
.logout{color:var(--muted);border:1px solid var(--line);padding:5px 10px;border-radius:7px}
.logout:hover{color:var(--txt);border-color:var(--accent)}

/* ---------- layout ---------- */
.layout{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:calc(100vh - 58px)}
.sidebar{background:#fafafa;border-right:1px solid var(--line);padding:14px 10px;
  position:sticky;top:58px;height:calc(100vh - 58px);
  display:flex;flex-direction:column}
.nav-scroll{flex:1;overflow:auto}
.logout-bottom{margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;
  color:var(--muted);font-size:13px;display:flex;align-items:center;gap:9px}
.logout-bottom .ic{display:inline-flex;width:18px;height:18px;flex:0 0 auto}
.logout-bottom .ic svg{width:16px;height:16px}
.logout-bottom:hover{color:var(--txt);border-color:var(--accent);background:#fff}
.nav-label{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--txt);font-weight:700;
  margin:16px 10px 6px}
.nav-item{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;color:var(--muted)}
.nav-item:hover{background:#fff;color:var(--txt)}
.nav-item.active{background:#fff;color:var(--txt);box-shadow:inset 2px 0 0 var(--accent)}
.nav-item .ic{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex:0 0 auto;opacity:.8}
.nav-item .ic svg{width:16px;height:16px}
.nav-item.active .ic{opacity:1}
.nav-admin{border-top:1px solid var(--line);padding-top:8px;margin-top:6px}
.nav-name{flex:1;font-size:13px}
.nav-pct{font-size:11px;color:var(--muted)}
.nav-pct.partial{color:var(--txt)} .nav-pct.done{color:var(--txt);font-weight:700}
.content{padding:26px 30px;max-width:1100px;min-width:0}
.content.wide{max-width:none}
.page-head{margin-bottom:20px}
.section-title{margin:28px 0 12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:12px}

/* ---------- overall ---------- */
.overall{display:flex;align-items:center;gap:30px;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px}
.overall-ring{--pct:0;position:relative;width:120px;height:120px;border-radius:50%;
  display:grid;place-items:center;flex:0 0 auto;
  background:conic-gradient(var(--accent) calc(var(--pct)*1%),var(--panel2) 0)}
.overall-ring::after{content:"";position:absolute;width:92px;height:92px;border-radius:50%;
  background:var(--panel);z-index:0}
.overall-ring span{position:relative;z-index:1;font-size:24px;font-weight:800;color:var(--txt)}
.overall-stats{display:flex;gap:26px;flex-wrap:wrap}
.stat{display:flex;flex-direction:column}
.stat b{font-size:24px} .stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;transition:.15s}
.card:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)}
.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.card-name{font-weight:600} .card-pct{color:var(--txt);font-weight:700}
.card-sub{font-size:12px;color:var(--muted);margin-top:8px}
.bar{height:7px;background:var(--panel2);border-radius:20px;overflow:hidden}
.bar.small{height:6px;width:120px}
.bar i{display:block;height:100%;background:var(--accent);border-radius:20px}

/* ---------- activity / tables ---------- */
.activity{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.act-row{display:flex;gap:14px;padding:11px 16px;border-bottom:1px solid var(--line);font-size:13px}
.act-row:last-child{border-bottom:0}
.act-when{color:var(--muted);width:80px} .act-who{color:var(--txt);font-weight:600;width:140px}
.act-what{color:var(--muted)}
.grid{width:100%;border-collapse:collapse;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.grid th,.grid td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px}
.grid th{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px;background:#fafafa}
.grid tr:last-child td{border-bottom:0}
.grid .old{color:var(--muted)} .grid .new{color:var(--txt)}
.tag{font-size:11px;background:#fafafa;border:1px solid var(--line);padding:2px 8px;border-radius:6px;color:var(--muted)}
.notice{background:#fafafa;border:1px solid var(--line);color:var(--txt);
  padding:13px 16px;border-radius:10px;margin-bottom:18px;font-size:13px}
.notice.mini{padding:9px 12px;margin:8px 0 0;font-size:12px;border-left:3px solid var(--accent)}

/* planning (Gantt) */
.plan-actions{display:flex;gap:8px}
.gantt-wrap{margin-top:4px}
.gantt{display:flex;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
.g-side{flex:0 0 300px;border-right:2px solid var(--line);background:#fafafa;overflow-y:auto;scrollbar-width:none}
.g-side::-webkit-scrollbar{display:none}
.g-scroll{flex:1;min-width:0;overflow:auto;position:relative}
.g-tl{position:relative}
.g-corner{position:sticky;top:0;z-index:6;background:#fafafa;height:46px;display:flex;align-items:flex-end;padding:0 12px 8px;
  font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:700;border-bottom:1px solid var(--line)}
.g-head{position:sticky;top:0;z-index:5;background:var(--panel);height:46px;border-bottom:1px solid var(--line)}
.g-months{display:flex;height:22px}
.g-month{font-size:11px;color:var(--muted);font-weight:600;border-right:1px solid var(--line);padding-left:6px;line-height:22px;overflow:hidden;white-space:nowrap;box-sizing:border-box}
.g-days{display:flex;height:24px}
.g-day{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid #eee;line-height:1.05;box-sizing:border-box}
.g-day b{font-size:11px;font-weight:600} .g-day i{font-size:9px;color:var(--muted);font-style:normal}
.g-day.we{background:#f4f4f5}
.g-grow{height:38px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 8px 0 10px;
  font-weight:700;font-size:13px;border-bottom:1px solid var(--line);background:#f1f1f3;cursor:pointer}
.g-grow:hover{background:#ebebee}
.g-ghead{display:flex;align-items:center;gap:7px;overflow:hidden;flex:1;min-width:0}
.g-toggle{flex:0 0 auto;width:12px;color:var(--muted);font-size:11px;transition:transform .15s;display:inline-block}
.g-toggle.open{transform:rotate(90deg)}
.g-gname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g-gcount{flex:0 0 auto;font-size:10px;font-weight:700;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:20px;padding:0 7px}
.g-gsum{display:flex;gap:3px;flex:0 0 auto;margin-right:4px}
.g-scount{display:inline-flex;align-items:center;justify-content:center;min-width:18px;font-size:10px;font-weight:700;border-radius:10px;padding:1px 6px}
.g-scount.s-not_started{background:#f3f4f6;color:#6b7280}
.g-scount.s-in_progress{background:#e7f0ff;color:#1d4ed8}
.g-scount.s-done{background:#e6f7ee;color:#15803d}
.g-scount.s-blocked{background:#fde8e8;color:#b91c1c}
.g-gact{display:flex;gap:4px;flex:0 0 auto}
.g-gact button{width:22px;height:22px;border:1px solid var(--line);background:#fff;border-radius:6px;cursor:pointer;color:var(--muted);font-size:12px;line-height:1}
.g-addtask:hover{border-color:var(--accent);color:var(--txt)} .g-delgrp:hover{border-color:#dc2626;color:#dc2626}
.g-band{height:38px;border-bottom:1px solid var(--line);background:#f1f1f3;position:relative}
.g-roll{position:absolute;top:8px;height:22px;border-radius:6px;display:flex;align-items:center;padding:0 9px;
  font-size:10.5px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.25);opacity:.92}
.g-trow{height:34px;display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:1px solid var(--line);cursor:pointer}
.g-trow:hover{background:#fff}
.g-tname{flex:1;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g-track{height:34px;border-bottom:1px solid var(--line);position:relative;
  background-image:repeating-linear-gradient(90deg,transparent 0,transparent 27px,#f0f0f0 27px,#f0f0f0 28px)}
.g-bar{position:absolute;top:6px;height:22px;border-radius:6px;display:flex;align-items:center;gap:6px;padding:0 8px;
  font-size:11px;color:#fff;white-space:nowrap;overflow:hidden;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.g-bartag{font-weight:700;background:rgba(255,255,255,.25);border-radius:4px;padding:0 5px;font-size:10px}
.gb-not_started{background:#9ca3af} .gb-in_progress{background:#2563eb} .gb-done{background:#16a34a} .gb-blocked{background:#dc2626}
.g-today,.g-pline{position:absolute;top:46px;bottom:0;width:2px;z-index:3}
.g-today{background:#dc2626} .g-pstart{background:#16a34a} .g-pend{background:#7c3aed} .g-mile{background:#ea580c}
.g-today span,.g-pline span{position:absolute;top:0;left:2px;font-size:9px;font-weight:700;white-space:nowrap;
  padding:1px 5px;border-radius:0 4px 4px 0;color:#fff}
.g-today span{background:#dc2626} .g-pstart span{background:#16a34a} .g-pend span{background:#7c3aed} .g-mile span{background:#ea580c}
.mt-row2{display:flex;gap:12px} .mt-row2 label{flex:1}
/* plan window banner */
.plan-meta{display:flex;align-items:center;gap:18px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:12px 18px;margin-bottom:14px;flex-wrap:wrap}
.pm-item{display:flex;flex-direction:column}
.pm-item span{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.pm-item b{font-size:15px}
.pm-sep{color:var(--muted)}
.pm-spacer{flex:1}
.pm-divider{width:1px;height:30px;background:var(--line)}
.pm-miles{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pm-mile{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#92400e;
  background:#fff7ed;border:1px solid #fed7aa;border-radius:20px;padding:5px 11px;cursor:pointer}
.pm-mile:hover{border-color:#fb923c}
.pm-mile .pm-dia{color:#ea580c}
.pm-mile.add{color:var(--muted);background:#fff;border:1px dashed var(--line)}
.pm-mile.add:hover{border-color:var(--accent);color:var(--txt)}

/* ===== Validation module ===== */
/* client dashboard banner */
.vbanner{background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;padding:12px 16px;margin-bottom:16px}
.vb-head{font-size:13px;color:#9a3412;margin-bottom:8px}
.vb-list{display:flex;flex-direction:column;gap:6px}
.vb-item{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #fde3c4;border-radius:8px;padding:8px 12px;text-decoration:none;color:var(--txt)}
.vb-item:hover{border-color:#fb923c}
.vb-title{font-weight:600;font-size:13px}
.vb-meta{font-size:12px;color:var(--muted);flex:1}
.vb-go{font-size:12px;font-weight:600;color:#ea580c}
.vb-late{color:#dc2626;font-weight:600}.vb-left{color:#16a34a;font-weight:600}
/* status badges */
.vst{font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap}
.vst-pending{background:#e7f0ff;color:#1d4ed8}
.vst-resubmitted{background:#eef2ff;color:#4f46e5}
.vst-changes_requested{background:#fff4e0;color:#b45309}
.vst-approved{background:#e6f7ee;color:#15803d}
.vst-overdue{background:#fde8e8;color:#b91c1c}
/* list table */
.vtable-wrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.vtable{width:100%;border-collapse:collapse;font-size:13px}
.vtable th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);background:#fafafa}
.vtable td{padding:11px 12px;border-bottom:1px solid var(--line)}
.vtable tbody tr{cursor:pointer}
.vtable tbody tr:last-child td{border-bottom:0}
.vtable tbody tr:hover{background:#fafafa}
.vt-title{font-weight:600}.vt-late{color:#dc2626;font-weight:600}
/* review header */
.vr-top{display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:12px}
.vr-back{font-size:13px;color:var(--muted);text-decoration:none;padding-top:6px}
.vr-back:hover{color:var(--txt)}
.vr-titleblock{flex:1;min-width:240px}
.vr-titleblock h1{margin:0 0 4px}
.vr-meta{font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.vr-desc{margin:8px 0 0;font-size:13px}
.vr-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.vr-versions{display:flex;gap:5px}
.vr-actbtns{display:flex;gap:8px}
.vr-vchip{font-size:12px;font-weight:600;border:1px solid var(--line);border-radius:7px;padding:4px 9px;text-decoration:none;color:var(--muted);background:#fff}
.vr-vchip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
/* stage */
.vr-stage{display:flex;gap:14px;height:calc(100vh - 250px);min-height:420px}
.vr-stage.no-panel .vr-panel{display:none}
.vr-canvas{flex:1;min-width:0;position:relative;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#f4f4f5;display:flex;flex-direction:column}
.vr-toolbar{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#fff;border-bottom:1px solid var(--line);font-size:12px}
.vr-toolbar button{border:1px solid var(--line);background:#fff;border-radius:6px;min-width:30px;height:28px;cursor:pointer;font-size:14px;padding:0 8px}
.vr-toolbar button:hover{border-color:var(--accent)}
.vz-level{font-size:11px;color:var(--muted);min-width:42px;text-align:center}
.vr-hint{font-size:11px;color:var(--muted)}
#vr-toggle-panel{font-size:11px}
.vr-viewport{flex:1;position:relative;overflow:hidden;cursor:grab}
.vr-viewport.grabbing{cursor:grabbing}
.vr-pan{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform}
#vr-img{display:block;user-select:none;-webkit-user-drag:none}
.vr-pins{position:absolute;top:0;left:0}
.vpin{position:absolute;transform:translate(-50%,-50%) scale(var(--vs,1));transform-origin:center;
  width:24px;height:24px;border-radius:50% 50% 50% 3px;background:#e11d48;color:#fff;border:2px solid #fff;
  font-size:11px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 1px 4px rgba(0,0,0,.35);padding:0;line-height:1}
.vpin.adm{background:#2563eb}
.vpin.draft{background:#111;opacity:.85}
.vpin.hl{outline:3px solid rgba(225,29,72,.45)}
/* comments panel */
.vr-panel{flex:0 0 340px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;display:flex;flex-direction:column;overflow:hidden}
.vr-panel-head{padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;display:flex;align-items:center;gap:8px}
.vr-count{background:var(--accent);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:1px 8px}
.vr-comments{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px}
.vc{border:1px solid var(--line);border-radius:9px;padding:9px 11px;cursor:pointer;background:#fff}
.vc:hover{border-color:#cbd5e1}
.vc.hl{border-color:#e11d48;box-shadow:0 0 0 2px rgba(225,29,72,.15)}
.vc-head{display:flex;align-items:center;gap:6px;font-size:12px;margin-bottom:5px}
.vc-num{background:#e11d48;color:#fff;font-size:10px;font-weight:700;border-radius:50%;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.vc-date{color:var(--muted);font-size:11px;margin-left:auto}
.vc-dl{background:#dbeafe;color:#1d4ed8;font-size:9px;font-weight:700;padding:1px 5px;border-radius:4px}
.vc-body{font-size:13px;white-space:pre-wrap;word-break:break-word}
.vc-replies{margin-top:6px;display:flex;flex-direction:column;gap:5px}
.vc-reply{background:#f8fafc;border-left:2px solid #e2e8f0;border-radius:0 6px 6px 0;padding:5px 8px;font-size:12px}
.vc-reply.adm{border-left-color:#2563eb;background:#f5f8ff}
.vc-rhead{display:flex;gap:6px;align-items:center;font-size:11px;margin-bottom:2px}
.vc-rhead .vc-date{font-size:10px}
.vc-replybox{display:flex;gap:5px;margin-top:7px}
.vc-replybox input{flex:1;border:1px solid var(--line);border-radius:6px;padding:5px 8px;font-size:12px}
.vc-replybox button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:0 10px;font-size:12px;cursor:pointer}
.vr-clientbar{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.vr-clientbar form{margin:0}
.vr-approve{width:100%;background:#16a34a;border-color:#16a34a}
.vr-reqchg{width:100%}
.vr-composer{position:absolute;z-index:20;width:260px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:10px}
.vr-composer textarea{width:100%;border:1px solid var(--line);border-radius:6px;padding:7px;font-size:13px;resize:vertical;min-height:60px;box-sizing:border-box}
.vr-comp-act{display:flex;justify-content:flex-end;gap:6px;margin-top:7px}
.vr-comp-prev{position:relative;margin-top:8px;border:1px solid var(--line);border-radius:8px;padding:8px;background:#fafafa;display:flex;align-items:center;gap:8px}
.vr-comp-prev img{max-width:80px;max-height:64px;border-radius:6px;border:1px solid var(--line)}
.vr-comp-prev span{font-size:12px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vr-comp-prev .vr-prev-file i{font-size:9px;font-weight:700;color:var(--muted);background:#eef2f7;border-radius:4px;padding:1px 4px;margin-left:3px}
.vr-prev-x{margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:50%;width:20px;height:20px;cursor:pointer;color:#dc2626;font-size:11px;flex:0 0 auto}
.vr-prev-x:hover{background:#dc2626;color:#fff;border-color:#dc2626}

/* ===== Validation v2 (tabs, menu, attachments, fullscreen) ===== */
.vr-viewport.can-pin:not(.grabbing){cursor:crosshair}
.vpin.drag{cursor:grab}.vpin.drag:active{cursor:grabbing}
.vr-tabs{display:flex;border-bottom:1px solid var(--line)}
.vr-tab{flex:1;background:#fff;border:0;border-bottom:2px solid transparent;padding:10px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.vr-tab.on{color:var(--txt);border-bottom-color:var(--accent)}
.vr-comments[hidden]{display:none}
.vr-count.alt{background:#9ca3af}
.vr-empty{color:var(--muted);font-size:12.5px;padding:16px;text-align:center}
.vr-empty.big{padding:34px 22px}
.vr-empty-ic{width:46px;height:46px;margin:0 auto 12px;color:#9ca3af;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;background:#fafafa}
.vr-empty-ic svg{width:24px;height:24px}
.vr-empty.big h4{margin:0 0 6px;color:var(--txt);font-size:14px;font-weight:700}
.vr-empty.big p{margin:0 auto;max-width:260px;font-size:12.5px;line-height:1.55}
.vc.arch{opacity:.75;background:#fafafa}
.vc-head{position:relative}
.vc-tools{position:relative;margin-left:2px}
.vc-dots{border:0;background:transparent;cursor:pointer;font-size:16px;color:var(--muted);line-height:1;padding:0 4px;border-radius:4px}
.vc-dots:hover{background:#f1f1f3;color:var(--txt)}
.vc-drop{position:absolute;right:0;top:120%;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);display:none;flex-direction:column;min-width:128px;z-index:30;overflow:hidden}
.vc-drop.open{display:flex}
.vc-drop button{border:0;background:#fff;text-align:left;padding:8px 12px;font-size:12.5px;cursor:pointer}
.vc-drop button:hover{background:#f4f4f5}
.vc-drop button.danger{color:#dc2626}
.vc-editbox{margin:4px 0}
.vc-editbox textarea{width:100%;border:1px solid var(--line);border-radius:6px;padding:6px;font-size:13px;box-sizing:border-box;min-height:54px;resize:vertical}
.vc-edit-act{display:flex;justify-content:flex-end;gap:6px;margin-top:6px}
.vc-attwrap{position:relative;display:inline-block;margin-top:6px}
.vc-attwrap .vc-att{margin-top:0}
.vc-att-x{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;border:1px solid var(--line);background:#fff;color:#dc2626;font-size:11px;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.25);display:none;align-items:center;justify-content:center;z-index:2;padding:0}
.vc.editing .vc-att-x{display:flex}
.vc-att-x:hover{background:#dc2626;color:#fff;border-color:#dc2626}
.vc-att{margin-top:6px}
.vc-att.img{display:inline-block}
.vc-att.img img{max-width:100%;max-height:150px;border:1px solid var(--line);border-radius:8px;display:block}
.vc-att.file{display:inline-block;font-size:12px;color:#1d4ed8;text-decoration:none;border:1px solid var(--line);border-radius:6px;padding:5px 9px;background:#f8fafc}
.vc-att.file span{font-size:9px;font-weight:700;color:var(--muted);background:#eef2f7;border-radius:4px;padding:1px 4px;margin-left:4px}
.vc-attach{cursor:pointer;font-size:14px;border:1px solid var(--line);background:#fff;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 auto}
.vc-attach.has{border-color:#16a34a;background:#e6f7ee}
.vc-replybox .vc-attach{width:28px;height:28px}
.vr-comp-foot{display:flex;align-items:center;gap:8px;margin-top:8px}
.vr-attname{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90px}
.vconfirm{position:fixed;inset:0;background:rgba(0,0,0,.42);display:flex;align-items:center;justify-content:center;z-index:1000}
.vconfirm-box{background:#fff;border-radius:12px;padding:18px 20px;max-width:360px;box-shadow:var(--shadow)}
.vconfirm-box p{margin:0 0 14px}
.vconfirm-act{display:flex;justify-content:flex-end;gap:8px}
.btn.danger{background:#dc2626;border-color:#dc2626}
.st-btn.danger{color:#dc2626;border-color:#f3c0c0}
.st-btn.danger:hover{background:#fde8e8}
.vdel-btn{border:1px solid var(--line);background:#fff;border-radius:6px;width:28px;height:28px;cursor:pointer;font-size:13px}
.vdel-btn:hover{border-color:#dc2626;background:#fde8e8}
#vr-root:fullscreen{background:#fff;padding:14px;height:100vh;box-sizing:border-box}
#vr-root:-webkit-full-screen{background:#fff;padding:14px;height:100vh;box-sizing:border-box}
/* drag & drop image + submit loader */
.vdrop{border:2px dashed var(--line);border-radius:10px;padding:18px;text-align:center;cursor:pointer;background:#fafafa;transition:border-color .15s,background .15s}
.vdrop:hover{border-color:#cbd5e1}
.vdrop.drag{border-color:var(--accent);background:#eef2ff}
.vdrop-empty{display:flex;flex-direction:column;gap:3px;align-items:center;color:var(--muted);font-size:13px}
.vdrop-ic{font-size:22px;color:var(--muted)}
.vdrop-browse{color:#1d4ed8;text-decoration:underline}
.vdrop-hint{font-size:11px;color:var(--muted)}
.vdrop-preview{display:flex;align-items:center;gap:10px;justify-content:center}
.vdrop-preview img{max-height:80px;max-width:150px;border:1px solid var(--line);border-radius:6px}
.vdrop-name{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px}
.vdrop-clear{border:1px solid var(--line);background:#fff;border-radius:6px;width:24px;height:24px;cursor:pointer;flex:0 0 auto}
.vdrop-clear:hover{border-color:#dc2626;color:#dc2626}
.vdrop-err{color:#dc2626;font-size:12px;margin-top:4px}
.btn.loading{pointer-events:none;opacity:.9}
.btn.loading::before{content:"";display:inline-block;width:13px;height:13px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:vspin .7s linear infinite;margin-right:7px;vertical-align:-2px}
@keyframes vspin{to{transform:rotate(360deg)}}
/* global file drop (every plain file input) */
.filedrop{flex:1 1 240px;min-width:200px;display:flex;align-items:center;gap:8px;justify-content:center;
  border:2px dashed var(--line);border-radius:8px;padding:10px 12px;cursor:pointer;background:#fafafa;
  font-size:12.5px;color:var(--muted);transition:border-color .15s,background .15s;text-align:center}
.filedrop:hover{border-color:#cbd5e1}
.filedrop.drag{border-color:var(--accent);background:#eef2ff}
.filedrop.has{border-style:solid;color:var(--txt);background:#fff}
.filedrop-input{display:none}
.filedrop-txt b{color:#1d4ed8;font-weight:600}
.filedrop-names{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--txt)}

/* ===== Projects dashboard (admin) ===== */
.topbar-link{color:var(--muted);text-decoration:none}
.topbar-link:hover{color:var(--txt)}
.dash-search{border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:13px;min-width:220px}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:6px}
.pcard{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:16px;display:flex;flex-direction:column;gap:10px}
.pcard.arch{opacity:.62;background:#fafafa}
.pcard-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.pcard-name{font-weight:700;font-size:15px}
.pcard-master{font-size:9px;font-weight:700;background:#eef2ff;color:#4f46e5;border-radius:4px;padding:1px 5px;vertical-align:middle;margin-left:4px}
.pcard-client{font-size:12.5px;color:var(--muted);margin-top:2px}
.pcard-sub{font-size:12px;color:var(--muted)}
.pcard-prog{display:flex;align-items:center;gap:8px}
.pcard-bar{flex:1;height:7px;background:#f1f1f3;border-radius:20px;overflow:hidden}
.pcard-bar span{display:block;height:100%;background:var(--accent);border-radius:20px}
.pcard-pct{font-size:11px;font-weight:700;color:var(--muted);min-width:34px;text-align:right}
.pcard-meta{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.pcard-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.pcard-actions .btn,.pcard-actions .st-btn{padding:5px 10px;font-size:12px}
.pcard-actions form{margin:0}
.np-subwrap{display:flex;align-items:center;gap:2px;font-size:13px;color:var(--muted)}
.np-subwrap input{flex:0 1 170px}
.dash-empty{color:var(--muted);text-align:center;padding:30px;font-size:14px}

/* accounts management */
.acc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.ta-r{text-align:right}
.acc-row-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end}
.acc-row-actions .inline{display:inline}

/* generic modal (forms) */
.modal{position:fixed;inset:0;background:rgba(15,18,24,.6);backdrop-filter:blur(2px);z-index:200;
  display:none;place-items:center;padding:30px}
.modal.open{display:grid;animation:help-fade .14s ease}
.modal-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;width:min(440px,92vw);
  box-shadow:0 24px 60px rgba(0,0,0,.4);overflow:hidden}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;
  border-bottom:1px solid var(--line);font-weight:700;background:#fafafa}
.modal-x{border:1px solid var(--line);background:#fff;width:30px;height:30px;border-radius:8px;cursor:pointer;color:var(--muted)}
.modal-x:hover{color:var(--txt);border-color:var(--accent)}
.modal-body{padding:18px;display:flex;flex-direction:column;gap:12px}
.modal-body label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)}
.modal-body input,.modal-body select{padding:10px 12px;border:1px solid var(--line);border-radius:8px;
  font-size:14px;background:#fff;color:var(--txt)}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}

/* collapsible Notes block */
.notes-collapse{margin-top:50px;position:relative}
.notes-collapse::before{content:"";position:absolute;left:0;right:0;top:-25px;border-top:1px solid var(--line)}
.notes-collapse > summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;margin:0}
.notes-collapse > summary::-webkit-details-marker{display:none}
.notes-collapse > summary::marker{content:''}
.notes-collapse > summary::before{content:'▾';color:var(--txt);font-size:20px;line-height:1;transition:transform .15s ease}
.notes-collapse[open] > summary::before{transform:rotate(-180deg)}
.notes-collapse > summary .qlabel{flex:0 1 auto;font-weight:600}
.appfoot{padding:16px 30px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}

/* ---------- editor ---------- */
.flash{background:#f4f4f5;border:1px solid var(--line);border-left:3px solid var(--accent);
  padding:10px 14px;border-radius:8px;margin-bottom:16px;font-size:13px}
.editor.with-list{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:start}
.entlist{position:sticky;top:74px;max-height:calc(100vh - 100px);overflow:auto;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:8px}
.entfilter{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:7px;margin-bottom:6px}
.entitem{display:block;padding:8px 10px;border-radius:7px;color:var(--muted)}
.entitem:hover{background:#fafafa;color:var(--txt)}
.entitem.active{background:#fafafa;color:var(--txt);box-shadow:inset 2px 0 0 var(--accent)}
.entname{display:block;font-size:13px;font-weight:600;color:inherit}
.entsub{display:block;font-size:11px;color:var(--muted)}

.qform{display:flex;flex-direction:column;gap:14px}
.qrow{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.qhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.qlabel{font-weight:600;flex:1}
.req{color:var(--bad);margin-left:3px}
.qtools{display:flex;gap:6px;margin-left:auto}
.qtool{border:1px solid var(--line);background:#fff;border-radius:7px;padding:3px 9px;
  font-size:12px;color:var(--muted);cursor:pointer}
.qtool:hover{color:var(--txt);border-color:var(--accent)}
.qhelp{font-size:12px;color:var(--muted);margin:6px 0 0}
.qinput{margin-top:10px}
.qinput input[type=text],.qinput input[type=url],.qinput input[type=number],
.qinput textarea,.qinput select{width:100%;padding:9px 11px;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:var(--txt);font-family:inherit;font-size:14px}
.qinput input:focus,.qinput textarea:focus,.qinput select:focus{outline:none;border-color:var(--accent)}
.qinput textarea{resize:vertical}

.nav-label.group{color:var(--txt);font-weight:700;border-top:1px solid var(--line);padding-top:12px;margin-top:14px}

/* help button + modal */
.help-btn{margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:7px;
  padding:3px 10px;font-size:12px;color:var(--muted);cursor:pointer}
.help-btn:hover{color:var(--txt);border-color:var(--accent)}
.dl-btn{margin-left:8px;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:7px;
  padding:3px 10px;font-size:12px;text-decoration:none}
.dl-btn:hover{background:#000}
.help-modal{position:fixed;inset:0;background:rgba(15,18,24,.72);backdrop-filter:blur(3px);
  z-index:200;display:grid;place-items:center;padding:32px;animation:help-fade .14s ease}
@keyframes help-fade{from{opacity:0}to{opacity:1}}
.help-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  max-width:min(92vw,1100px);max-height:90vh;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.45)}
.help-head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 18px;border-bottom:1px solid var(--line);background:#fafafa}
.help-title{font-weight:700;font-size:15px}
.help-title small{display:block;font-weight:500;font-size:11px;color:var(--muted);margin-top:2px}
.help-close{border:1px solid var(--line);background:#fff;width:30px;height:30px;border-radius:8px;
  cursor:pointer;font-size:14px;color:var(--muted);display:grid;place-items:center;flex:0 0 auto}
.help-close:hover{color:var(--txt);border-color:var(--accent)}
.help-body{padding:18px;overflow:auto;display:grid;place-items:center;background:#f4f4f5}
.help-body img{max-width:100%;max-height:calc(90vh - 130px);width:auto;height:auto;border-radius:8px;
  display:block;box-shadow:0 2px 12px rgba(0,0,0,.18);background:#fff}
.help-empty{padding:48px 32px;color:var(--muted);text-align:center}

/* gallery by categories */
.gal-cat{border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:12px;background:#fafafa}
.gal-cat-head{display:flex;gap:8px;margin-bottom:10px}
.gal-cat-name{flex:1;padding:9px 11px;border:1px solid var(--line);border-radius:7px;font-weight:600;background:#fff}
.gal-cat-del{width:34px;border:1px solid var(--line);background:#fff;border-radius:7px;cursor:pointer;color:var(--muted)}
.gal-cat-del:hover{color:var(--bad);border-color:var(--bad)}
.dropzone{display:block;border:2px dashed var(--line);border-radius:8px;padding:18px;text-align:center;
  color:var(--muted);cursor:pointer;background:#fff;font-size:13px}
.dropzone:hover,.dropzone.drag{border-color:var(--accent);color:var(--txt)}
.gal-images{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.gal-img{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:7px;padding:6px 8px}
.gal-thumb{font-size:16px;flex:0 0 auto}
.gal-thumb-img{width:42px;height:42px;object-fit:cover;border-radius:6px;border:1px solid var(--line);cursor:zoom-in;flex:0 0 auto;display:block;background:#000}
.gal-thumb-img:hover{border-color:var(--accent)}
.vidwrap{position:relative;flex:0 0 auto;display:inline-block;line-height:0}
.gal-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:13px;
  background:rgba(0,0,0,.55);border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;pointer-events:none;padding-left:2px}
.gal-file{font-size:12px;color:var(--muted);width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 0 auto}
.gal-name{flex:1;padding:6px 9px;border:1px solid var(--line);border-radius:6px}
.gal-or{margin-top:10px;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}
.gal-or input{flex:1;padding:8px 10px;border:1px solid var(--line);border-radius:7px}
.add-gal-cat{border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:7px;padding:9px 14px;cursor:pointer;font-size:13px}

/* fonts field — Google Font option */
.orgf{margin:11px 0 7px;font-size:13px;color:var(--muted)}
.orgf a{color:var(--txt);font-weight:600;text-decoration:underline}
.reco{display:inline-block;margin-left:6px;font-size:10px;font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;background:var(--accent);color:#fff;padding:2px 8px;border-radius:20px}

/* yesno radios + Other input */
.radio{display:inline-flex;align-items:center;gap:6px;margin-right:18px;font-size:14px}
.other-input{margin-top:8px}

/* form-fields table (Forms) */
.ffgrid{width:100%;border-collapse:collapse}
.ffgrid th,.ffgrid td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-size:13px}
.ffgrid th{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px}
.ffgrid th:nth-child(2),.ffgrid th:nth-child(3),
.ffgrid td:nth-child(2),.ffgrid td:nth-child(3){text-align:center;width:90px}
.ff-custom{font-size:10px;background:#f4f4f5;border:1px solid var(--line);border-radius:5px;
  padding:1px 6px;color:var(--muted);margin-left:6px}
.ff-del{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;margin-left:8px}
.ff-del:hover{color:var(--bad)}

/* repeatable people (Users) */
.person-row{display:grid;grid-template-columns:1fr 1fr 1fr 1.3fr auto;gap:8px;margin-bottom:8px;align-items:center}
.person-row input{padding:8px 10px;border:1px solid var(--line);border-radius:7px}
.add-person,.add-ms{border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:7px;
  padding:8px 12px;cursor:pointer;font-size:13px;margin-top:4px}
.row-del{border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:7px;width:32px;height:32px;cursor:pointer}
.row-del:hover{color:var(--bad);border-color:var(--bad)}

/* milestones (payment plan) */
.msgrid{width:100%;border-collapse:collapse;margin-bottom:8px}
.msgrid th,.msgrid td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}
.msgrid th{color:var(--muted);text-transform:uppercase;font-size:11px;letter-spacing:.5px}
.msgrid input{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:6px}

/* change logs — colourful feed */
.logfeed{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
.logrow{display:grid;grid-template-columns:118px 120px 150px minmax(0,1.1fr) minmax(0,1.4fr);gap:14px;
  align-items:center;padding:13px 18px;border-bottom:1px solid var(--line);white-space:nowrap;font-size:13px}
.logrow:last-child{border-bottom:0}
.logrow:hover{background:#fafafa}
.log-act{justify-self:start;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:4px 11px;border-radius:20px}
.act-update{background:#e7f0ff;color:#1d4ed8}
.act-approve{background:#e6f7ee;color:#15803d}
.act-needs_clarification{background:#fff4e0;color:#b45309}
.act-upload{background:#f1e9ff;color:#7c3aed}
.act-comment{background:#eef2f6;color:#475569}
.log-when{color:var(--muted)}
.log-who{font-weight:600}
.log-where,.log-change{overflow:hidden;text-overflow:ellipsis}
.log-where{color:var(--muted)} .log-where b{color:var(--txt)}
.log-change .new{color:#15803d;font-weight:600} .log-change .arrow{color:var(--muted);margin:0 4px}
.logrow{cursor:pointer}
.log-detail{max-width:min(92vw,560px)}
.log-detail-body{padding:4px 18px 16px}
.ld-row{display:grid;grid-template-columns:90px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;align-items:start}
.ld-row:last-child{border-bottom:0}
.ld-row b{color:var(--muted);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.5px}
.ld-row span{white-space:pre-wrap;word-break:break-word}

/* entity-level approve bar */
.entity-approve{display:flex;align-items:center;gap:12px;background:#fafafa;border:1px solid var(--line);
  border-radius:var(--radius);padding:12px 16px;margin-top:6px}
.entity-approve .ea-label{font-weight:600}
.entity-approve .ea-spacer{flex:1}

/* field-group tabs (e.g. Projects) */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.tab{background:transparent;border:0;border-bottom:2px solid transparent;padding:10px 16px;cursor:pointer;
  color:var(--muted);font-size:13px;font-weight:600}
.tab:hover{color:var(--txt)}
.tab.active{color:var(--txt);border-bottom-color:var(--accent)}
.tab .tabcount{display:inline-block;margin-left:7px;font-size:10px;background:var(--muted);color:#fff;
  border-radius:10px;padding:1px 6px;vertical-align:middle}
.tab.active .tabcount,.tab .tabcount.zero{background:var(--accent)}
.tab .tabcount.zero{background:#c7c7cc}
.tabpanel{display:none;flex-direction:column;gap:14px}
.tabpanel.active{display:flex}

/* Maps two-step category selector */
.cat-selector-row{background:#fafafa;border:1px solid var(--line);border-left:3px solid var(--accent)}
.cat-selector .chk{background:#fff}

/* status pills */
.st{font-size:11px;padding:3px 9px;border-radius:20px;border:1px solid transparent;white-space:nowrap;font-weight:600}
.st-not_started{background:#f3f4f6;color:#6b7280}
.st-in_progress{background:#e7f0ff;color:#1d4ed8}
.st-submitted{background:#fff4e0;color:#b45309}
.st-approved{background:#e6f7ee;color:#15803d}
.st-needs_clarification{background:#fde8e8;color:#b91c1c}
.st-done{background:#e6f7ee;color:#15803d}
.st-blocked{background:#fde8e8;color:#b91c1c}

/* switch / checkbox */
.switch{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.checklist{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;padding:5px 8px;border:1px solid var(--line);
  border-radius:7px;background:#fafafa}
.addrow{display:flex;gap:8px;margin-top:10px}
.addrow .add-landmark{flex:1}
.add-btn,.add-cat-btn,.add-lm-btn,.cmt-add button{border:1px solid var(--accent);background:var(--accent);
  color:#fff;border-radius:7px;padding:8px 12px;cursor:pointer;font-size:13px;white-space:nowrap}
.addrow input[disabled],.chk input[disabled]{opacity:.5}
button[disabled]{opacity:.4;cursor:not-allowed}

/* file + drive */
.filecur{font-size:13px;margin-bottom:8px}
.filecur.img{display:flex;align-items:center;gap:10px}
.filecur-thumb{width:54px;height:54px;object-fit:cover;border:1px solid var(--line);border-radius:8px;cursor:zoom-in;flex:0 0 auto;background:#f4f4f5}
.filecur-thumb:hover{border-color:var(--accent)}
.filecur-name{cursor:zoom-in;text-decoration:none;color:var(--txt)}
.filecur-name:hover{text-decoration:underline}
.filecur-dl{margin-left:auto;color:var(--muted);text-decoration:none;font-size:14px;border:1px solid var(--line);border-radius:6px;padding:2px 8px}
.filecur-dl:hover{border-color:var(--accent);color:var(--txt)}
.fdrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fdrow .or{color:var(--muted);font-size:12px}
.fdrow input[type=url]{flex:1;min-width:160px}

/* AI */
.ai-bar{display:flex;gap:6px;margin-top:8px}
.ai-btn{border:1px solid var(--line);background:#fff;border-radius:7px;padding:5px 10px;
  font-size:12px;color:var(--muted);cursor:pointer}
.ai-btn:hover{border-color:var(--accent);color:var(--txt)}

/* comments */
.cmt-drawer{margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.cmt{background:#fafafa;border:1px solid var(--line);border-radius:8px;padding:8px 11px;margin-bottom:8px;font-size:13px}
.cmt-add{display:flex;gap:8px}
.cmt-add input{flex:1;padding:8px 10px;border:1px solid var(--line);border-radius:7px}
.small{font-size:12px}

/* admin status */
.adminbar{display:flex;gap:8px;margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.st-btn{border:1px solid var(--line);background:#fff;border-radius:7px;padding:6px 12px;cursor:pointer;font-size:12px}
.st-btn:hover{border-color:var(--accent)}
.st-btn.ok:hover{background:#18181b;color:#fff}
.st-btn.danger{border-color:#c0392b;color:#c0392b}
.st-btn.danger:hover{background:#c0392b;color:#fff;border-color:#c0392b}

/* footer actions */
.formfoot{display:flex;gap:10px;justify-content:flex-end;margin-top:6px;position:sticky;bottom:0;
  background:linear-gradient(transparent,var(--bg) 40%);padding:14px 0}
.btn{border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:8px;
  padding:11px 20px;cursor:pointer;font-weight:600;font-size:14px}
.btn.ghost{background:#fff;color:var(--txt)}
.btn:hover{background:#000}.btn.ghost:hover{background:#fafafa}

/* history timeline */
.timeline{display:flex;flex-direction:column;gap:12px}
.tl-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.tl-meta{display:flex;gap:10px;align-items:center;margin-bottom:10px;font-size:13px}
.diff{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch}
.diff-col{border:1px solid var(--line);border-radius:8px;padding:10px;font-size:13px;background:#fafafa}
.diff-col.new{background:#fff}
.diff-lab{display:block;font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:5px}
.diff-arrow{display:grid;place-items:center;color:var(--muted)}

@media(max-width:760px){.layout{grid-template-columns:1fr}.sidebar{position:static;height:auto}
  .editor.with-list{grid-template-columns:1fr}.entlist{position:static;max-height:none}
  .diff{grid-template-columns:1fr}.diff-arrow{transform:rotate(90deg)}}