/* ENIWALLET Ai Console V2 0.3.2 — Productization layer (Light Modern design tokens, shell, components, responsive, a11y).
   Appended as an enhancement over the existing static SPA; backend frozen. */
:root {
  --p-bg:#f5f7fa; --p-surface:#ffffff; --p-border:#e4e8ef; --p-border2:#d7dce5;
  --p-text:#17233d; --p-text2:#4a5568; --p-text3:#8a94a6;
  --p-accent:#2563eb; --p-accent2:#1d4ed8; --p-accent-soft:#eaf0fe;
  --p-ok:#16a34a; --p-warn:#d97706; --p-bad:#dc2626; --p-grey:#94a3b8; --p-info:#0891b2;
  --p-radius:10px; --p-radius-sm:6px; --p-shadow:0 1px 3px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
  --p-shadow-lg:0 10px 30px rgba(15,23,42,.10);
  --p-font:-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
}
body.prod { background:var(--p-bg); color:var(--p-text); font-family:var(--p-font); }
.prod aside { background:var(--p-surface); border-right:1px solid var(--p-border); }
.prod aside .sec { font-size:10px; letter-spacing:.08em; color:var(--p-text3); padding:14px 12px 4px; text-transform:uppercase; }
.prod aside button { border-radius:var(--p-radius-sm); margin:1px 6px; padding:8px 10px; font-size:13px; color:var(--p-text2); }
.prod aside button.active { background:var(--p-accent-soft); color:var(--p-accent2); font-weight:600; }
.prod header { background:var(--p-surface); border-bottom:1px solid var(--p-border); }
.prod .pill { background:var(--p-surface); border:1px solid var(--p-border); border-radius:999px; color:var(--p-text2); }
/* cards & metrics */
.prod .card { background:var(--p-surface); border:1px solid var(--p-border); border-radius:var(--p-radius); box-shadow:var(--p-shadow); }
.prod .kpi { background:var(--p-surface); border:1px solid var(--p-border); border-radius:var(--p-radius); box-shadow:var(--p-shadow); padding:12px 14px; }
.prod .kpi .l { color:var(--p-text3); font-size:11px; text-transform:uppercase; letter-spacing:.04em; }
.prod .kpi .v { font-size:20px; font-weight:700; color:var(--p-text); }
.prod table { background:var(--p-surface); border:1px solid var(--p-border); border-radius:var(--p-radius); overflow:hidden; }
.prod table th { background:#f8fafc; color:var(--p-text2); font-size:11px; text-transform:uppercase; letter-spacing:.04em; border-bottom:1px solid var(--p-border); }
.prod table td { border-bottom:1px solid #eef1f6; font-size:13px; }
/* badges */
.prod .badge { border-radius:999px; padding:2px 9px; font-size:11px; font-weight:600; }
.prod .badge.ok { background:#e8f7ee; color:#15803d; }
.prod .badge.warn { background:#fef4e6; color:#b45309; }
.prod .badge.bad { background:#fdecec; color:#b91c1c; }
.prod .badge.info { background:#e6f4f8; color:#0e7490; }
.prod .badge.grey { background:#f1f3f6; color:#64748b; }
/* states */
.prod .state-empty, .prod .state-loading, .prod .state-error, .prod .state-degraded, .prod .state-unavailable, .prod .state-permission {
  border:1px dashed var(--p-border2); border-radius:var(--p-radius); padding:22px 18px; text-align:center; color:var(--p-text3); background:var(--p-surface); font-size:13px;
}
.prod .state-error { border-color:#fca5a5; color:#b91c1c; background:#fff5f5; }
.prod .state-degraded { border-color:#fcd34d; color:#92400e; background:#fffbeb; }
.prod .state-unavailable { border-color:var(--p-border2); color:var(--p-text3); }
.prod .state-permission { border-color:#c7d2fe; color:#4338ca; background:#eef2ff; }
/* toast */
.prod-toast { position:fixed; top:18px; right:18px; z-index:400; background:var(--p-surface); border:1px solid var(--p-border); border-left:4px solid var(--p-accent); border-radius:var(--p-radius-sm); box-shadow:var(--p-shadow-lg); padding:10px 16px; font-size:13px; max-width:360px; }
.prod-toast.ok { border-left-color:var(--p-ok); } .prod-toast.bad { border-left-color:var(--p-bad); }
/* modal */
.prod-modal { position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:300; display:flex; align-items:center; justify-content:center; }
.prod-modal .box { background:var(--p-surface); border-radius:var(--p-radius); box-shadow:var(--p-shadow-lg); max-width:560px; width:92%; max-height:86vh; overflow:auto; }
/* enterprise login */
.prod-login { position:fixed; inset:0; z-index:250; background:var(--p-bg); display:flex; align-items:center; justify-content:center; }
.prod-login .panel { width:400px; background:var(--p-surface); border:1px solid var(--p-border); border-radius:16px; box-shadow:var(--p-shadow-lg); padding:34px; }
.prod-login .brand { font-size:22px; font-weight:800; color:var(--p-text); }
.prod-login .tagline { font-size:12px; color:var(--p-text3); margin-top:2px; }
.prod-login .desc { font-size:12px; color:var(--p-text2); margin:14px 0; line-height:1.6; }
.prod-login input { width:100%; padding:10px 12px; border:1px solid var(--p-border2); border-radius:var(--p-radius-sm); font-size:14px; margin:6px 0; }
.prod-login input:focus { outline:2px solid var(--p-accent-soft); border-color:var(--p-accent); }
.prod-login .btn { width:100%; padding:11px; background:var(--p-accent); color:#fff; border:none; border-radius:var(--p-radius-sm); font-size:14px; font-weight:600; cursor:pointer; }
.prod-login .btn:disabled { opacity:.55; cursor:default; }
.prod-login .notice { font-size:11px; color:var(--p-text3); margin-top:14px; line-height:1.6; border-top:1px solid var(--p-border); padding-top:12px; }
.prod-login .err { color:var(--p-bad); font-size:12px; margin-top:8px; min-height:16px; }
/* topbar */
.prod-topbar { display:flex; align-items:center; gap:10px; }
.prod-search { width:280px; padding:7px 12px; border:1px solid var(--p-border2); border-radius:999px; font-size:13px; }
.prod-search:focus { outline:2px solid var(--p-accent-soft); border-color:var(--p-accent); }
/* breadcrumb */
.prod-breadcrumb { font-size:11px; color:var(--p-text3); margin-bottom:6px; }
.prod-breadcrumb b { color:var(--p-text2); font-weight:600; }
/* page header */
.prod-pageheader h2 { margin:0; font-size:19px; font-weight:700; }
.prod-pageheader .sub { color:var(--p-text3); font-size:12px; }
/* a11y */
.prod button:focus-visible, .prod input:focus-visible, .prod a:focus-visible { outline:2px solid var(--p-accent); outline-offset:2px; }
.prod [aria-hidden="true"] { display:none; }
/* responsive */
@media (max-width: 1024px) { .prod aside { width:200px; } .prod-search { width:180px; } }
@media (max-width: 768px) {
  body.prod { flex-direction:column; }
  .prod aside { width:100%; max-height:38vh; overflow-y:auto; flex:none; }
  .prod main { margin-left:0; }
  .prod .grid.kpis { grid-template-columns:repeat(2,1fr); }
  .prod-search { width:130px; }
}
@media (min-width: 1440px) { .prod main { padding:22px 28px; } }

/* 0.3.2.2 — HUMAN CEO refinement patch. Layout baseline preserved; interaction density and feedback improved. */
.prod { --p-sidebar:236px; --p-topbar:58px; }
.prod aside { width:var(--p-sidebar); min-width:var(--p-sidebar); height:100vh; position:sticky; top:0; overflow-y:auto; scrollbar-width:thin; }
.prod aside button { width:calc(100% - 12px); text-align:left; transition:background .14s ease,color .14s ease,transform .14s ease; }
.prod aside button:hover { background:#f4f7fb; color:var(--p-text); transform:translateX(1px); }
.prod aside button.active { box-shadow:inset 3px 0 0 var(--p-accent); }
.prod header { min-height:var(--p-topbar); position:sticky; top:0; z-index:90; box-shadow:0 1px 0 rgba(15,23,42,.02); }
.prod #content { max-width:1680px; margin:0 auto; }
.prod .card { padding:16px; transition:box-shadow .16s ease,border-color .16s ease; }
.prod .card:hover { border-color:#d8dee8; box-shadow:0 3px 12px rgba(15,23,42,.055); }
.prod .grid.kpis { gap:10px; }
.prod .kpi { min-height:82px; display:flex; flex-direction:column; justify-content:center; }
.prod .kpi .v { font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.prod table { width:100%; border-collapse:separate; border-spacing:0; }
.prod table th { position:sticky; top:0; z-index:2; white-space:nowrap; }
.prod table tr:hover td { background:#fafcff; }
.prod table td { vertical-align:middle; }
.prod .action { min-height:32px; border:1px solid var(--p-border2); border-radius:7px; background:#fff; color:var(--p-text2); cursor:pointer; transition:all .14s ease; }
.prod .action:hover:not(:disabled) { border-color:#b9c6db; color:var(--p-accent2); background:#f8fbff; }
.prod .action:disabled { cursor:not-allowed; opacity:.52; }
.prod .subnav { display:flex; gap:5px; flex-wrap:wrap; padding:6px; background:#eef2f7; border-radius:9px; margin-bottom:12px; }
.prod .subnav button { border:0; background:transparent; border-radius:6px; padding:7px 10px; cursor:pointer; color:var(--p-text2); }
.prod .subnav button.active { background:#fff; color:var(--p-accent2); box-shadow:var(--p-shadow); font-weight:600; }
.prod input,.prod select,.prod textarea { border:1px solid var(--p-border2); border-radius:7px; background:#fff; color:var(--p-text); }
.prod input:focus,.prod select:focus,.prod textarea:focus { outline:2px solid var(--p-accent-soft); border-color:var(--p-accent); }
.prod .filters { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:10px 0; }
.prod .state-empty,.prod .state-loading,.prod .state-error,.prod .state-degraded,.prod .state-unavailable,.prod .state-permission { min-height:96px; display:flex; align-items:center; justify-content:center; flex-direction:column; line-height:1.6; }
.prod .state-loading::before { content:""; width:18px; height:18px; margin-bottom:8px; border:2px solid #dce4ef; border-top-color:var(--p-accent); border-radius:50%; animation:pSpin .8s linear infinite; }
@keyframes pSpin { to { transform:rotate(360deg); } }

/* command/status strip injected by 0.3.2.2 runtime layer */
.prod-command-strip { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; padding:9px 12px; background:#fff; border:1px solid var(--p-border); border-radius:9px; box-shadow:var(--p-shadow); }
.prod-command-strip .pcs-left,.prod-command-strip .pcs-right { display:flex; align-items:center; gap:8px; min-width:0; }
.prod-command-strip .pcs-title { font-size:12px; color:var(--p-text2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prod-command-strip .pcs-time { font-size:11px; color:var(--p-text3); font-variant-numeric:tabular-nums; }
.prod-status-dot { width:7px; height:7px; border-radius:50%; background:var(--p-grey); box-shadow:0 0 0 3px #f1f5f9; }
.prod-status-dot.ok { background:var(--p-ok); box-shadow:0 0 0 3px #e8f7ee; }
.prod-status-dot.warn { background:var(--p-warn); box-shadow:0 0 0 3px #fef4e6; }
.prod-status-dot.bad { background:var(--p-bad); box-shadow:0 0 0 3px #fdecec; }
.prod-version-chip { padding:3px 7px; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:10px; font-weight:700; letter-spacing:.02em; }
.prod-nav-filter { margin:8px 8px 4px; width:calc(100% - 16px); box-sizing:border-box; padding:7px 9px; font-size:12px; border:1px solid var(--p-border); border-radius:7px; background:#f8fafc; }
.prod-nav-filter:focus { background:#fff; }
.prod-toast-stack { position:fixed; right:18px; top:18px; z-index:450; display:flex; flex-direction:column; gap:8px; width:min(380px,calc(100vw - 36px)); pointer-events:none; }
.prod-toast-stack .prod-toast { position:relative; top:auto; right:auto; width:auto; max-width:none; pointer-events:auto; animation:pToastIn .18s ease-out; }
@keyframes pToastIn { from { transform:translateY(-6px); opacity:0; } to { transform:none; opacity:1; } }
.prod-login .panel { width:min(420px,calc(100vw - 32px)); }
.prod-login .brand::before { content:"◆"; color:var(--p-accent); margin-right:8px; font-size:16px; vertical-align:2px; }

@media (max-width: 1024px) { .prod { --p-sidebar:206px; } .prod-command-strip { align-items:flex-start; } }
@media (max-width: 768px) {
  .prod aside { position:relative; width:100%; height:auto; max-height:40vh; }
  .prod-command-strip { flex-direction:column; }
  .prod-command-strip .pcs-right { width:100%; justify-content:space-between; }
  .prod .subnav { overflow-x:auto; flex-wrap:nowrap; }
  .prod .subnav button { white-space:nowrap; }
}

.prod-lang-select{min-width:116px;background:#fff;cursor:pointer}.prod-topbar{flex-wrap:nowrap!important}.prod-topbar .prod-search{min-width:320px}