*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#efece5;font-family:Helvetica,Arial,sans-serif;overflow:hidden}
.hidden{display:none!important}
.err{color:#b91c1c;font-size:13px;min-height:18px}

/* вход */
#login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#efece5}
.login-box{background:#fffdf7;border:1px solid #b4a98c;border-radius:14px;padding:36px 44px;max-width:430px;
  box-shadow:0 6px 24px rgba(0,0,0,.12);text-align:center}
.login-box h1{margin:0 0 8px;color:#1e293b}
.login-box p{color:#475569;font-size:14px}
.login-box input{width:100%;padding:10px 12px;font-size:16px;border:1px solid #b4a98c;border-radius:8px;margin:8px 0}
.login-box button{width:100%;padding:10px;font-size:16px;background:#2563eb;color:#fff;border:0;border-radius:8px;cursor:pointer}
.login-box button:hover{background:#1d4ed8}

/* сцена */
#wrap{position:fixed;inset:0;cursor:grab}
#wrap.drag{cursor:grabbing}
#wrap svg{display:block;width:100%;height:100%}
#ctl{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;z-index:10}
#ctl button{width:44px;height:44px;font-size:20px;border:1px solid #b4a98c;background:#fffdf7;border-radius:10px;
  cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.15)}
#ctl button:hover{background:#f3ecd9}
#hint{position:fixed;left:16px;bottom:16px;background:rgba(255,255,255,.92);border:1px solid #cbd5e1;border-radius:8px;
  padding:6px 12px;font-size:12px;color:#475569;max-width:46vw}
#demo-banner{position:fixed;top:12px;left:50%;transform:translateX(-50%);background:#fef3c7;border:1px solid #b45309;
  color:#7c2d12;border-radius:8px;padding:6px 14px;font-size:13px;z-index:20}

/* карточка в svg — курсор */
.card-hit{cursor:pointer}
.card-hit:hover rect.card-bg{stroke-width:3}

/* боковая панель */
#panel{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:96vw;background:#fffdf7;border-left:1px solid #b4a98c;
  box-shadow:-6px 0 22px rgba(0,0,0,.15);z-index:30;overflow-y:auto;padding:20px 22px}
#panel-close{position:absolute;top:10px;right:12px;border:0;background:none;font-size:18px;cursor:pointer;color:#475569}
#panel h2{margin:2px 0 4px;font-size:20px;color:#1e293b}
#panel .maiden{color:#475569;font-weight:normal;font-size:15px}
#panel dl{margin:12px 0;font-size:14px}
#panel dt{color:#7c2d12;font-size:11px;text-transform:uppercase;letter-spacing:.4px;margin-top:9px}
#panel dd{margin:1px 0 0;color:#1e293b}
#panel .note{background:#f1f5f9;border-radius:8px;padding:10px 12px;font-size:13px;color:#334155;margin:10px 0}
#panel .locked-note{background:#fef3c7;border:1px solid #d8cbaa;border-radius:8px;padding:8px 12px;font-size:12px;color:#7c2d12}
.btn-row{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.btn{flex:1;min-width:150px;padding:9px 10px;font-size:14px;border-radius:8px;border:1px solid #2563eb;cursor:pointer}
.btn.primary{background:#2563eb;color:#fff}
.btn.primary:hover{background:#1d4ed8}
.btn.secondary{background:#fff;color:#2563eb}
.btn.secondary:hover{background:#eff6ff}

/* формы */
#panel-form h3{margin:4px 0 10px;color:#1e293b}
#panel-form label{display:block;font-size:12px;color:#7c2d12;text-transform:uppercase;letter-spacing:.4px;margin:10px 0 3px}
#panel-form input[type=text],#panel-form select,#panel-form textarea{
  width:100%;padding:8px 10px;font-size:14px;border:1px solid #b4a98c;border-radius:7px;background:#fff}
#panel-form textarea{resize:vertical;min-height:60px}
.date-row{display:flex;gap:6px}
.date-row select{flex:1}
.chk{display:flex;align-items:center;gap:6px;font-size:13px;color:#475569;margin-top:6px}
.chk input{width:auto}
.form-note{font-size:12px;color:#64748b;margin-top:4px}
.dup-warn{background:#fef3c7;border:1px solid #b45309;border-radius:8px;padding:8px 12px;font-size:13px;color:#7c2d12;margin:10px 0}
.ok-msg{background:#dcfce7;border:1px solid #16a34a;border-radius:8px;padding:10px 12px;font-size:14px;color:#14532d;margin:10px 0}