/* ============================================================
   CUSTOMER CONSOLE · global icon sizing + responsive (loaded last)
   ============================================================ */

/* ============ SVG ICON SIZING (feather set, same as admin) ============ */
.cu-menu{display:grid;place-items:center;padding:0}
.cu-upsell-ico svg{width:22px;height:22px}
.cu-memchip svg{width:13px;height:13px;flex:none}
.btn svg{flex:none}
.cu-tab{display:inline-flex;align-items:center;gap:5px}
.slot{display:inline-flex;align-items:center;justify-content:center}
.cu-kpi .k-ico svg{width:18px;height:18px;display:block}
.cu-chan-ico svg{width:18px;height:18px;display:block}
.cu-locked .ico svg{width:18px;height:18px}
.cu-empty svg{width:26px;height:26px;opacity:.6}
.exp-row .ico svg,.jr-loss-row .ico svg{width:16px;height:16px}
.vt-ico svg{width:17px;height:17px}
.vt-banner svg{width:16px;height:16px;flex:none}
.vt-acts .btn svg{width:14px;height:14px}
.dp-ico svg{width:19px;height:19px}
.dp-meta span{display:inline-flex;align-items:center;gap:5px}
.dp-meta svg{width:13px;height:13px;opacity:.8}
.dp-foot .cu-tab{gap:6px}
.bd-leg svg{width:13px;height:13px;flex:none;opacity:.85}
.cal-prov .g-ico svg{width:18px;height:18px}
.gp-row .sym .ico svg{width:15px;height:15px}
.lv-off-ico svg{width:24px;height:24px}
.lv-viewers svg{width:12px;height:12px;flex:none}
.ap-banner .ico svg{width:22px;height:22px}
.kc-ctrl svg{width:15px;height:15px;flex:none}
.kc-tabs .t{display:flex;align-items:center;justify-content:center;gap:5px}
.kc-qo span{display:inline-flex;align-items:center;gap:6px}
.hand-flag{display:grid;place-items:center}
.hand-flag svg{width:11px;height:11px;stroke-width:2.4}
.fx-swap{display:grid;place-items:center;padding:0}
.tv-pin svg{width:12px;height:12px;vertical-align:-2px}
.news-i .ico,.fx-sel option{font:inherit}
.nt-card .pin svg,.exp-row .del svg,.nt-time .del svg{display:block}
.td-item .acts div{display:grid;place-items:center}
.cu-ro,.cu-locked,.ap-banner,.vc-note{display:flex;align-items:center}

.card-title svg{width:15px;height:15px;vertical-align:-3px;margin-right:3px}
.cat-chip{display:inline-flex;align-items:center;gap:5px}
.cl-chip{display:inline-flex;align-items:center;gap:4px}
.cl-tile-name em svg{width:11px;height:11px;stroke-width:2.2;vertical-align:-1.5px}
.lv-note svg,.cu-ro svg{vertical-align:-3px;margin-right:5px;flex:none}
.tag{display:inline-flex;align-items:center;gap:5px}
.rx{display:inline-flex;align-items:center;gap:4px}
.vip-tag{display:inline-flex;align-items:center;justify-content:center}
.vip-tag svg{width:10px;height:10px}
.mo-growth td svg{width:12px;height:12px;vertical-align:-2px}
.nt-card .pin,.nt-time .del,.exp-row .del,.td-item .acts div{display:grid;place-items:center}
.cu-locked .ico{display:grid;place-items:center;flex:none}
.ap-acts .btn,.dp-foot .btn{display:inline-flex;align-items:center;gap:6px}
.kc-chat-in .btn,.cu-composer .btn{flex:none}
/* scroll containers are flex columns — cards must never shrink to fit */
.cu-msgs>*,.tv-msgs>*,.rm-msgs>*,.kc-panel>*{flex-shrink:0}
.sig-cell b,.k-val{overflow-wrap:anywhere}

/* ============ RESPONSIVE ============ */
@media(max-width:1100px){
  .mo-calc,.td-grid,.gp-detail-grid{grid-template-columns:1fr}
  .cu-grid2,.cu-grid2b{grid-template-columns:1fr}
  .tv-wrap,.rm-grid,.kc-grid{grid-template-columns:1fr;height:auto}
  .tv-chatbox,.rm-chatbox,.kc-right{height:340px}
}
@media(max-width:900px){
  .cu-app{grid-template-columns:1fr}
  .cu-side{position:fixed;left:0;top:0;bottom:0;width:264px;transform:translateX(-105%);transition:transform .25s ease;box-shadow:0 0 60px rgba(0,0,0,.5)}
  .cu-side.open{transform:none}
  .cu-menu{display:grid;place-items:center}
  .cu-title span{display:none}
  .cu-content{padding:13px 12px 26px}
  .cu-player{margin-bottom:62px;height:60px;padding:0 12px;gap:10px}
  .cu-bottom{
    display:flex;position:fixed;left:0;right:0;bottom:0;height:62px;z-index:60;
    background:var(--topbar-bg);backdrop-filter:blur(14px);border-top:1px solid var(--border);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
  }
  .cu-bottom a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:9.5px;color:var(--dim);border-radius:11px;cursor:pointer;transition:.13s;user-select:none}
  .cu-bottom a svg{width:19px;height:19px;stroke-width:1.9}
  .cu-bottom a.on{color:var(--gold);background:rgba(240,180,41,.1)}
  .cu-chat{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);height:calc(100vh - 60px - 84px)}
  .cu-chans{max-height:158px}
  .cu-chan-list{display:flex;gap:5px;overflow-x:auto;padding:7px}
  .cu-chan{flex:none;min-width:148px}
  .cu-sep{display:none}
  .cu-rooms{display:flex;gap:5px;overflow-x:auto;padding:0 7px 7px}
  .cu-room{flex:none;min-width:150px;background:var(--bg-2)}
  .cu-search{width:120px}
  .bub{max-width:88%}
  .sig,.post{width:100%}
  .tr-row{grid-template-columns:54px 1fr 58px 66px;row-gap:4px}
  .tr-row .hide-m{display:none}
  .gp-row{grid-template-columns:1.2fr 1fr .9fr auto;row-gap:4px}
  .gp-row .hide-m{display:none}
  .ap-card{flex-wrap:wrap}
  .ap-acts{width:100%;justify-content:flex-start}
  .cu-top{padding:0 12px;gap:9px}
  .cu-title h1{font-size:15px}
  .fx-line{flex-wrap:wrap}
  .fx-line .input{order:-1;flex-basis:100%}
}
@media(max-width:560px){
  .cu-kpis{grid-template-columns:1fr 1fr}
  .cu-player .pl-live{display:none}
  .cu-player .pl-vol input[type=range]{width:60px}
  .cu-kpi .k-val{font-size:18px}
  .post-card{grid-template-columns:1fr 1fr}
  .mo-out .big{font-size:38px}
  .tv-price b{font-size:16px}
  .cu-memchip{padding:5px 9px;font-size:10.5px}
}