/* v4 fixes: ensure clickable buttons */
:root {
  --bg: #ffffff;
  --muted: #6b7280;
  --card: #ffffff;
  --border: #e6e9ef;
  --accent: #2563eb;
  --accent-2: #06b6d4;
  --text:#0f172a;
  --soft:#f8fafc;
  --radius:12px;
}

/* Base reset */
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:Inter,ui-sans-serif,system-ui,Arial;background:var(--soft);color:var(--text);margin:0;min-height:100vh}

/* Topbar */
.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;border-bottom:1px solid var(--border);background:linear-gradient(90deg,#ffffff,#fbfdff);z-index:10;position:relative}
.brand h1{margin:0;font-size:20px}
.brand .tag{margin:0;color:var(--muted);font-size:13px}
.actions button{background:transparent;border:1px solid var(--border);padding:8px 12px;border-radius:10px;cursor:pointer;pointer-events:auto}

/* Layout */
.wrap{display:flex;gap:20px;max-width:1100px;margin:28px auto;padding:0 18px;position:relative;z-index:0}
.side{width:320px;position:sticky;top:22px;height:fit-content;z-index:1;pointer-events:auto}
.main{flex:1;pointer-events:auto}
.card{background:var(--card);border:1px solid var(--border);padding:18px;border-radius:var(--radius);box-shadow:0 6px 20px rgba(16,24,40,0.04);margin-bottom:18px;position:relative;z-index:2;pointer-events:auto}
.row{display:flex;gap:10px;align-items:center;margin-top:10px}
.inputs input, input, select, button{padding:10px;border-radius:10px;border:1px solid var(--border);background:transparent;font-size:14px}
.inputs input{flex:1}
button{background:var(--accent);color:white;border:none;padding:10px 14px;border-radius:10px;cursor:pointer;pointer-events:auto}
button.actionTiny{background:transparent;border:1px solid var(--border);padding:6px;border-radius:8px;font-size:13px;cursor:pointer}
.resultCard{min-height:140px;padding:14px;border-radius:10px;border:1px dashed var(--border);background:linear-gradient(180deg,#fff,#fbfdff)}
.list{list-style:none;padding:0;margin:8px 0}
.list li{padding:10px;border-radius:10px;margin:8px 0;border:1px solid var(--border);display:flex;justify-content:space-between}
.shortlist{list-style:none;padding:0;margin:8px 0;max-height:260px;overflow:auto}
.shortlist li{display:flex;justify-content:space-between;padding:8px;border-radius:8px;border:1px dashed var(--border);margin-bottom:8px}
.small{font-size:13px;color:var(--muted)}
.footer{text-align:center;padding:18px;color:var(--muted);font-size:13px}
code{background:#f3f4f6;padding:4px 6px;border-radius:6px}

/* Ensure inputs show pointer where clickable */
input, select { cursor:text; }
button, .actionTiny { cursor:pointer; }

/* Debug overlay helper - hidden by default; can be toggled */
.debug-overlay { position: fixed; right: 12px; bottom: 12px; background: rgba(0,0,0,0.6); color: #fff; padding:8px 10px; border-radius:8px; font-size:12px; z-index:9999; display:none; }
.debug-overlay.visible { display:block; }