/* Raise minimum font sizes — the smallest captions were hard to read. */
  .text-\[9px\]  { font-size: 11px !important; }
  .text-\[10px\] { font-size: 12px !important; }
  .text-\[11px\] { font-size: 12px !important; }

  :root {
    --bg:#f8fafc; --bg-side:#ffffff; --card:#ffffff; --card-hover:#f1f5f9;
    --border:#e2e8f0; --border-soft:#eef2f7;
    --text:#0f172a; --text-soft:#334155; --muted:#64748b; --muted-2:#94a3b8;
    --accent:#b87a23; --accent-2:#d99a3d; --accent-bg:rgba(217,154,61,.12);
    --link:#dc2626;
    --good:#16a34a; --good-bg:rgba(34,197,94,.12);
    --bad:#dc2626; --bad-bg:rgba(239,68,68,.12);
    --warn:#b45309; --warn-bg:rgba(217,154,61,.15);
    --slate-bg:rgba(100,116,139,.10); --grid:#e2e8f0; --tick:#94a3b8;
  }
  html.dark {
    --bg:#0b0d10; --bg-side:#11141a; --card:#11141a; --card-hover:#161a22;
    --border:#1c2230; --border-soft:#161a22;
    --text:#e2e8f0; --text-soft:#cbd5e1; --muted:#b1bdcc; --muted-2:#8a96a8;
    --accent:#e8b86b; --accent-2:#d99a3d; --accent-bg:rgba(232,184,107,.14);
    --link:#facc15;
    --good:#4ade80; --good-bg:rgba(34,197,94,.15);
    --bad:#f87171; --bad-bg:rgba(239,68,68,.15);
    --warn:#e8b86b; --warn-bg:rgba(217,154,61,.15);
    --slate-bg:rgba(148,163,184,.12); --grid:#1c2230; --tick:#64748b;
  }
  html { font-size: 17px; }
  body { font-family:'Inter',system-ui,sans-serif; background:var(--bg); color:var(--text); }
  /* Default link colour: yellow in dark mode, red in clear mode. Links with an
     explicit text-* utility (e.g. text-accent, text-t) keep their own colour. */
  a { color: var(--link); }
  /* Native <select> dropdown items use OS-chrome by default; force them to inherit
     panel theme so they're not unreadable (white-on-white in dark mode). */
  select { background-color: var(--card); color: var(--text); }
  select option { background-color: var(--card); color: var(--text); }
  .surface{background:var(--card);border-color:var(--border)}
  .surface-side{background:var(--bg-side);border-color:var(--border)}
  .border-c{border-color:var(--border)} .border-s{border-color:var(--border-soft)}
  .text-t{color:var(--text)} .text-soft{color:var(--text-soft)}
  .text-muted{color:var(--muted)} .text-muted-2{color:var(--muted-2)}
  .text-accent{color:var(--accent)}
  .bg-accent{background:var(--accent-2);color:#0b0d10}
  .bg-accent:hover{background:var(--accent)}
  .hover-row:hover{background:var(--card-hover)}
  .tab-active{color:var(--accent);border-color:var(--accent-2)}
  .tab-inactive{color:var(--muted);border-color:transparent}
  .tab-inactive:hover{color:var(--text-soft)}
  .chip{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;border-radius:9999px;font-size:.7rem;font-weight:500}
  .chip-green{background:var(--good-bg);color:var(--good)}
  .chip-red{background:var(--bad-bg);color:var(--bad)}
  .chip-amber{background:var(--warn-bg);color:var(--warn)}
  .chip-slate{background:var(--slate-bg);color:var(--text-soft)}
  .text-good{color:var(--good)} .text-bad{color:var(--bad)}
  .chart-md{height:180px;position:relative}
  .scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}
  .scrollbar-thin::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .stub-banner{background:var(--warn-bg);color:var(--warn);border:1px dashed var(--accent-2);border-radius:6px;padding:.6rem .9rem;font-size:.78rem}
  .input{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.35rem .6rem;font-size:.8rem;width:100%;display:block}
  .input:focus{outline:none;border-color:var(--accent-2)}
  .btn-ghost{padding:.35rem .65rem;border-radius:6px;font-size:.75rem;border:1px solid var(--border);color:var(--text-soft);background:var(--card)}
  .btn-ghost:hover{background:var(--card-hover);color:var(--text)}
  .btn-danger{color:var(--bad)} .btn-danger:hover{background:var(--bad-bg)}
  .owner-chip{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .5rem;border-radius:9999px;font-size:.7rem;border:1px solid var(--border);cursor:pointer;user-select:none}
  .owner-chip.selected{background:var(--accent-bg);border-color:var(--accent-2);color:var(--accent)}
  .owner-chip img,.owner-chip .avatar{width:16px;height:16px;border-radius:50%}

/* GD item list — info mode switcher */
.info-mode-btn { padding: 3px 10px; font-size: 11px; border-radius: 4px; cursor: pointer;
                 border: 1px solid var(--border); background: var(--card); color: var(--muted); }
.info-mode-btn.active { background: var(--accent-bg); color: var(--accent); border-color: var(--accent-2); }

/* Function label chips */
.item-label { display:inline-block; font-size: 9px; padding: 1px 5px; border-radius: 3px;
              margin-left: 3px; vertical-align: middle; line-height: 1.6; }
.label-IS          { background:#1e3a5f; color:#60a5fa; }
.label-UPGRADE     { background:#2d2000; color:#fbbf24; }
.label-BOX         { background:#1a2d1a; color:#4ade80; }
.label-SKILL       { background:#2d1a3d; color:#c084fc; }
.label-POLY        { background:#2d1a1a; color:#f87171; }
.label-CONSUMABLE  { background:#1a2d2d; color:#34d399; }

/* Market mode column group borders */
.col-m30-start { border-left: 2px solid var(--accent-bg); }
.col-d30-start { border-left: 2px solid rgba(147,51,234,.27); }

/* ---- collapsible sidebar (desktop) + hamburger overlay (mobile) ---- */
#panel-sidebar{display:flex}
body.sidebar-hidden #panel-sidebar{display:none}
#sidebar-backdrop{display:none}
@media (max-width: 767px){
  #panel-sidebar{display:none;position:fixed;top:0;left:0;bottom:0;z-index:50;
                 width:14rem;box-shadow:4px 0 24px rgba(0,0,0,.45)}
  body.sidebar-open-mobile #panel-sidebar{display:flex}
  body.sidebar-open-mobile #sidebar-backdrop{display:block;position:fixed;inset:0;
                 background:rgba(0,0,0,.5);z-index:40}
}