/* PlanFlow Internal - USERS module (module-owned, Rule 15). NEW 2026-07-10.
   Planner command module: stat strip, filter toolbar, dense account table, and the
   channel-strip drawer. Uses design-system tokens; owns only its layout. */

/* stat strip - compact joined boxes (denser than the shared .tiles) */
.u-stats{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.u-stat{flex:1 1 0;min-width:110px;padding:11px 16px;border-right:1px solid var(--line);}
.u-stat:last-child{border-right:0;}
.u-stat .k{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);}
.u-stat .v{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:3px;}
.u-stat .v small{font-size:12px;font-weight:600;}

/* toolbar */
.u-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;}
.u-toolbar input{flex:1;min-width:220px;max-width:360px;border:1px solid var(--line);
  border-radius:var(--r);padding:8px 12px;font:500 13.5px system-ui;color:var(--ink);outline:none;}
.u-toolbar input:focus{border-color:var(--teal);}
.u-fchip{border:1px solid var(--line);background:#fff;color:var(--ink);font:600 12.5px system-ui;
  padding:7px 13px;border-radius:999px;cursor:pointer;}
.u-fchip.on{background:var(--ink);border-color:var(--ink);color:#fff;}

/* table extras */
.u-who{font-weight:700;}
.u-sub{font-size:12px;font-weight:600;}
.u-num{font-variant-numeric:tabular-nums;text-align:right;}
.u-mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;font-weight:600;}
.u-empty td{font-weight:600;padding:18px 10px;}
.u-open{border:1px solid var(--line);background:#fff;color:var(--teal);font:600 11.5px system-ui;
  padding:4px 9px;border-radius:6px;cursor:pointer;white-space:nowrap;}
.u-open:hover{background:var(--teal-wash);}

/* channel-strip drawer */
.u-scrim{position:fixed;inset:0;background:rgba(15,23,42,.45);opacity:0;pointer-events:none;transition:opacity .18s;z-index:40;}
.u-scrim.on{opacity:1;pointer-events:auto;}
.u-drawer{position:fixed;top:0;right:-580px;width:560px;max-width:96vw;height:100vh;background:#fff;
  box-shadow:-12px 0 40px rgba(15,23,42,.25);transition:right .22s ease;z-index:50;display:flex;flex-direction:column;}
.u-drawer.on{right:0;}
.u-dhead{border-bottom:2px solid var(--ink);padding:16px 22px 13px;}
.u-dhead .lab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);}
.u-dhead h2{margin:3px 0 6px;font-size:18px;font-weight:800;word-break:break-all;}
.u-dhead .meta{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;font-weight:600;}
.u-dclose{position:absolute;top:14px;right:16px;border:1px solid var(--line);background:#fff;
  width:30px;height:30px;border-radius:8px;font-size:14px;cursor:pointer;color:var(--ink);}
.u-dbody{overflow-y:auto;padding:16px 22px 30px;flex:1;}

.u-usage{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:14px;}
.u-usage .u{padding:10px 12px;border-right:1px solid var(--line);}
.u-usage .u:last-child{border-right:0;}
.u-usage .uk{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);}
.u-usage .uv{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px;}

.u-strip{border:1px solid var(--line);border-radius:var(--r);margin:0 0 14px;overflow:hidden;}
.u-striphead{display:flex;align-items:center;justify-content:space-between;background:var(--strip);
  padding:8px 14px;border-bottom:1px solid var(--line);}
.u-striphead .t{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);}
.u-stripbody{padding:13px 14px;}
.u-seg{display:flex;background:var(--strip);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px;}
.u-seg button{flex:1;border:0;background:none;font:700 12px system-ui;color:var(--ink);
  padding:7px 4px;border-radius:999px;cursor:pointer;white-space:nowrap;}
.u-seg button.on{background:var(--teal);color:#fff;}
.u-kvrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);}
.u-kvrow:last-child{border-bottom:0;}
.u-kvrow .k2{font-weight:600;font-size:12.5px;}
.u-kvrow .v2{font-weight:700;font-size:13px;text-align:right;}
.u-actgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.u-mini{border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:9px 12px;
  font:700 12.5px system-ui;color:var(--teal);cursor:pointer;text-align:center;}
.u-mini:hover{background:var(--teal-wash);}
.u-auditrow{display:flex;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:12.5px;}
.u-auditrow:last-child{border-bottom:0;}
.u-auditrow .when{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:var(--teal);font-weight:600;flex:none;width:112px;}
.u-danger{border:1px solid #fecaca;background:#fef7f7;border-radius:var(--r);padding:13px 14px;}
.u-danger .t{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--down);margin-bottom:8px;}
.u-danger p{margin:0;font-size:12.5px;font-weight:600;}
.u-danger .dz{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.u-danger .btn{background:var(--down);border-color:var(--down);}

@media (max-width:960px){
  .u-usage{grid-template-columns:repeat(2,1fr);}
  .u-drawer{width:100vw;}
}
