:root{
  --bg:#0b0b0c;
  --card:#141416;
  --muted:#a0a0a6;
  --text:#f2f2f3;
  --border:#2a2a2e;
  --btn:#ffffff;
  --btnText:#0b0b0c;
}
*{box-sizing:border-box}
body{margin:0; font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial; background:var(--bg); color:var(--text);}
a{color:inherit}
.topbar{display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid var(--border); background:#0f0f10;}
.brand{display:flex; gap:12px; align-items:center;}
.logo{height:36px; width:auto; border-radius:10px;}
.brand-title{font-weight:700;}
.brand-sub{font-size:12px; color:var(--muted);}
.container{max-width:1100px; margin:0 auto; padding:18px;}
h1{margin:10px 0 6px 0;}
.muted{color:var(--muted);}
.card{background:var(--card); border:1px solid var(--border); border-radius:16px; padding:16px; margin:14px 0;}
.subtle{background:#101012;}
.field{display:flex; flex-direction:column; gap:6px; margin:10px 0;}
input, select{padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:#0f0f10; color:var(--text); outline:none;}
input:focus, select:focus{border-color:#4a4a55;}
.checkbox label{display:flex; gap:10px; align-items:flex-start;}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:14px; border:1px solid var(--border); background:var(--btn); color:var(--btnText); text-decoration:none; cursor:pointer; font-weight:700;}
.btn:hover{opacity:0.95}
.btn:disabled{opacity:0.4; cursor:not-allowed}
.btn-ghost{background:transparent; color:var(--text);}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px;}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.footer{padding:16px; text-align:center; color:var(--muted); border-top:1px solid var(--border);}
.alert{padding:12px 14px; border-radius:14px; border:1px solid var(--border); background:#101012;}
.alert-error{border-color:#5a1c1c; background:#1a1010;}

.nav{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.page-head{display:flex; justify-content:space-between; align-items:flex-end; gap:10px; flex-wrap:wrap;}
.page-actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}

.pdf-wrap{padding:12px;}
.pdf-stage{position:relative; width:100%;}
#pdfCanvas{width:100%; height:auto; display:block; border-radius:12px; border:1px solid var(--border);}
.overlay{position:absolute; left:0; top:0; pointer-events:none;}
.overlay-input{position:absolute; pointer-events:auto; padding:2px 4px; border-radius:8px; border:1px solid rgba(255,255,255,0.3); background:rgba(15,15,16,0.75); color:#fff;}
