:root{
  --bg:#070b14;
  --border:rgba(255,255,255,.10);
  --text:#e9eefc;
  --muted:rgba(233,238,252,.65);
  --primary:#2f6bff;
  --danger:#ff4d5e;
  --shadow:0 18px 40px rgba(0,0,0,.35);
  --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1200px 600px at 30% -10%, rgba(47,107,255,.18), transparent 50%), var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:inherit}
.muted{color:var(--muted)}
.small{font-size:12px;line-height:1.35}
.footer{padding:18px 24px}

.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);background:rgba(6,10,20,.55);backdrop-filter: blur(10px);position:sticky;top:0;z-index:5}
.brand{font-weight:800;letter-spacing:.2px}
.topActions{display:flex;gap:10px;align-items:center}

.container{display:grid;grid-template-columns:1fr 1.2fr;gap:16px;padding:18px;max-width:1200px;margin:0 auto}
.card{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid var(--border); border-radius:var(--radius); padding:16px; box-shadow: var(--shadow)}
.card h2{margin:0 0 10px 0;font-size:18px}
.upload{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
input[type="file"]{color:var(--muted)}
input[type="number"], select, input[type="color"]{width:100%;padding:10px;border-radius:12px;border:1px solid var(--border);background:rgba(0,0,0,.25);color:var(--text)}
.docs{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.docRow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border:1px solid var(--border);border-radius:12px;background:rgba(0,0,0,.18)}
.docName{font-weight:650;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.docActions{display:flex;gap:8px;flex-wrap:wrap}

.btn{border:1px solid var(--border);background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));color:var(--text);padding:8px 12px;border-radius:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn:hover{filter:brightness(1.06)}
.btn.primary{background:linear-gradient(180deg, rgba(47,107,255,.95), rgba(47,107,255,.72));border-color:rgba(47,107,255,.55)}
.btn.danger{background:linear-gradient(180deg, rgba(255,77,94,.95), rgba(255,77,94,.72));border-color:rgba(255,77,94,.55)}

.editorWrap{min-height:calc(100vh - 60px)}
.toolbar{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border);background:rgba(6,10,20,.55);backdrop-filter: blur(10px);position:sticky;top:60px;z-index:4}
.sep{width:1px;height:24px;background:var(--border)}
.pill{padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:rgba(0,0,0,.18);min-width:72px;text-align:center}
.grow{flex:1}
.docTitle{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:13px}

.main{display:grid;grid-template-columns:1fr 340px;gap:14px;padding:14px}
.canvasArea{background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px;min-height:72vh}
.status{font-size:13px;color:var(--muted);margin:2px 0 10px 2px}
.canvasShell{position:relative;display:inline-block;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 12px 28px rgba(0,0,0,.25)}
#pdfCanvas{display:block}
#overlayCanvas{position:absolute;left:0;top:0;pointer-events:none}

.side{display:flex;flex-direction:column;gap:12px}
.panel{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px}
.panel h3{margin:0 0 10px 0;font-size:16px}
.lbl{display:block;margin-top:10px;margin-bottom:6px;color:var(--muted);font-size:12px}

.changes,.saved{white-space:pre-wrap}
@media (max-width: 980px){
  .container{grid-template-columns:1fr}
  .main{grid-template-columns:1fr}
  .toolbar{top:0}
  .topbar{position:static}
}