/* ── Modal ── */
  .modal-overlay { position:fixed; inset:0; background:rgba(30,30,30,0.4); z-index:1000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity 0.2s; backdrop-filter:blur(3px); }
  .modal-overlay.open { opacity:1; pointer-events:all; }
  .modal { background:var(--surface); border:1px solid var(--border); border-radius:12px; width:100%; max-width:540px; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.15); transform:scale(0.97); transition:transform 0.2s; }
  .modal-overlay.open .modal { transform:scale(1); }
  .modal::-webkit-scrollbar { width:4px; }
  .modal::-webkit-scrollbar-thumb { background:var(--border); }
  .modal-header { padding:22px 24px 16px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
  .modal-title { font-family:'Cormorant Garamond', serif; font-size:22px; font-weight:400; color:var(--text); }
  .modal-close { width:28px; height:28px; border-radius:6px; border:none; background:transparent; color:var(--muted); cursor:pointer; font-size:18px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; }
  .modal-close:hover { background:var(--panel); color:var(--text); }
  .modal-body { padding:22px 24px; }
  .modal-footer { padding:16px 24px; border-top:1px solid var(--border); display:flex; justify-content:flex-end; gap:10px; background:var(--panel); border-radius:0 0 12px 12px; }

  /* ── Form ── */
  .form-group { margin-bottom:18px; }
  .form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  label { display:block; font-size:10px; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted); margin-bottom:6px; }
  input, textarea, select {
    width:100%; background:var(--surface); border:1px solid var(--border); border-radius:5px;
    color:var(--text); font-family:'DM Mono', monospace; font-size:12px; padding:9px 12px;
    outline:none; transition:border-color 0.15s; box-shadow:inset 0 1px 2px rgba(0,0,0,0.04);
  }
  input:focus, textarea:focus, select:focus { border-color:#888; box-shadow:0 0 0 3px rgba(45,58,46,0.08); }
  select option { background:var(--surface); }
  textarea { resize:vertical; min-height:80px; }

  /* ── Upload zone ── */
  .upload-zone { border:2px dashed var(--border); border-radius:8px; padding:32px; text-align:center; cursor:pointer; transition:all 0.15s; background:var(--panel); }
  .upload-zone:hover, .upload-zone.dragover { border-color:#888; background:#f0ede8; }
  .upload-zone svg { width:36px; height:36px; color:var(--muted); margin-bottom:10px; }
  .upload-zone p { color:var(--text-dim); font-size:11px; }
  .upload-zone strong { color:var(--accent); }
  .upload-preview { margin-top:12px; border-radius:6px; overflow:hidden; max-height:200px; }
  .upload-preview img { width:100%; object-fit:cover; }

  /* ── Empty state ── */
  .empty-state { text-align:center; padding:60px 20px; color:var(--muted); }
  .empty-state svg { width:48px; height:48px; margin-bottom:16px; opacity:0.3; }
  .empty-state h3 { font-family:'Cormorant Garamond', serif; font-size:22px; color:var(--text-dim); margin-bottom:8px; font-weight:300; }
  .empty-state p { font-size:12px; line-height:1.7; }

  /* ── Section heading ── */
  .section-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
  .section-head h2 { font-family:'Cormorant Garamond', serif; font-size:20px; font-weight:300; color:var(--text-dim); }

  /* ── Detail view ── */
  .detail-panel { background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:24px; box-shadow:0 1px 4px rgba(0,0,0,0.04); }
  .detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
  .detail-item label { font-size:10px; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted); display:block; margin-bottom:4px; }
  .detail-item p { color:var(--text); font-size:13px; }
  .divider { border:none; border-top:1px solid var(--border); margin:20px 0; }

  /* ── Toast ── */
  #toast { position:fixed; bottom:28px; right:28px; z-index:2000; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
  .toast-item { background:var(--accent); border-radius:6px; padding:12px 16px; font-size:12px; color:#fff; opacity:0; transform:translateX(20px); transition:all 0.25s; min-width:220px; box-shadow:0 4px 12px rgba(0,0,0,0.15); }
  .toast-item.show { opacity:1; transform:none; }
  .toast-item.error { background:var(--danger); }

  /* ── Responsive ── */
  @media(max-width:768px) {
    #sidebar { width:180px; min-width:180px; }
    .form-row { grid-template-columns:1fr; }
    .detail-grid { grid-template-columns:1fr; }
  }

  @media (max-width: 640px) {
    .modal-overlay { align-items: flex-end; }
    .modal { border-radius: 16px 16px 0 0; max-width: 100%; max-height: 92vh; margin-bottom: 0; }
    .modal-footer { padding-bottom: max(16px, env(safe-area-inset-bottom, 16px)); }
  }