/* ============================================================
   G.O.D. UGC editor — workbench styling (matches the codex theme)
   ============================================================ */
#editor-screen { position:fixed; inset:0; z-index:40; display:flex; flex-direction:column;
  background:radial-gradient(1200px 800px at 20% -10%, rgba(97,74,178,.18), transparent 55%), var(--bg-0); }
#editor-screen.hidden { display:none; }

.ed-topbar { display:flex; align-items:center; gap:16px; padding:12px 20px;
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1)); border-bottom:1px solid var(--line); }
.ed-title { font-family:var(--f-head); font-weight:700; font-size:18px; color:var(--gold-hi); letter-spacing:.04em; }
.ed-title span { color:var(--muted); font-size:13px; font-weight:500; }
.ed-actions { margin-left:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ed-status { font-size:12px; color:var(--muted); margin-right:6px; }
.ed-status.dirty { color:var(--gold-hi); }

.ed-btn { font-family:var(--f-body); font-size:13px; padding:7px 13px; border-radius:8px; cursor:pointer;
  background:var(--bg-3); color:var(--ink); border:1px solid var(--line); transition:all .15s; white-space:nowrap; }
.ed-btn:hover { background:var(--bg-4); }
.ed-btn.primary { background:linear-gradient(180deg, var(--gold), var(--gold-deep)); color:#231a05; border-color:var(--gold-deep); font-weight:700; }
.ed-btn.good { background:rgba(87,213,154,.16); color:var(--jade); border-color:rgba(87,213,154,.4); font-weight:600; }
.ed-btn.warn { background:rgba(240,87,112,.12); color:var(--crimson); border-color:rgba(240,87,112,.35); }
.ed-btn.tiny { padding:4px 9px; font-size:12px; }

.ed-body { flex:1; display:flex; min-height:0; }
.ed-tabs { flex:0 0 190px; display:flex; flex-direction:column; gap:2px; padding:12px 8px; overflow-y:auto;
  background:rgba(15,18,38,.6); border-right:1px solid var(--line); }
.ed-tab { display:flex; align-items:center; gap:9px; padding:9px 12px; border-radius:9px; cursor:pointer;
  background:transparent; border:1px solid transparent; color:var(--ink-dim); text-align:left; font-size:14px; }
.ed-tab:hover { background:var(--bg-2); }
.ed-tab.active { background:var(--bg-3); border-color:var(--gold-deep); color:var(--gold-hi); }
.ed-tab-ic { width:20px; text-align:center; font-size:15px; }
.ed-tab-lb { flex:1; }
.ed-tab-ct { font-family:var(--f-data); font-size:12px; color:var(--muted); background:rgba(0,0,0,.3); border-radius:10px; padding:1px 8px; }

.ed-main { flex:1; overflow-y:auto; padding:18px 22px; min-width:0; }
.ed-head h2, .ed-detail-head h2 { font-family:var(--f-head); color:var(--ink); font-size:20px; margin-bottom:4px; }
.ed-sub { color:var(--muted); font-size:12.5px; margin-bottom:14px; }
.mono { font-family:var(--f-data); color:var(--gold); }

.ed-form { display:grid; grid-template-columns:repeat(2, minmax(260px, 1fr)); gap:14px 22px; max-width:980px; }
.ed-form.wide { grid-template-columns:repeat(3, minmax(220px, 1fr)); }
.ed-field { display:flex; flex-direction:column; gap:5px; }
.ed-field.row { flex-direction:row; align-items:center; gap:9px; }
.ed-label { font-size:12px; color:var(--muted); letter-spacing:.04em; }
.ed-label.inline { color:var(--ink-dim); }
.ed-label em { color:var(--gold-deep); font-style:normal; font-size:11px; }
.ed-in { font-family:var(--f-body); font-size:13px; padding:8px 10px; border-radius:7px;
  background:var(--bg-1); color:var(--ink); border:1px solid var(--line); width:100%; }
.ed-in:focus { outline:none; border-color:var(--gold-deep); box-shadow:0 0 0 2px rgba(237,193,101,.15); }
.ed-in.area { resize:vertical; font-family:var(--f-data); line-height:1.5; }
.ed-in.tiny { padding:5px 7px; width:64px; }
.ed-check { width:18px; height:18px; accent-color:var(--gold); }
select.ed-in { cursor:pointer; }

.ed-tags { display:flex; flex-wrap:wrap; gap:6px; }
.ed-tagchip { font-size:12px; padding:4px 10px; border-radius:14px; cursor:pointer;
  background:var(--bg-2); border:1px solid var(--line); color:var(--muted); user-select:none; }
.ed-tagchip.on { background:rgba(237,193,101,.16); border-color:var(--gold-deep); color:var(--gold-hi); }

.ed-stats { display:flex; flex-wrap:wrap; gap:10px; }
.ed-stat-cell { display:flex; flex-direction:column; align-items:center; gap:3px; }
.ed-stat-lb { font-size:10.5px; color:var(--muted); }

/* records: list + detail */
.ed-records { display:flex; gap:18px; min-height:0; }
.ed-list { flex:0 0 260px; display:flex; flex-direction:column; gap:8px; }
.ed-list-tools { display:flex; gap:6px; }
.ed-list-box { flex:1; overflow-y:auto; max-height:calc(100vh - 190px); display:flex; flex-direction:column; gap:3px;
  border:1px solid var(--line); border-radius:9px; padding:6px; background:rgba(15,18,38,.5); }
.ed-list-item { display:flex; gap:8px; align-items:center; padding:7px 9px; border-radius:7px; cursor:pointer; border:1px solid transparent; }
.ed-list-item:hover { background:var(--bg-2); }
.ed-list-item.active { background:var(--bg-3); border-color:var(--gold-deep); }
.li-id { font-family:var(--f-data); font-size:12px; color:var(--gold); min-width:44px; }
.li-nm { font-size:13px; color:var(--ink-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ed-detail { flex:1; min-width:0; }
.ed-detail-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.ed-detail-actions { display:flex; gap:6px; }
.ed-empty { color:var(--muted); padding:40px; text-align:center; }
.ed-maplist { display:flex; flex-direction:column; gap:8px; max-width:640px; margin-bottom:14px; }
.ed-maprow { display:flex; gap:10px; align-items:flex-end; }
.ed-maprow .ed-field { flex:1; }

.ed-toast { position:fixed; left:50%; bottom:34px; transform:translateX(-50%) translateY(20px); z-index:80;
  background:var(--bg-3); color:var(--gold-hi); border:1px solid var(--gold-deep); border-radius:10px;
  padding:10px 20px; font-size:14px; box-shadow:var(--shadow-lg); opacity:0; pointer-events:none; transition:all .25s; }
.ed-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* start-screen entry button */
.btn.btn-ghost { background:transparent; border:1px solid var(--gold-deep); color:var(--gold-hi); margin-top:10px; }
.btn.btn-ghost:hover { background:rgba(237,193,101,.1); }