:root{
  --bg:#090d12;
  --sidebar:#0a0f15;
  --panel:#0e141b;
  --panel-2:#111923;
  --line:#222b36;
  --text:#eef3f8;
  --muted:#8d98a7;
  --accent:#2e9bff;
  --accent-soft:#142d42;
  --danger:#ff6677;
  --success:#5ad19a;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
.hidden{display:none!important}
.muted{color:var(--muted)}
.small{font-size:12px}
.error-text{color:#ff8491;font-size:12px;min-height:18px}
.btn{
  border:1px solid var(--line);background:#111821;color:#fff;border-radius:10px;
  padding:9px 13px;font-weight:750;font-size:13px;cursor:pointer
}
.btn:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.primary{background:var(--accent);border-color:var(--accent)}
.btn.subtle{background:#0e151d}
.btn.discord{background:#5865F2;border-color:#6874f5;color:#fff}
.btn.discord:hover{filter:brightness(1.08)}
.btn.wide{width:100%}
.discord-mark{font-size:15px;margin-right:6px}
.auth-divider{display:flex;align-items:center;gap:10px;color:#6f7b88;font-size:10px;text-transform:uppercase;letter-spacing:.08em;margin:18px 0}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}
.pending-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;margin:4px auto 8px;background:#132f25;border:1px solid #245e48;color:#68d8a5;font-size:24px;font-weight:900}
.pending-icon.declined{background:#35181d;border-color:#73333e;color:#ff9ca7}
.waiting-card{text-align:center}
.waiting-identity{font-size:12px;color:#a9b6c4;background:#0a1118;border:1px solid var(--line);border-radius:9px;padding:10px;margin:16px 0}
.waiting-logout{margin-top:9px}
.brand{display:flex;align-items:center;gap:10px}
.brand strong{display:block;font-size:14px}
.brand span{display:block;font-size:11px;color:var(--muted);margin-top:1px}
.brand.large{justify-content:center;margin-bottom:20px}
.brand.large strong{font-size:18px}
.brand.large span{font-size:12px}
.logo{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  overflow:hidden;background:#07090d;border:1px solid #263445;
  box-shadow:0 0 0 1px rgba(255,255,255,.02),0 0 16px rgba(67,163,255,.12)
}
.logo img{
  width:100%;height:100%;display:block;object-fit:cover
}
.brand.large .logo{
  width:58px;height:58px;border-radius:15px
}

/* auth */
.auth-view{min-height:100vh;display:grid;place-items:center;padding:22px}
.auth-card{
  width:min(420px,100%);background:#0d141c;border:1px solid var(--line);
  border-radius:18px;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.35)
}
.auth-card h1{text-align:center;font-size:21px;margin:10px 0 4px}
.auth-card>p{text-align:center;margin:0 0 22px}
.auth-card label,.field label{display:block;font-size:12px;color:#9aa6b4;font-weight:750;margin:0 0 6px}
.auth-card input{margin-bottom:12px}

/* shell */
.app{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}
aside{
  background:var(--sidebar);border-right:1px solid var(--line);padding:18px 14px;
  position:sticky;top:0;height:100vh
}
aside nav{margin-top:24px}
.nav-item{
  display:flex;width:100%;align-items:center;gap:10px;border:0;background:transparent;
  color:var(--muted);padding:10px 12px;border-radius:9px;cursor:pointer;text-align:left
}
.nav-item.active,.nav-item:hover{background:#171f29;color:#fff}
.sidebar-bottom{
  position:absolute;bottom:16px;left:14px;right:14px;padding-top:14px;border-top:1px solid var(--line)
}
.user-email{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:7px}
.role-pill{
  display:inline-block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  color:#8fd0ff;background:#112638;border:1px solid #21415a;padding:4px 7px;border-radius:999px;margin-bottom:10px
}
main{padding:24px 28px 50px;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.eyebrow{font-size:10px;letter-spacing:.14em;color:#687687;font-weight:850}
h1{font-size:19px;margin:4px 0 0}
.filters{
  display:grid;grid-template-columns:150px 150px 175px 155px minmax(260px,1fr) auto;
  gap:10px;margin:14px 0 10px
}
.watchlist-filter-btn{
  display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;white-space:nowrap;
  background:#0d151e;border-color:#293645;color:#c6d1dc
}
.watchlist-filter-btn:hover{border-color:#5c5328;background:#17180f;color:#ffe79b}
.watchlist-filter-btn.active{
  color:#ffe27a;border-color:#7d6828;background:#2a230f;box-shadow:0 0 0 2px rgba(255,215,94,.07)
}
.watchlist-filter-star{font-size:15px;line-height:1;color:#ffd75e}
.watchlist-filter-count{
  min-width:22px;height:20px;padding:0 6px;display:inline-grid;place-items:center;border-radius:999px;
  background:#17222d;border:1px solid #2d3c4b;color:#aebbc8;font-size:10px;font-weight:850
}
.watchlist-filter-btn.active .watchlist-filter-count{background:#3a300f;border-color:#746125;color:#ffe27a}
input,select,textarea{
  width:100%;background:#0d131a;border:1px solid var(--line);color:var(--text);
  border-radius:10px;padding:10px 11px;outline:none
}
input:focus,select:focus,textarea:focus{border-color:#35668b}
.result-row{display:flex;justify-content:space-between;align-items:center;margin:9px 0 10px}
.count{font-size:12px;color:#7d8a99;font-weight:750}
.bulkbar{
  display:flex;align-items:center;gap:9px;background:#0d1720;border:1px solid #213549;
  border-radius:11px;padding:9px 11px;margin-bottom:11px
}
.bulk-count{margin-right:auto;font-size:12px;font-weight:800;color:#b6c9da}
.table-wrap{
  border:1px solid var(--line);border-radius:14px;overflow:auto;background:var(--panel)
}
table{border-collapse:collapse;width:100%;min-width:1150px}
th{
  position:sticky;top:0;background:#0c1218;color:#748294;font-size:10px;letter-spacing:.11em;
  text-align:left;font-weight:850;padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap
}
td{padding:13px 14px;border-bottom:1px solid #1c2530;font-size:13px;vertical-align:middle}
tbody tr:hover{background:#101821}
.check-col{width:44px}
.check{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}
.product-cell{display:flex;align-items:center;gap:11px;min-width:330px}
.thumb{
  width:44px;height:44px;border-radius:8px;background:#fff;border:1px solid #2b3540;object-fit:contain
}
.product-name{font-weight:800;margin-bottom:4px}
.ident-sub{font-size:10px;color:var(--muted);display:flex;gap:7px;flex-wrap:wrap}
.retailer{font-weight:750}
.tag{
  display:inline-block;padding:4px 8px;border-radius:999px;background:#132433;
  color:#9fd8ff;border:1px solid #213d54;font-size:10px;font-weight:800
}
.price{font-weight:850;white-space:nowrap}
.link{color:#9ed6ff;text-decoration:none;font-weight:800;white-space:nowrap}
.link:hover{text-decoration:underline}
.action-row{display:flex;gap:6px;flex-wrap:wrap}
.mini-btn{
  border:1px solid var(--line);background:#111821;color:#b8c3cf;border-radius:8px;
  padding:6px 8px;font-size:11px;cursor:pointer
}
.mini-btn.danger:hover{border-color:#71323a;color:#ff9ba5}
.empty{padding:36px;text-align:center;color:var(--muted)}

/* modals */
.modal-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.68);z-index:50;
  display:grid;place-items:center;padding:18px
}
.modal{
  width:min(780px,96vw);max-height:90vh;overflow:auto;background:#0d141c;
  border:1px solid #28333f;border-radius:16px;padding:20px;box-shadow:0 30px 80px rgba(0,0,0,.45)
}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}
.modal-head h2{margin:0;font-size:18px}
.x-btn{border:0;background:transparent;color:#8996a6;font-size:26px;cursor:pointer}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{margin-bottom:12px}
.field.span-2{grid-column:1/-1}
.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:12px}
.modal-actions.split{justify-content:space-between;align-items:center}
.modal-actions.split>div{display:flex;gap:8px}
.checklist{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 16px
}
.check-option{
  display:flex;align-items:center;gap:8px;padding:9px 10px;background:#101720;
  border:1px solid var(--line);border-radius:9px;font-size:12px;font-weight:750
}
.check-option input{width:auto;margin:0}
.preview{
  min-height:180px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;line-height:1.5;background:#080d12
}
.toast{
  position:fixed;right:18px;top:18px;z-index:100;background:#16212b;border:1px solid #2c3c4b;
  color:#eef6ff;border-radius:10px;padding:10px 13px;font-size:12px;box-shadow:0 8px 30px rgba(0,0,0,.3);
  transform:translateY(-12px);opacity:0;pointer-events:none;transition:.2s
}
.toast.show{transform:translateY(0);opacity:1}
.toast.error{border-color:#6f3039;color:#ffacb4}


/* admin members */
.member-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,180px));
  gap:10px;
  margin:4px 0 14px;
}
.summary-card{
  background:#0e151d;
  border:1px solid var(--line);
  border-radius:12px;
  padding:13px 15px;
}
.summary-label{
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:750;
  margin-bottom:4px;
}
.summary-card strong{font-size:22px}
.member-toolbar{
  display:grid;
  grid-template-columns:minmax(260px,1fr) 210px;
  gap:10px;
  margin-bottom:11px;
}
.members-table{min-width:800px}
.member-identity{display:flex;align-items:center;gap:10px;min-width:260px}
.member-avatar{
  width:34px;height:34px;border-radius:50%;
  background:#152334;border:1px solid #28445e;
  display:grid;place-items:center;color:#a9dcff;font-weight:900
}
.member-email{font-weight:800}
.member-status{
  display:inline-flex;align-items:center;
  border-radius:999px;padding:4px 8px;
  font-size:10px;font-weight:850
}
.status-pending{background:#342812;color:#ffd778;border:1px solid #5b4720}
.status-approved{background:#133126;color:#83e5b5;border:1px solid #26533f}
.status-declined{background:#35181d;color:#ff9ca7;border:1px solid #73333e}
.status-admin{background:#142e45;color:#9bd8ff;border:1px solid #27516f}
.inline-role{margin:0}
.mini-btn.approve{border-color:#285d47;color:#94e6bd}
.mini-btn.decline{border-color:#71323a;color:#ff9ba5}
.mini-btn.pending{border-color:#665020;color:#ffd778}
.members-note{font-size:11px;color:var(--muted);margin-top:12px}
.member-avatar-stack{position:relative;width:38px;min-width:38px;height:38px}
.member-avatar-stack .member-avatar{width:38px;height:38px}
.member-avatar-img{display:block;object-fit:cover;background:#111b26}
.member-identity-copy{min-width:0;display:grid;gap:2px}
.member-discord-name{color:#7cc9ff;font-size:11px;font-weight:800}
.member-email-sub{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.member-discord-id{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em}
.member-link-note{margin-top:3px;color:#83e5b5;font-size:10px;font-weight:750}
.member-match-warning{margin-top:4px;max-width:390px;padding:5px 7px;border:1px solid #665020;border-radius:7px;background:#2d2514;color:#ffd778;font-size:9px;line-height:1.35;font-weight:750}
@media(max-width:800px){
  .member-summary{grid-template-columns:1fr 1fr}
  .members-table .mini-btn{min-height:36px;padding:8px 10px}
  .members-table .action-row{min-width:180px}
  .member-toolbar{grid-template-columns:1fr}
}


/* quick product importer */
.import-box{
  margin:0 0 16px;
  padding:14px;
  background:#0b1822;
  border:1px solid #24435b;
  border-radius:12px;
}
.import-box-head{margin-bottom:10px}
.import-box-head strong{display:block;font-size:13px}
.import-box-head span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.import-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:9px;
}
.import-status{
  min-height:18px;
  margin-top:8px;
  font-size:11px;
  color:var(--muted);
}
.import-status.success{color:#83e5b5}
.import-status.warning{color:#ffd778}
.import-status.error{color:#ff9ca6}
.import-status.loading{color:#9ed6ff}
@media(max-width:650px){
  .import-row{grid-template-columns:1fr}
}

@media(max-width:1050px){
  .filters{grid-template-columns:1fr 1fr 1fr}
  .filters .search{grid-column:1/-1}
  .filters .watchlist-filter-btn{min-height:42px}
}
@media(max-width:800px){
  .app{grid-template-columns:1fr}
  aside{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}
  aside nav{display:none}
  .sidebar-bottom{position:static;margin-top:12px;display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center}
  .sidebar-bottom .btn{width:auto}
  main{padding:17px}
  .filters{grid-template-columns:1fr 1fr}
  .filters .search{grid-column:1/-1}
  .topbar{align-items:flex-end}
  .form-grid,.checklist{grid-template-columns:1fr}
  .field.span-2{grid-column:auto}
  .modal-actions.split{display:block}
  .modal-actions.split>div{margin-top:8px;justify-content:flex-end}
}


/* bulk add */
.top-actions{display:flex;gap:8px;align-items:center}
.bulk-add-modal{width:min(980px,96vw)}
.bulk-format-example{
  display:grid;gap:5px;margin:0 0 14px;padding:10px 12px;
  background:#0a1118;border:1px solid var(--line);border-radius:10px
}
.bulk-format-example strong{font-size:11px;color:#9aa6b4}
.bulk-format-example code{
  display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#a9d8f8;font-size:11px
}
.bulk-url-input{
  min-height:180px;resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px;line-height:1.55
}
.bulk-import-actions{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-4px
}
.bulk-import-actions .import-status{flex:1;margin:0}
.bulk-review-wrap{margin-top:16px}
.bulk-review-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:8px
}
.bulk-review-table-wrap{max-height:360px}
.bulk-review-table{min-width:820px}
.bulk-product-cell{min-width:410px}
.bulk-name-input{width:100%;min-width:280px;padding:7px 8px}
.bulk-price-input{width:110px;padding:7px 8px}

.bulk-product-preview{display:flex;align-items:center;gap:10px;min-width:0}
.bulk-photo-wrap{
  width:58px;height:58px;flex:0 0 58px;border:1px solid var(--line);
  border-radius:9px;background:#fff;overflow:hidden;display:flex;align-items:center;justify-content:center
}
.bulk-product-photo{width:100%;height:100%;object-fit:contain;display:block}
.bulk-photo-empty{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:9px;line-height:1.1;font-weight:800;text-transform:uppercase;color:#66717e;background:#0b1219
}
.bulk-product-meta{min-width:0;flex:1}

.bulk-ident{font-size:11px;font-weight:800;color:#b9d9f0;white-space:nowrap}
.bulk-error-row{background:#1b1114}
.bulk-error-title{font-size:11px;font-weight:800;max-width:640px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:650px){
  .top-actions{flex-wrap:wrap;justify-content:flex-end}
  .bulk-photo-wrap{width:48px;height:48px;flex-basis:48px}
  .bulk-import-actions{align-items:stretch;flex-direction:column}
}


/* bulk delete */
.btn.danger{
  border-color:#5a2931;
  color:#ff8794;
  background:#1a1013;
}
.btn.danger:hover{
  border-color:#8a3a46;
  color:#ffb0b8;
  background:#251318;
}

/* v10: compact mobile catalog + product detail */
.product-table-wrap tbody tr[data-product-id]{cursor:pointer}
.product-table-wrap tbody tr[data-product-id]:hover .product-name{color:#b8e2ff}

.mobile-product-list{display:none}
.mobile-list-shell{
  border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#0b1117
}
.mobile-list-head{
  display:grid;grid-template-columns:32px 68px minmax(0,1fr) auto;gap:10px;align-items:center;
  min-height:52px;padding:0 14px;border-bottom:1px solid var(--line);background:#0c1218;
  color:#748294;font-size:10px;letter-spacing:.12em;font-weight:850
}
.mobile-list-head .mobile-head-product{grid-column:2/4}
.mobile-list-head .mobile-head-retailer{text-align:right}
.mobile-product-row{
  display:grid;grid-template-columns:32px 68px minmax(0,1fr) auto;gap:10px;align-items:center;
  min-height:104px;padding:13px 14px;border-bottom:1px solid #1c2530;cursor:pointer;
  transition:background .15s ease
}
.mobile-product-row:last-child{border-bottom:0}
.mobile-product-row:hover,.mobile-product-row:active{background:#101821}
.mobile-product-row.selected-mobile-product-row{
  background:#10283a;
  box-shadow:inset 4px 0 0 var(--accent)
}
.mobile-product-row.selected-mobile-product-row:active{background:#123149}
.mobile-product-detail-trigger{cursor:pointer}
.mobile-product-title.mobile-product-detail-trigger{color:#eef7ff}
.mobile-product-title.mobile-product-detail-trigger:active{color:#8fd1ff}
.mobile-row-check{width:18px;height:18px;margin:0;accent-color:var(--accent);cursor:pointer}
.mobile-product-thumb{
  width:62px;height:62px;object-fit:contain;background:#fff;border:1px solid #2b3540;border-radius:11px
}
.mobile-product-info{min-width:0}
.mobile-product-title{
  font-weight:800;font-size:14px;line-height:1.28;margin-bottom:7px;overflow:hidden;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2
}
.mobile-product-meta{display:flex;align-items:center;gap:6px;min-width:0;color:#758292;font-size:11px}
.mobile-product-id{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mobile-copy-btn{
  flex:0 0 auto;border:0;background:transparent;color:#758292;padding:2px 4px;cursor:pointer;font-size:15px;line-height:1
}
.mobile-copy-btn:hover{color:#cde8fb}
.mobile-retailer{
  max-width:86px;text-align:right;color:#bdc6d0;font-size:12px;font-weight:750;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis
}

/* Detail page */
.detail-backbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.detail-back{
  display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#101720;color:#dbe5ef;
  border-radius:10px;padding:9px 12px;font-weight:800;cursor:pointer
}
.detail-admin-actions{display:flex;gap:8px}
.detail-kicker{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#758292;font-weight:850;margin-bottom:12px}
.detail-title{font-size:clamp(25px,3.2vw,42px);line-height:1.08;letter-spacing:-.025em;margin:0;max-width:1000px}
.detail-primary-id{color:#7f8b99;font-size:16px;margin-top:12px}
.detail-actions{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr);gap:12px;max-width:760px;margin:25px 0 28px}
.detail-action-btn{
  min-height:54px;border-radius:999px;border:1px solid #303945;background:#11171d;color:#aab4bf;font-weight:850;
  display:flex;align-items:center;justify-content:center;gap:9px;text-decoration:none;cursor:pointer;padding:0 22px
}
.detail-action-btn.primary{background:#68b8f4;border-color:#68b8f4;color:#07131d}
.detail-action-btn.disabled{opacity:.45;pointer-events:none}
.detail-layout{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(360px,1.05fr);gap:24px;align-items:start}
.detail-image-card{
  position:relative;min-height:430px;border:1px solid #2a333d;background:#f1f3f5;border-radius:20px;overflow:hidden;
  display:grid;place-items:center;padding:34px
}
.detail-image-card img{width:100%;height:100%;max-height:520px;object-fit:contain;display:block}
.detail-image-caption{
  position:absolute;left:0;right:0;bottom:0;padding:54px 22px 20px;
  background:linear-gradient(transparent,rgba(8,12,16,.85));color:white
}
.detail-image-caption span{display:block;color:#93a0ad;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:850;margin-bottom:4px}
.detail-image-caption strong{font-size:18px}
.detail-info-card{background:#0e151d;border:1px solid var(--line);border-radius:18px;padding:20px}
.detail-info-title{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:#6f7c8a;font-weight:850;margin:0 0 10px}
.detail-info-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:start;padding:13px 0;border-bottom:1px solid #1c2530}
.detail-info-row:last-child{border-bottom:0}
.detail-info-label{color:#6f7c8a;font-size:12px;font-weight:750}
.detail-info-value{font-size:14px;font-weight:750;word-break:break-word}
.detail-info-value.price-value{font-size:20px;color:#f1f5f9}
.detail-info-value a{color:#9ed6ff;text-decoration:none}
.detail-info-value a:hover{text-decoration:underline}
.detail-notes{margin-top:18px;background:#0e151d;border:1px solid var(--line);border-radius:18px;padding:18px}
.detail-notes p{margin:8px 0 0;color:#b7c0ca;white-space:pre-wrap;line-height:1.55}

@media(max-width:800px){
  /* Make the phone view feel more like a native catalog rather than a squeezed desktop table. */
  .product-table-wrap{display:none}
  .mobile-product-list{display:block}
  main{padding:16px 16px 34px}
  .topbar{margin-bottom:14px}
  .filters{grid-template-columns:1fr 1fr;gap:9px}
  .filters select{min-height:48px;border-radius:14px;background:#0f151c}
  .filters .search{grid-column:1/-1;min-height:48px;border-radius:999px;padding-left:15px}
  .filters .watchlist-filter-btn{grid-column:1/2;min-height:44px;border-radius:12px}
  .filters #exportBtn{grid-column:2/3;justify-self:stretch;min-height:44px;border-radius:12px}
  .result-row{margin:9px 0 12px}
  .count{text-transform:uppercase;letter-spacing:.08em}
  .bulkbar{flex-wrap:wrap}
  .bulk-count{width:100%;margin-right:0}
  .mobile-list-head{grid-template-columns:28px 64px minmax(0,1fr) auto;padding:0 11px}
  .mobile-product-row{grid-template-columns:28px 64px minmax(0,1fr) auto;padding:12px 11px;gap:9px;min-height:100px}
  .mobile-product-thumb{width:58px;height:58px}
  .mobile-product-title{font-size:14px}
  .mobile-retailer{max-width:72px;font-size:11px}

  .detail-backbar{margin-bottom:18px}
  .detail-title{font-size:30px}
  .detail-primary-id{font-size:14px}
  .detail-actions{grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}
  .detail-action-btn{min-height:50px;padding:0 12px;font-size:13px}
  .detail-layout{grid-template-columns:1fr;gap:18px}
  .detail-image-card{min-height:350px;border-radius:18px;padding:24px}
  .detail-image-card img{max-height:410px}
  .detail-info-card{padding:16px}
  .detail-info-row{grid-template-columns:120px minmax(0,1fr);gap:12px;padding:12px 0}
}

@media(max-width:520px){
  .mobile-list-head,.mobile-product-row{grid-template-columns:26px 60px minmax(0,1fr)}
  .mobile-head-retailer,.mobile-retailer{display:none}
  .mobile-product-thumb{width:56px;height:56px}
  .detail-actions{grid-template-columns:1fr 1fr}
  .detail-action-btn{font-size:12px}
  .detail-image-card{min-height:310px}
  .detail-info-row{grid-template-columns:105px minmax(0,1fr)}
}

/* Mobile navigation drawer */
.mobile-appbar,.mobile-drawer-head,.mobile-menu-backdrop{display:none}
.mobile-menu-btn{
  width:48px;height:48px;border-radius:14px;border:1px solid var(--line);
  background:#10161e;display:grid;place-content:center;gap:5px;padding:0;cursor:pointer
}
.mobile-menu-btn span{display:block;width:22px;height:2px;border-radius:99px;background:#d7dde5}
body.menu-open{overflow:hidden}

@media(max-width:800px){
  .app{display:block;min-height:100vh}
  .mobile-appbar{
    display:flex;align-items:center;gap:16px;padding:14px 16px;min-height:76px;
    position:sticky;top:0;z-index:80;background:rgba(9,13,18,.96);
    border-bottom:1px solid var(--line);backdrop-filter:blur(12px)
  }
  .mobile-appbar strong{font-size:20px}
  .mobile-menu-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:89
  }
  .mobile-menu-backdrop:not(.hidden){display:block}
  #appSidebar{
    display:block;position:fixed;left:0;top:0;bottom:0;width:min(330px,88vw);height:100dvh;
    z-index:90;border-right:1px solid var(--line);border-bottom:0;padding:16px;
    transform:translateX(-105%);transition:transform .2s ease;overflow-y:auto;
    box-shadow:18px 0 50px rgba(0,0,0,.45)
  }
  #appSidebar.mobile-open{transform:translateX(0)}
  .mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
  .mobile-drawer-head span{font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
  #appSidebar nav{display:block;margin-top:22px}
  #appSidebar .sidebar-bottom{
    position:static;margin-top:24px;display:block;padding-top:16px;border-top:1px solid var(--line)
  }
  #appSidebar .sidebar-bottom .btn{width:100%}
  #appSidebar .user-email{margin-bottom:8px}
  #appSidebar .role-pill{margin-bottom:10px}
}


/* ACO */
.aco-security-note{
  display:flex;gap:10px;align-items:flex-start;
  padding:12px 14px;margin-bottom:12px;
  border:1px solid #24435b;background:#0b1822;border-radius:12px
}
.aco-security-note strong{font-size:12px;white-space:nowrap;color:#a9ddff}
.aco-security-note span{font-size:11px;color:var(--muted);line-height:1.45}
.aco-form-card{
  border:1px solid var(--line);background:var(--panel);
  border-radius:14px;padding:16px
}
.optional-label{font-weight:600;color:#6f7b88}
.aco-section-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin:4px 0 10px;padding-top:5px
}
.aco-section-head>div strong{display:block;font-size:13px}
.aco-section-head>div span{display:block;margin-top:2px}
.aco-items{display:grid;gap:9px}
.aco-item-card{
  display:grid;grid-template-columns:58px minmax(0,1fr) auto;
  gap:12px;align-items:center;background:#0b1118;border:1px solid #202a35;
  border-radius:12px;padding:11px
}
.aco-item-img{
  width:58px;height:58px;object-fit:contain;background:#fff;border:1px solid #2b3540;border-radius:9px
}
.aco-item-title{font-size:13px;font-weight:850;margin-bottom:3px}
.aco-item-meta{display:flex;gap:6px;flex-wrap:wrap;color:var(--muted);font-size:10px}
.aco-item-fields{
  display:grid;grid-template-columns:90px minmax(130px,180px);gap:8px;margin-top:9px
}
.aco-item-fields label span{
  display:block;font-size:9px;text-transform:uppercase;letter-spacing:.08em;
  color:#788493;font-weight:850;margin-bottom:4px
}
.aco-item-fields input{padding:7px 8px}
.aco-remove-btn{align-self:start}
.aco-empty{
  display:grid;justify-items:start;gap:5px;padding:22px;
  border:1px dashed #2a3642;border-radius:12px;color:var(--muted)
}
.aco-empty strong{color:#dbe4ed}
.aco-empty span{font-size:11px}
.aco-empty .btn{margin-top:5px}
.aco-notes-field{margin-top:14px}
.aco-submit-row{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding-top:4px
}
.aco-submit-row .import-status{margin:0;flex:1}
.aco-success-card{
  display:grid;grid-template-columns:46px minmax(0,1fr) auto;
  align-items:center;gap:12px;padding:18px;
  border:1px solid #285d47;background:#0e2119;border-radius:14px
}
.aco-success-icon{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:#17382a;color:#83e5b5;border:1px solid #2d634b;
  font-size:22px;font-weight:900
}
.aco-success-card strong{display:block;font-size:14px}
.aco-success-card p{margin:4px 0 0;color:#93a69b;font-size:11px;line-height:1.45}
.aco-admin-table{min-width:970px}
.aco-admin-products{font-weight:800;max-width:330px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-progress{background:#142e45;color:#9bd8ff;border:1px solid #27516f}
.status-declined{background:#35171d;color:#ff9ca6;border:1px solid #663039}
.aco-admin-modal{width:min(900px,96vw)}
.aco-detail-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px
}
.aco-detail-block{
  background:#0a1118;border:1px solid var(--line);border-radius:10px;padding:11px
}
.aco-detail-block>span{
  display:block;color:#7e8a98;font-size:9px;text-transform:uppercase;
  letter-spacing:.09em;font-weight:850;margin-bottom:4px
}
.aco-detail-block>strong{display:block;font-size:12px;overflow-wrap:anywhere}
.aco-detail-block>small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.aco-admin-items{
  border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:12px;background:#0b1118
}
.aco-admin-items .detail-info-title{margin-bottom:8px}
.aco-admin-item{
  display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;
  gap:10px;padding:9px 0;border-top:1px solid #1c2530
}
.aco-admin-item:first-of-type{border-top:0}
.aco-admin-item img{
  width:46px;height:46px;object-fit:contain;background:#fff;border-radius:8px;border:1px solid #2b3540
}
.aco-admin-item>div>strong{display:block;font-size:12px}
.aco-admin-item>div>span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.aco-admin-item-numbers{display:flex!important;gap:12px;text-align:right}
.aco-admin-item-numbers span{white-space:nowrap}
.aco-member-notes{
  padding:12px;background:#0a1118;border:1px solid var(--line);border-radius:10px;margin-bottom:14px
}
.aco-member-notes p{font-size:12px;line-height:1.5;color:#b9c4d0;margin:6px 0 0;white-space:pre-wrap}
.aco-admin-edit{margin-top:8px}
.aco-summary{margin-top:0}

@media(max-width:800px){
  .bulkbar{flex-wrap:wrap}
  .bulk-count{width:100%;margin:0 0 2px}
  .aco-item-card{grid-template-columns:54px minmax(0,1fr)}
  .aco-item-img{width:54px;height:54px}
  .aco-remove-btn{grid-column:1/-1;justify-self:end}
  .aco-item-fields{grid-template-columns:90px minmax(120px,1fr)}
  .aco-success-card{grid-template-columns:42px minmax(0,1fr)}
  .aco-success-card .btn{grid-column:1/-1;width:100%}
  .aco-detail-grid{grid-template-columns:1fr}
  .aco-admin-item{grid-template-columns:42px minmax(0,1fr)}
  .aco-admin-item-numbers{grid-column:2;justify-content:flex-start;text-align:left}
  .aco-submit-row{align-items:stretch;flex-direction:column}
  .aco-submit-row .btn{width:100%}
}


/* ACO v13 cleaner wizard + catalog picker */
.aco-landing{display:grid;gap:14px}
.aco-hero-card{
  display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;
  gap:16px;padding:22px;border:1px solid #263545;
  background:linear-gradient(145deg,#0e1722,#0a1118);border-radius:16px;
  box-shadow:0 14px 36px rgba(0,0,0,.2)
}
.aco-hero-icon{
  width:56px;height:56px;display:grid;place-items:center;border-radius:15px;
  background:#102538;border:1px solid #28506d;color:#9bddff;font-size:25px;font-weight:900
}
.aco-hero-copy h2{margin:3px 0 7px;font-size:22px;letter-spacing:-.02em}
.aco-hero-copy p{margin:0;max-width:720px;color:var(--muted);font-size:12px;line-height:1.55}
.aco-new-btn{min-width:150px}
.aco-how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.aco-how-card{
  position:relative;padding:16px;border:1px solid var(--line);border-radius:13px;background:#0b1118
}
.aco-how-card>span{
  width:26px;height:26px;display:grid;place-items:center;margin-bottom:10px;
  border-radius:8px;background:#132230;color:#a8ddff;border:1px solid #29465d;
  font-size:11px;font-weight:900
}
.aco-how-card strong{display:block;font-size:12px;margin-bottom:5px}
.aco-how-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.5}
.aco-privacy-strip{
  display:flex;gap:10px;align-items:center;padding:11px 13px;border:1px solid #263744;
  background:#0b151d;border-radius:11px
}
.aco-privacy-strip strong{color:#a9ddff;font-size:11px}
.aco-privacy-strip span{color:var(--muted);font-size:10px}

.aco-wizard-top{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.aco-wizard-top h2{margin:2px 0 0;font-size:20px}
.aco-back-link{
  border:0;background:transparent;color:#a8b4c1;padding:6px 0;cursor:pointer;font-weight:750
}
.aco-back-link:hover{color:#fff}

.aco-steps{
  display:grid;grid-template-columns:auto 1fr auto 1fr auto;
  align-items:center;gap:9px;margin:0 0 15px;padding:12px 14px;
  border:1px solid var(--line);border-radius:13px;background:#091017
}
.aco-step{
  display:flex;align-items:center;gap:8px;border:0;background:transparent;
  color:#6f7b88;padding:0;cursor:pointer;text-align:left
}
.aco-step>span{
  width:29px;height:29px;display:grid;place-items:center;border-radius:50%;
  border:1px solid #31404e;background:#101820;font-size:10px;font-weight:900
}
.aco-step strong{display:block;font-size:10px}
.aco-step small{display:block;font-size:8px;color:#65717d;margin-top:1px}
.aco-step.active{color:#dbeeff}
.aco-step.active>span{background:#14314a;border-color:#376487;color:#bce6ff}
.aco-step.complete>span{background:#173a2b;border-color:#35664e;color:#9ce4bb}
.aco-step-line{height:1px;background:#26323e}

.aco-card-heading{
  display:flex;justify-content:space-between;align-items:flex-end;gap:15px;
  margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #202a34
}
.aco-card-heading h3{margin:2px 0 0;font-size:17px}
.aco-card-heading>span{max-width:390px;color:var(--muted);font-size:10px;text-align:right}
.aco-security-note.compact{margin:2px 0 0}
.aco-next-row{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  margin-top:14px;padding-top:13px;border-top:1px solid #202a34
}

.aco-catalog-chooser{
  width:100%;display:grid;grid-template-columns:48px minmax(0,1fr) auto;
  gap:12px;align-items:center;text-align:left;padding:14px;margin-bottom:16px;
  border:1px solid #315673;border-radius:13px;background:#0d1c28;color:#dcecf7;
  cursor:pointer;transition:.15s ease
}
.aco-catalog-chooser:hover{background:#102535;border-color:#44789e;transform:translateY(-1px)}
.aco-catalog-icon{
  width:44px;height:44px;display:grid;place-items:center;border-radius:11px;
  background:#153149;border:1px solid #376489;color:#b7e4ff;font-size:18px
}
.aco-catalog-chooser strong{display:block;font-size:12px}
.aco-catalog-chooser span{display:block;color:#8fa4b4;font-size:10px;line-height:1.45;margin-top:3px}
.aco-catalog-chooser b{font-size:20px;color:#8ecfff}

.aco-picker-banner{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:13px 14px;margin-bottom:10px;border:1px solid #356789;
  border-radius:13px;background:linear-gradient(145deg,#102639,#0b1b28);
  box-shadow:0 10px 28px rgba(0,0,0,.16)
}
.aco-picker-copy strong{display:block;font-size:13px;margin:2px 0 3px}
.aco-picker-copy span{display:block;color:#96aabd;font-size:10px;line-height:1.45}
.aco-picker-banner+.filters{border-color:#29475c}
.aco-auto-id{color:#a9ddff;font-weight:800}

.aco-review-summary{display:grid;gap:10px}
.aco-review-head,.aco-review-account{
  display:grid;grid-template-columns:1fr 1fr;gap:9px
}
.aco-review-head>div,.aco-review-account>div{
  border:1px solid var(--line);background:#0a1118;border-radius:10px;padding:11px
}
.aco-review-head span,.aco-review-account span{
  display:block;color:#788594;font-size:8px;text-transform:uppercase;letter-spacing:.09em;font-weight:850
}
.aco-review-head strong,.aco-review-account strong{
  display:block;margin-top:4px;font-size:11px;overflow-wrap:anywhere
}
.aco-review-products{
  border:1px solid var(--line);background:#0a1118;border-radius:11px;padding:5px 11px
}
.aco-review-product{
  display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;
  padding:9px 0;border-top:1px solid #1c2630
}
.aco-review-product:first-child{border-top:0}
.aco-review-product img{
  width:44px;height:44px;object-fit:contain;background:#fff;border-radius:8px;border:1px solid #2b3540
}
.aco-review-product>div>strong{display:block;font-size:11px}
.aco-review-product>div>span{display:block;color:var(--muted);font-size:9px;margin-top:3px}
.aco-review-numbers{display:flex;gap:10px}
.aco-review-numbers span{white-space:nowrap}

@media(max-width:800px){
  .aco-hero-card{grid-template-columns:48px minmax(0,1fr);padding:16px}
  .aco-hero-icon{width:46px;height:46px}
  .aco-new-btn{grid-column:1/-1;width:100%}
  .aco-how-grid{grid-template-columns:1fr}
  .aco-privacy-strip{align-items:flex-start;flex-direction:column;gap:3px}
  .aco-steps{grid-template-columns:1fr;gap:7px}
  .aco-step{width:100%}
  .aco-step-line{display:none}
  .aco-step small{font-size:9px}
  .aco-card-heading{align-items:flex-start;flex-direction:column}
  .aco-card-heading>span{text-align:left}
  .aco-next-row{align-items:stretch;flex-direction:column-reverse}
  .aco-next-row .btn{width:100%}
  .aco-catalog-chooser{grid-template-columns:42px minmax(0,1fr) auto}
  .aco-picker-banner{align-items:stretch;flex-direction:column}
  .aco-picker-banner .btn{width:100%}
  .aco-review-head,.aco-review-account{grid-template-columns:1fr}
  .aco-review-product{grid-template-columns:42px minmax(0,1fr)}
  .aco-review-numbers{grid-column:2}
  .aco-submit-row{display:grid;grid-template-columns:1fr}
  .aco-submit-row .btn{width:100%}
}


/* ACO v14 checkout profiles */
.aco-profile-picker-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px
}
.aco-profile-preview{
  margin:12px 0 4px;padding:13px;border:1px solid #2a465b;
  border-radius:12px;background:#0c1923
}
.aco-profile-preview-head{
  display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px
}
.aco-profile-preview-head span{
  display:block;color:#8fb4cc;font-size:9px;text-transform:uppercase;letter-spacing:.08em;font-weight:850
}
.aco-profile-preview-head strong{display:block;margin-top:2px;font-size:13px}
.aco-profile-preview-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:8px
}
.aco-profile-preview-grid>div{
  padding:9px;background:#091119;border:1px solid #1f303d;border-radius:9px
}
.aco-profile-preview-grid span{
  display:block;color:#72808e;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:850
}
.aco-profile-preview-grid strong{
  display:block;margin-top:4px;color:#cbd8e4;font-size:10px;overflow-wrap:anywhere
}
.aco-profile-modal{width:min(900px,96vw)}
.profile-manager-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-bottom:12px
}
.profile-manager-head strong{display:block;font-size:13px}
.profile-manager-head span{display:block;margin-top:3px;color:var(--muted);font-size:10px}
.aco-profile-list{display:grid;gap:8px}
.checkout-profile-card{
  width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;gap:11px;text-align:left;padding:11px;
  color:#dbe5ef;background:#0b1118;border:1px solid #202c37;border-radius:11px;cursor:pointer
}
.checkout-profile-card:hover{border-color:#35536a;background:#0e1720}
.checkout-profile-icon{
  width:40px;height:40px;display:grid;place-items:center;border-radius:10px;
  background:#132536;border:1px solid #2f5069;color:#b4ddf8;font-size:10px;font-weight:900
}
.checkout-profile-main strong{display:block;font-size:12px}
.checkout-profile-main span{display:block;color:#93a0ad;font-size:10px;margin-top:2px}
.checkout-profile-main small{display:block;color:#657482;font-size:9px;margin-top:3px}
.checkout-profile-card>b{font-size:22px;color:#71808e}
.profile-edit-top{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.profile-edit-top h3{margin:2px 0 0;font-size:17px}
.profile-section-title{
  margin:16px 0 8px;padding-top:10px;border-top:1px solid #202a34;
  font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:#91a2b3
}
.profile-check-row{
  display:flex;align-items:center;gap:8px;margin:13px 0 3px;
  color:#b8c4d0;font-size:11px;font-weight:750
}
.profile-check-row input{width:auto}
.aco-password-block .mini-btn{margin-top:8px}
.revealed-secret{
  color:#ffe0a3!important;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  user-select:text
}

@media(max-width:800px){
  .aco-profile-picker-row{grid-template-columns:1fr}
  .aco-profile-picker-row .btn{width:100%}
  .aco-profile-preview-grid{grid-template-columns:1fr}
  .profile-manager-head{align-items:stretch;flex-direction:column}
  .profile-manager-head .btn{width:100%}
}


/* ACO v15 temporary one-hour checkout handoff */
.aco-sensitive-section{
  margin:14px 0 2px;padding:14px;border:1px solid #5d4d2e;
  border-radius:13px;background:linear-gradient(145deg,#18150f,#11100d)
}
.aco-sensitive-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:6px
}
.aco-sensitive-head h4{margin:2px 0 0;font-size:15px}
.temporary-badge{
  display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;
  border:1px solid #665630;border-radius:999px;background:#211d12;
  color:#e5c66f;font-size:8px;font-weight:900;letter-spacing:.08em
}
.aco-sensitive-copy{
  margin:0 0 12px;color:#a79c84;font-size:10px;line-height:1.55
}
.aco-temp-rules{
  display:flex;flex-wrap:wrap;gap:6px;margin-top:11px
}
.aco-temp-rules span{
  padding:6px 8px;border:1px solid #302b20;border-radius:8px;
  background:#0f0e0b;color:#aaa18f;font-size:9px
}

.aco-sensitive-admin-panel{
  margin:14px 0 0;padding:14px;border:1px solid #59492b;border-radius:13px;
  background:linear-gradient(145deg,#18150f,#0f0f0d)
}
.aco-sensitive-admin-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:10px;
  padding-bottom:11px;border-bottom:1px solid #2d281c
}
.aco-sensitive-admin-head h3{margin:2px 0 0;font-size:15px}
.aco-sensitive-locked{
  display:grid;grid-template-columns:42px minmax(0,1fr) auto;
  gap:11px;align-items:center;padding:13px 0 0
}
.aco-lock-icon{
  width:40px;height:40px;display:grid;place-items:center;border-radius:10px;
  background:#211d12;border:1px solid #514322;font-size:17px
}
.aco-sensitive-locked strong{display:block;font-size:11px}
.aco-sensitive-locked p{margin:3px 0 0;color:#958c79;font-size:9px;line-height:1.45}
.aco-countdown-row{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:12px 0
}
.aco-countdown-row span{
  display:block;color:#8f866f;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:850
}
.aco-countdown-row strong{
  display:block;margin-top:2px;color:#f0d47f;font-size:22px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace
}
.sensitive-value-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:8px
}
.sensitive-value-card{
  padding:10px;border:1px solid #302a1d;border-radius:10px;background:#0e0e0c
}
.sensitive-value-card.span-2{grid-column:1/-1}
.sensitive-value-card span{
  display:block;color:#817966;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:850
}
.sensitive-value-card strong{
  display:block;margin-top:5px;color:#f0ede6;font-size:11px;overflow-wrap:anywhere;user-select:text
}
.sensitive-mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.03em
}
.aco-sensitive-warning{
  margin-top:9px;padding:8px 9px;border-radius:8px;background:#20190f;
  color:#c8b98d;font-size:9px;line-height:1.45
}
.aco-sensitive-unavailable{
  padding:13px 0 2px;color:#978e7b
}
.aco-sensitive-unavailable strong{display:block;color:#d1c7b0;font-size:11px}
.aco-sensitive-unavailable span{display:block;margin-top:3px;font-size:9px}
.aco-profile-preview-grid{grid-template-columns:repeat(3,1fr)}

@media(max-width:800px){
  .aco-sensitive-locked{grid-template-columns:40px minmax(0,1fr)}
  .aco-sensitive-locked .btn{grid-column:1/-1;width:100%}
  .aco-countdown-row{align-items:stretch;flex-direction:column}
  .aco-countdown-row .btn{width:100%}
  .sensitive-value-grid{grid-template-columns:1fr}
  .sensitive-value-card.span-2{grid-column:auto}
  .aco-profile-preview-grid{grid-template-columns:1fr}
}


/* v17 Discord name field */
.field-help{display:block;margin-top:5px;color:#71808e;font-size:9px;line-height:1.4}


/* v19 — multiple ACO form submissions */
.aco-submit-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  align-items:center;
}
.aco-multiple-note{
  margin-top:9px;
  color:var(--muted);
  font-size:9px;
  text-align:right;
}
@media(max-width:800px){
  .aco-submit-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .aco-submit-actions .btn{
    width:100%;
  }
  .aco-multiple-note{
    text-align:left;
    line-height:1.45;
  }
}


/* v20 — choose Single vs Multiple ACO before starting */
.aco-type-choice{
  display:grid;
  gap:14px;
}
.aco-type-top{
  display:flex;
  align-items:flex-start;
  gap:16px;
  padding:4px 0 2px;
}
.aco-type-top h2{
  margin:2px 0 5px;
  font-size:21px;
}
.aco-type-top p{
  margin:0;
  color:var(--muted);
  font-size:11px;
}
.aco-type-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.aco-type-card{
  width:100%;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  padding:18px;
  text-align:left;
  border:1px solid #273542;
  border-radius:15px;
  background:#0b1219;
  color:#e3edf6;
  cursor:pointer;
  transition:.15s ease;
}
.aco-type-card:hover{
  transform:translateY(-2px);
  border-color:#3b5f79;
  background:#0e1821;
}
.aco-type-card.featured{
  border-color:#315c7a;
  background:linear-gradient(145deg,#0d1e2b,#0b141c);
}
.aco-type-icon{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#132536;
  border:1px solid #31516a;
  color:#b9e3ff;
  font-size:18px;
  font-weight:900;
}
.aco-type-copy h3{
  margin:2px 0 5px;
  font-size:15px;
}
.aco-type-copy p{
  margin:0 0 5px;
  color:#acbac6;
  font-size:10px;
  line-height:1.45;
}
.aco-type-copy>span{
  display:block;
  color:#6f7e8c;
  font-size:9px;
  line-height:1.4;
}
.aco-type-card>b{
  color:#78bde8;
  font-size:22px;
}
.aco-type-note{
  display:flex;
  gap:8px;
  align-items:center;
  padding:11px 13px;
  border:1px solid #233340;
  border-radius:11px;
  background:#0a1219;
}
.aco-type-note strong{
  color:#a7d8f7;
  font-size:10px;
}
.aco-type-note span{
  color:var(--muted);
  font-size:9px;
}
.aco-mode-line{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-top:6px;
}
.aco-mode-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 8px;
  border:1px solid #334758;
  border-radius:999px;
  background:#101a23;
  color:#c9d6e0;
  font-size:9px;
  font-weight:850;
}
.aco-mode-badge.multiple{
  border-color:#376889;
  background:#102436;
  color:#bde6ff;
}
.aco-inline-link{
  border:0;
  padding:0;
  background:transparent;
  color:#7fb9df;
  cursor:pointer;
  font-size:9px;
  font-weight:800;
}
.aco-inline-link:hover{
  color:#c9ebff;
  text-decoration:underline;
}
.aco-success-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}

@media(max-width:800px){
  .aco-type-top{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }
  .aco-type-grid{
    grid-template-columns:1fr;
  }
  .aco-type-card{
    grid-template-columns:46px minmax(0,1fr) auto;
    padding:15px;
  }
  .aco-type-icon{
    width:44px;
    height:44px;
  }
  .aco-type-note{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }
  .aco-success-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .aco-success-actions .btn{
    width:100%;
  }
}


/* v21 — multiple ACOs all in one */
.aco-single-profile-field{
  margin-top:2px;
}
.aco-batch-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-top:4px;
  padding:14px;
  border:1px solid #31556f;
  border-radius:13px;
  background:linear-gradient(145deg,#0e1d29,#0a151e);
}
.aco-batch-head h4{
  margin:2px 0 5px;
  font-size:14px;
}
.aco-batch-head p{
  max-width:650px;
  margin:0;
  color:var(--muted);
  font-size:10px;
  line-height:1.5;
}
.aco-batch-head-actions{
  display:flex;
  gap:8px;
  flex:0 0 auto;
}
.aco-batch-profile-list{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.aco-batch-profile-option{
  display:grid;
  grid-template-columns:auto 40px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid #25323e;
  border-radius:11px;
  background:#0a1118;
  cursor:pointer;
  transition:.14s ease;
}
.aco-batch-profile-option:hover{
  border-color:#36536a;
}
.aco-batch-profile-option.selected{
  border-color:#39729a;
  background:#0d1b26;
}
.aco-batch-profile-option>input{
  width:18px;
  height:18px;
  margin:0;
}
.aco-batch-profile-copy strong{
  display:block;
  font-size:11px;
}
.aco-batch-profile-copy span{
  display:block;
  margin-top:2px;
  color:#93a4b2;
  font-size:9px;
}
.aco-batch-profile-copy small{
  display:block;
  margin-top:3px;
  color:#657481;
  font-size:8px;
  overflow-wrap:anywhere;
}
.aco-batch-selected-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:16px;
  padding-top:13px;
  border-top:1px solid #202d38;
}
.aco-batch-selected-head strong{
  display:block;
  font-size:12px;
}
.aco-batch-selected-head span.muted{
  display:block;
  margin-top:2px;
}
.aco-batch-sensitive-list{
  display:grid;
  gap:10px;
  margin-top:10px;
}
.aco-batch-sensitive-card{
  padding:13px;
  border:1px solid #2a3b49;
  border-radius:12px;
  background:#0b131a;
}
.aco-batch-sensitive-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid #1f2c36;
}
.aco-batch-sensitive-card-head>div>span{
  display:block;
  color:#7b91a3;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}
.aco-batch-sensitive-card-head strong{
  display:block;
  margin-top:2px;
  font-size:12px;
}
.aco-batch-sensitive-card-head small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:9px;
}
.aco-batch-no-selection{
  padding:16px;
  text-align:center;
  border:1px dashed #31404c;
  border-radius:11px;
  background:#091017;
}
.aco-batch-no-selection strong{
  display:block;
  font-size:11px;
}
.aco-batch-no-selection span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:9px;
}
.aco-review-batch-accounts{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:9px;
}
.aco-review-batch-account{
  padding:10px;
  border:1px solid #263542;
  border-radius:10px;
  background:#0a1118;
}
.aco-review-batch-account>span{
  display:block;
  color:#738494;
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
}
.aco-review-batch-account strong{
  display:block;
  margin-top:3px;
  font-size:11px;
}
.aco-review-batch-account small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:9px;
}
.aco-review-batch-account b{
  display:block;
  margin-top:5px;
  color:#a9d8f7;
  font-size:9px;
}
.profile-save-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}

@media(max-width:800px){
  .aco-batch-head{
    flex-direction:column;
  }
  .aco-batch-head-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .aco-batch-head-actions .btn{
    width:100%;
  }
  .aco-batch-profile-option{
    grid-template-columns:auto 36px minmax(0,1fr);
  }
  .aco-batch-profile-option .mini-btn{
    grid-column:2 / -1;
    width:100%;
  }
  .aco-review-batch-accounts{
    grid-template-columns:1fr;
  }
  .profile-save-actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }
  .profile-save-actions .btn{
    width:100%;
  }
}


/* v22 — temporary card details inside Checkout Profile modal */
.profile-temp-aco-note{
  display:flex;
  align-items:flex-start;
  gap:9px;
  padding:10px 11px;
  margin-bottom:10px;
  border:1px solid #2d5069;
  border-radius:10px;
  background:#0c1822;
}
.profile-temp-aco-note strong{
  flex:0 0 auto;
  color:#a9dcfb;
  font-size:9px;
}
.profile-temp-aco-note span{
  color:#8397a7;
  font-size:9px;
  line-height:1.45;
}
.aco-batch-sensitive-card.ready{
  border-color:#2f614d;
  background:#0b1713;
}
.aco-batch-sensitive-card.needs-details{
  border-color:#65464b;
}
.aco-temp-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
}
.aco-temp-summary-grid>div{
  padding:9px;
  border:1px solid #22313d;
  border-radius:9px;
  background:#091117;
}
.aco-temp-summary-grid span{
  display:block;
  color:#70808e;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:850;
}
.aco-temp-summary-grid strong{
  display:block;
  margin-top:4px;
  color:#c7d5df;
  font-size:10px;
}
.aco-edit-temp-btn{
  width:100%;
  margin-top:9px;
}

@media(max-width:800px){
  .profile-temp-aco-note{
    flex-direction:column;
    gap:3px;
  }
  .aco-temp-summary-grid{
    grid-template-columns:1fr 1fr;
  }
}


/* v24 — easier inline profile removal */
.aco-batch-profile-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.aco-batch-profile-actions .mini-btn{
  min-width:56px;
}
@media(max-width:800px){
  .aco-batch-profile-actions{
    grid-column:2 / -1;
    width:100%;
  }
  .aco-batch-profile-actions .mini-btn{
    flex:1;
  }
}


/* v25 — Single ACO temporary details live inside Checkout Profile */
.aco-single-sensitive-status{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:11px 0 9px;
  padding:11px;
  border:1px dashed #41505d;
  border-radius:10px;
  background:#0a1117;
}
.aco-single-sensitive-status>strong,
.aco-single-sensitive-status>span{
  grid-column:1 / -1;
}
.aco-single-sensitive-status>strong{
  font-size:11px;
}
.aco-single-sensitive-status>span{
  color:var(--muted);
  font-size:9px;
}
.aco-single-sensitive-status>div{
  padding:9px;
  border:1px solid #26333e;
  border-radius:9px;
  background:#091017;
}
.aco-single-sensitive-status>div>span{
  display:block;
  color:#738492;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:850;
}
.aco-single-sensitive-status>div>strong{
  display:block;
  margin-top:4px;
  font-size:10px;
}
.aco-single-sensitive-status.ready{
  border-style:solid;
  border-color:#34614f;
  background:#0a1512;
}
.aco-single-sensitive-status.needs-details{
  border-style:solid;
  border-color:#62464a;
}
.aco-single-edit-temp{
  width:100%;
  margin-bottom:9px;
}

@media(max-width:800px){
  .aco-single-sensitive-status{
    grid-template-columns:1fr 1fr;
  }
  .aco-single-sensitive-status>strong,
  .aco-single-sensitive-status>span{
    grid-column:1 / -1;
  }
}


/* v27 — retailer-aware ACO account requirements */
.profile-guest-checkout-note{
  display:flex;gap:9px;align-items:flex-start;padding:10px 11px;
  border:1px solid #31556f;border-radius:10px;background:#0c1822;
}
.profile-guest-checkout-note strong{color:#b6e2ff;font-size:10px;white-space:nowrap}
.profile-guest-checkout-note span{color:#8499aa;font-size:9px;line-height:1.45}
@media(max-width:800px){.profile-guest-checkout-note{flex-direction:column;gap:3px}}


/* v28 — ACO retailer scope */
.aco-supported-retailers-note{
  color:var(--muted);
  font-size:9px;
}


/* v30 — Target product-based / Pokémon Center profile-only ACO */
.aco-batch-profile-option.incompatible{
  opacity:.48;
}
.aco-batch-profile-option.incompatible input{
  cursor:not-allowed;
}
.aco-pkc-review-note{
  margin-top:10px;
  padding:13px;
  border:1px solid #31556f;
  border-radius:11px;
  background:#0b1822;
}
.aco-pkc-review-note strong{
  display:block;
  color:#b9e4ff;
  font-size:11px;
}
.aco-pkc-review-note span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:9px;
  line-height:1.5;
}


/* v32 — admin-triggered ACO checkout success webhook */
.aco-success-notify-panel{
  margin-top:14px;
  padding:14px;
  border:1px solid #2c5144;
  border-radius:13px;
  background:#0a1512;
}
.aco-success-notify-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.aco-success-notify-head h3{
  margin:2px 0 4px;
  font-size:14px;
}
.aco-success-notify-head p{
  margin:0;
  color:var(--muted);
  font-size:9px;
  line-height:1.5;
}
.aco-success-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 8px;
  border:1px solid #356b56;
  border-radius:999px;
  color:#bcebd9;
  background:#10231c;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}
.aco-success-preview-note{
  display:flex;
  gap:8px;
  align-items:flex-start;
  margin-top:10px;
  padding:9px 10px;
  border:1px solid #26382f;
  border-radius:9px;
  background:#08110e;
}
.aco-success-preview-note strong{
  flex:0 0 auto;
  color:#b8e6d3;
  font-size:9px;
}
.aco-success-preview-note span{
  color:var(--muted);
  font-size:9px;
}
.aco-success-notify-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  margin-top:11px;
}

@media(max-width:800px){
  .aco-success-notify-head{
    flex-direction:column;
  }
  .aco-success-preview-note{
    flex-direction:column;
    gap:3px;
  }
  .aco-success-notify-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .aco-success-notify-actions .btn{
    width:100%;
  }
}


/* v40 — inline temporary checkout entry */
.aco-inline-temp-grid{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  align-items:stretch;
}
.aco-inline-temp-field{
  display:block;
  min-width:0;
  padding:9px 10px;
  border:1px solid var(--border);
  border-radius:9px;
  background:#07121a;
  cursor:text;
}
.aco-inline-temp-field:focus-within{
  border-color:#5f94b7;
  box-shadow:0 0 0 1px rgba(95,148,183,.18);
}
.aco-inline-temp-field > span{
  display:block;
  margin-bottom:5px;
  color:#79a9c9;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.aco-inline-temp-field input{
  width:100%;
  min-width:0;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:10px;
  font-weight:800;
}
.aco-inline-temp-field input::placeholder{
  color:#8a99a5;
  opacity:1;
}
.aco-inline-temp-field.not-required{
  cursor:default;
  opacity:.72;
}
.aco-inline-temp-field.not-required input{
  cursor:not-allowed;
}
.aco-full-temp-edit{
  margin-top:8px;
  width:auto !important;
  min-height:32px;
  padding:6px 10px;
  font-size:9px;
}

@media(max-width:1100px){
  .aco-inline-temp-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:650px){
  .aco-inline-temp-grid{
    grid-template-columns:1fr;
  }
  .aco-inline-temp-field{
    min-height:58px;
    padding:10px 11px;
  }
  .aco-inline-temp-field input{
    font-size:16px;
  }
}


/* v42 — automatic Discord mention UI */
.aco-auto-mention-box{
  padding:11px 12px;
  border:1px solid #31556f;
  border-radius:10px;
  background:#0a1720;
}
.aco-auto-mention-box strong{
  display:block;
  color:#b9e4ff;
  font-size:10px;
}
.aco-auto-mention-box span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:9px;
  line-height:1.45;
}


/* v45 — CSV / Excel product spreadsheet import */
.sheet-import-modal{width:min(1180px,97vw)}
.sheet-import-subtitle{margin:3px 0 0}
.sheet-import-drop{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px;border:1px dashed #31556f;border-radius:12px;background:#0a1720
}
.sheet-import-drop strong{display:block;font-size:13px}
.sheet-import-drop span{display:block;margin-top:3px;color:var(--muted);font-size:10px}
.sheet-file-btn{cursor:pointer;white-space:nowrap}
.sheet-import-options{
  display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:12px;align-items:end;margin-top:12px
}
.sheet-import-options .field{margin-bottom:0}
.sheet-template-wrap{display:flex;justify-content:flex-end}
.sheet-import-summary{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px
}
.sheet-import-summary>div{
  padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#0a1118
}
.sheet-import-summary span{display:block;color:var(--muted);font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.07em}
.sheet-import-summary strong{display:block;margin-top:2px;font-size:18px}
.sheet-review-wrap{margin-top:14px}
.sheet-review-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:8px}
.sheet-review-head strong{display:block;font-size:12px}
.sheet-review-head span{display:block;margin-top:2px}
.sheet-review-table-wrap{max-height:430px}
.sheet-review-table{min-width:1040px}
.sheet-review-table td{vertical-align:top}
.sheet-product-cell{min-width:330px}
.sheet-product-cell input{min-width:310px;padding:7px 8px}
.sheet-product-cell small{display:block;margin-top:4px;color:var(--muted);font-size:9px}
.sheet-retailer-input{width:150px;padding:7px 8px}
.sheet-price-input{width:105px;padding:7px 8px}
.sheet-status-cell{min-width:92px}
.sheet-status-cell small{display:block;margin-top:5px;color:#ff9ca6;font-size:8px;line-height:1.3}
.sheet-row-number{display:block;margin-top:5px;color:var(--muted);font-size:8px}
.sheet-status{
  display:inline-flex;align-items:center;min-height:20px;padding:3px 6px;border-radius:999px;
  font-size:8px;font-weight:900;letter-spacing:.06em
}
.sheet-status.new{background:#103124;border:1px solid #285d47;color:#94e6bd}
.sheet-status.duplicate{background:#342812;border:1px solid #5b4720;color:#ffd778}
.sheet-status.error{background:#35151a;border:1px solid #6f3039;color:#ffacb4}
.sheet-row-duplicate{background:rgba(91,71,32,.10)}
.sheet-row-error{background:rgba(111,48,57,.10)}
@media(max-width:700px){
  .sheet-import-drop{align-items:stretch;flex-direction:column}
  .sheet-file-btn{text-align:center}
  .sheet-import-options{grid-template-columns:1fr}
  .sheet-template-wrap{justify-content:stretch}
  .sheet-template-wrap .btn{width:100%}
  .sheet-import-summary{grid-template-columns:1fr 1fr}
  .sheet-review-head{align-items:stretch;flex-direction:column}
}

/* v51: desktop row selection + shift-click range selection */
.product-table-wrap tbody tr[data-product-id].selected-product-row{
  background:#10263a;
  box-shadow:inset 3px 0 0 var(--accent);
}
.product-table-wrap tbody tr[data-product-id].selected-product-row:hover{background:#132d43}
.product-table-wrap .product-detail-trigger{cursor:pointer}
.product-table-wrap .product-detail-trigger:hover.product-name{color:#b8e2ff;text-decoration:underline}
.product-table-wrap img.product-detail-trigger:hover{outline:2px solid #2f96e8;outline-offset:1px}


/* v53 mobile hold-to-select */
@media (max-width: 760px) {
  .mobile-product-row {
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
  }

  .mobile-product-title,
  .mobile-product-thumb {
    -webkit-user-select: auto;
    user-select: auto;
  }
}


/* v54 per-member favorites / watchlist */
.result-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.watchlist-filter-btn.active,
.favorites-filter-btn.active,
.favorite-detail-btn.active{
  color:#ffe08a;
  border-color:#7a6325;
  background:#2b2410;
}
.favorite-star{
  flex:0 0 auto;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #2b3540;
  border-radius:9px;
  background:#0d141b;
  color:#6f7c8a;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  transition:transform .12s ease, color .12s ease, background .12s ease, border-color .12s ease;
}
.favorite-star:hover{
  color:#ffe08a;
  border-color:#6a5827;
  background:#211c0f;
  transform:translateY(-1px);
}
.favorite-star.active{
  color:#ffd75e;
  border-color:#776025;
  background:#2a230f;
}
.desktop-favorite-star{
  margin-right:-2px;
}
.mobile-product-title-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
}
.mobile-product-title-row .mobile-product-title{
  flex:1 1 auto;
  min-width:0;
}
.mobile-favorite-star{
  width:28px;
  height:28px;
  border-radius:8px;
  font-size:17px;
  margin-top:-3px;
}
.detail-top-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.detail-top-actions .detail-admin-actions{
  display:flex;
  gap:8px;
}
@media(max-width:760px){
  .result-row{
    align-items:flex-start;
    gap:10px;
  }
  .result-actions{
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .favorites-filter-btn{
    white-space:nowrap;
  }
  .detail-backbar{
    align-items:flex-start;
    gap:10px;
  }
  .detail-top-actions{
    flex-wrap:wrap;
    justify-content:flex-end;
  }
}


/* v55 Favorites / Watchlist sidebar tab */
.nav-item .nav-count{
  margin-left:auto;
  min-width:22px;
  height:20px;
  padding:0 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#2a230f;
  border:1px solid #715d22;
  color:#ffd75e;
  font-size:10px;
  font-weight:850;
}
.nav-item .nav-count.hidden{display:none}


/* v56 member-customizable workspace navigation */
.sidebar-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:0 6px 7px 10px;
  color:#687687;
  font-size:9px;
  font-weight:850;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.nav-organize-btn{
  appearance:none;
  border:0;
  background:transparent;
  color:#6f8092;
  padding:4px 6px;
  border-radius:6px;
  cursor:pointer;
  font:inherit;
  letter-spacing:0;
  text-transform:none;
}
.nav-organize-btn:hover,
.nav-organize-btn.active{
  color:#fff;
  background:#17202a;
}
.workspace-nav{
  display:grid;
  gap:2px;
}
.nav-sort-item{
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
  border-radius:9px;
}
.nav-sort-item .nav-item{
  flex:1 1 auto;
  min-width:0;
  padding-right:38px;
}
.nav-drag-handle{
  display:none;
  position:absolute;
  right:5px;
  top:50%;
  transform:translateY(-50%);
  width:30px;
  height:30px;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#8190a0;
  cursor:grab;
  touch-action:none;
  font-size:17px;
  font-weight:900;
  letter-spacing:-4px;
  padding-right:4px;
}
.nav-drag-handle:hover{
  color:#fff;
  background:#222d39;
}
.workspace-nav.organizing .nav-drag-handle{
  display:flex;
}
.workspace-nav.organizing .nav-item{
  cursor:default;
}
.workspace-nav.organizing .nav-sort-item{
  outline:1px dashed transparent;
  background:#0c1219;
}
.workspace-nav.organizing .nav-sort-item:hover{
  outline-color:#2b4154;
}
.nav-sort-item.dragging{
  opacity:.62;
  outline:1px dashed #3d89bd !important;
  background:#102231 !important;
}
.nav-sort-item.drag-over{
  box-shadow:0 -2px 0 #2f9cff inset;
}
.sidebar-section-label{
  margin:16px 10px 6px;
  color:#5f6c7a;
  font-size:9px;
  font-weight:850;
  letter-spacing:.14em;
  text-transform:uppercase;
}

@media(max-width:800px){
  .sidebar-section-head{
    padding-top:2px;
  }
  .workspace-nav.organizing .nav-sort-item{
    min-height:46px;
  }
  .workspace-nav.organizing .nav-drag-handle{
    width:38px;
    height:38px;
    right:3px;
  }
}


/* v57 member backgrounds */
.app{
  --member-bg-image:url("./los-primos-galaxy.png");
  --member-bg-opacity:.18;
  --member-bg-size:cover;
  --member-bg-position:center center;
  position:relative;
  isolation:isolate;
  background:#070b10;
}
.app::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-image:var(--member-bg-image);
  background-position:var(--member-bg-position);
  background-repeat:no-repeat;
  background-size:var(--member-bg-size);
  opacity:var(--member-bg-opacity);
  filter:saturate(.88) brightness(.68) contrast(1.05);
  transform:translateZ(0);
}
.app::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 72% 18%, rgba(47,81,190,.10), transparent 34%),
    radial-gradient(circle at 24% 82%, rgba(160,35,210,.08), transparent 38%),
    linear-gradient(180deg, rgba(4,8,13,.56), rgba(5,9,14,.74));
}
.app[data-background-mode="custom"]::before{
  filter:saturate(.78) brightness(.58) contrast(1.04);
}
.app[data-background-mode="dark"]::after{
  background:linear-gradient(180deg, #080c11, #090d12);
}
#appSidebar{
  background:rgba(10,15,21,.90);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.app main{
  background:linear-gradient(180deg, rgba(8,12,17,.56), rgba(8,12,17,.68));
}
.mobile-appbar{
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.table-wrap,
.bulkbar,
.aco-hero-card,
.aco-how-card,
.aco-privacy-strip,
.profile-card,
.aco-card,
.detail-card{
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.sidebar-appearance-btn{
  margin-bottom:11px;
  text-align:left;
}

/* Appearance modal */
.appearance-modal{max-width:680px}
.appearance-modal .modal-head{align-items:flex-start}
.appearance-subtitle{margin:5px 0 0}
.appearance-preview-wrap{
  padding:10px 0 16px;
}
.appearance-preview{
  --preview-bg-image:url("./los-primos-galaxy.png");
  --preview-bg-opacity:.18;
  --preview-bg-size:cover;
  position:relative;
  height:190px;
  overflow:hidden;
  border:1px solid #263443;
  border-radius:16px;
  background:#070b10;
  display:flex;
  align-items:flex-end;
  padding:16px;
}
.appearance-preview::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--preview-bg-image);
  background-position:center;
  background-size:var(--preview-bg-size);
  background-repeat:no-repeat;
  opacity:var(--preview-bg-opacity);
  filter:saturate(.9) brightness(.72);
}
.appearance-preview[data-mode="custom"]::before{
  filter:saturate(.8) brightness(.62);
}
.appearance-preview-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(4,8,13,.30),rgba(4,8,13,.78));
}
.appearance-preview-card{
  position:relative;
  z-index:1;
  display:grid;
  gap:2px;
  background:rgba(11,17,24,.78);
  border:1px solid rgba(109,139,169,.25);
  border-radius:11px;
  padding:10px 12px;
  box-shadow:0 12px 32px rgba(0,0,0,.26);
}
.appearance-preview-card strong{font-size:13px}
.appearance-preview-card span{font-size:11px;color:#97a4b2}
.appearance-choice-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  margin-bottom:14px;
}
.appearance-choice{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:64px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#0d141b;
  color:#dfe7ef;
  text-align:left;
  cursor:pointer;
}
.appearance-choice:hover{border-color:#35526b;background:#101a23}
.appearance-choice.active{
  border-color:#2e9bff;
  background:#102336;
  box-shadow:0 0 0 1px rgba(46,155,255,.12) inset;
}
.appearance-choice-icon{
  width:34px;
  height:34px;
  border-radius:9px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  background:linear-gradient(135deg,#8025cc,#146fd6);
  color:#fff;
  font-size:11px;
  font-weight:900;
}
.appearance-choice-icon.plain{background:#121820;color:#5c6876}
.appearance-choice-icon.custom{background:#132a3e;color:#7fc8ff;font-size:20px}
.appearance-choice span:last-child{display:grid;gap:2px;min-width:0}
.appearance-choice strong{font-size:12px}
.appearance-choice small{font-size:10px;color:#83909e;line-height:1.25}
.custom-background-controls{
  display:grid;
  gap:8px;
  margin:4px 0 16px;
}
.background-upload-box{
  display:flex;
  align-items:center;
  gap:11px;
  border:1px dashed #36546d;
  border-radius:12px;
  background:#0b131b;
  padding:12px;
  cursor:pointer;
}
.background-upload-box:hover{background:#0f1a24;border-color:#4782ad}
.background-upload-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#132a3e;
  color:#7fc8ff;
  font-size:18px;
}
.background-upload-box>span:last-of-type{display:grid;gap:2px}
.background-upload-box strong{font-size:12px}
.background-upload-box small{font-size:10px;color:#8693a1}
.small-bg-remove{justify-self:start}
.appearance-strength-field{margin-top:3px}
.appearance-strength-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.appearance-strength-head span{font-size:11px;color:#8ccfff;font-weight:800}
#backgroundStrength{padding:0;accent-color:var(--accent)}

/* Direct hold + drag sidebar ordering */
.workspace-nav .nav-sort-item{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.workspace-nav.hold-reordering{
  cursor:grabbing;
}
.workspace-nav.hold-reordering .nav-sort-item{
  touch-action:none;
}
.workspace-nav .nav-sort-item.dragging{
  transform:scale(.985);
  box-shadow:0 10px 26px rgba(0,0,0,.26);
}

@media(max-width:800px){
  .appearance-choice-grid{grid-template-columns:1fr}
  .appearance-preview{height:150px}
  .appearance-modal{width:min(96vw,680px)}
}


/* v58 Los Primos community chat + West Coast theme */
#appSidebar .brand .logo{width:30px;height:30px;border-radius:8px}
#appSidebar .brand strong{font-size:13px}
#appSidebar .brand span{font-size:10px}
.sidebar-signature{
  display:grid;
  justify-items:center;
  gap:0;
  margin:2px 2px 13px;
  padding:8px 6px 11px;
  border-bottom:1px solid rgba(255,255,255,.055);
  color:#f3f6fb;
}
.sidebar-signature span{
  font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive;
  font-size:25px;
  line-height:1.1;
  font-weight:650;
  transform:rotate(-3deg);
  text-shadow:0 0 16px rgba(255,62,168,.20);
}
.sidebar-signature small{
  margin-top:5px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.3em;
  color:#9da8b6;
}
.app::before{background-size:cover!important;background-position:center center!important;filter:saturate(.78) brightness(.48) contrast(1.1)}
.app::after{
  background:
    radial-gradient(circle at 72% 18%, rgba(38,78,180,.07), transparent 33%),
    radial-gradient(circle at 32% 74%, rgba(188,29,116,.055), transparent 35%),
    linear-gradient(180deg, rgba(4,8,13,.58), rgba(4,8,13,.76));
}

.chat-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  background:rgba(5,9,14,.22);
}
.chat-shell.right-hidden{grid-template-columns:minmax(0,1fr)}
.chat-shell.right-hidden .chat-right-sidebar{display:none}
.chat-main-panel{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;height:100vh}
.chat-header{
  min-height:84px;
  padding:16px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(99,121,145,.18);
  background:rgba(7,12,18,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.chat-heading{display:flex;align-items:center;gap:12px;min-width:0}
.chat-heading-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#172333;color:#c8d8ec;font-weight:900;letter-spacing:-2px}
.chat-heading h1{font-size:20px;margin:0}
.chat-heading p{margin:3px 0 0;color:#9aa8b7;font-size:12px}
.chat-header-actions{display:flex;align-items:center;gap:9px}
.chat-search-wrap{height:40px;display:flex;align-items:center;gap:8px;border:1px solid #253342;background:rgba(15,23,32,.88);border-radius:10px;padding:0 11px;min-width:260px}
.chat-search-wrap span{color:#8ea0b4}
.chat-search-wrap input{border:0!important;background:transparent!important;padding:0!important;min-width:0;width:100%;outline:0;color:#e9eef5}
.chat-icon-btn{width:40px;height:40px;border:1px solid #263646;border-radius:10px;background:#111a24;color:#91a4b8;cursor:pointer;font-weight:900}
.chat-icon-btn.active{color:#dceeff;border-color:#31516e;background:#14263a}
.chat-setup-notice{margin:14px 22px 0;padding:10px 12px;border:1px solid #6c5426;border-radius:10px;background:#251d0e;color:#ffd980;font-size:12px}
.chat-messages{overflow-y:auto;padding:20px 28px 24px;scrollbar-color:#34485d transparent}
.chat-message{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:9px 0 16px}
.chat-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#5c35d8,#1680d6);font-weight:850;color:#fff;position:relative;flex:0 0 auto}
.chat-avatar img{width:100%;height:100%;object-fit:cover}
.chat-avatar.small{width:36px;height:36px;font-size:12px}
.chat-avatar.small i{position:absolute;width:9px;height:9px;border-radius:50%;background:#20d886;right:0;bottom:1px;border:2px solid #0b1118}
.chat-message-body{min-width:0}
.chat-message-meta{display:flex;align-items:center;gap:8px;min-height:20px}
.chat-message-meta>strong{color:#f3f6fa;font-size:13px}
.chat-message-meta>em,.chat-online-member>em{font-style:normal;font-size:9px;font-weight:900;background:#285fd1;color:#fff;border-radius:6px;padding:3px 5px}
.chat-message-meta>time{color:#7f8d9d;font-size:10px}
.chat-message-meta>button{opacity:0;margin-left:auto;width:25px;height:25px;border:0;border-radius:7px;background:transparent;color:#738397;cursor:pointer}
.chat-message:hover .chat-message-meta>button{opacity:1}
.chat-message-meta>button:hover{background:#27141a;color:#ff8792}
.chat-message-text{margin-top:3px;color:#edf2f7;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.chat-message-text a{color:#7abfff;text-decoration:none}
.chat-message-text a:hover{text-decoration:underline}
.chat-product-card{margin-top:9px;max-width:650px;display:grid;grid-template-columns:62px minmax(0,1fr) 25px;gap:12px;align-items:center;padding:8px;border:1px solid rgba(112,139,168,.28);border-radius:11px;background:rgba(13,21,30,.78);color:#eef4fa;text-decoration:none;backdrop-filter:blur(8px)}
.chat-product-card img{width:62px;height:62px;object-fit:contain;background:#fff;border-radius:8px}
.chat-product-card span{min-width:0;display:grid;gap:5px}
.chat-product-card strong{font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-product-card small{color:#91a1b1;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-product-card>b{color:#7fbfff;font-size:16px;text-align:center}
.chat-product-card.compact{margin:0;grid-template-columns:48px minmax(0,1fr) 18px;padding:6px;background:#0e1720}
.chat-product-card.compact img{width:48px;height:48px}
.chat-product-card.compact strong{font-size:11px}.chat-product-card.compact small{font-size:9px}
.chat-empty{padding:40px;text-align:center;color:#8795a5}
.chat-attached-product{position:relative;margin:0 22px 9px;max-width:650px}
.chat-attached-product .chat-product-card{margin:0}
#chatRemoveAttachedProduct{position:absolute;right:-7px;top:-7px;width:25px;height:25px;border-radius:50%;border:1px solid #394b5e;background:#111a24;color:#fff;cursor:pointer}
.chat-composer{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:9px;align-items:end;padding:10px 22px 18px;background:linear-gradient(180deg,rgba(7,11,16,.18),rgba(7,11,16,.92))}
.chat-attach-btn{width:42px;height:42px;border:1px solid #273646;border-radius:10px;background:#121c27;color:#a8bdd3;font-size:22px;cursor:pointer}
#chatMessageInput{min-height:42px;max-height:160px;resize:none;border:1px solid #283746;background:#101923;border-radius:11px;padding:11px 13px;color:#eef3f8;line-height:1.35;outline:none}
#chatMessageInput:focus{border-color:#3c6b94}
.chat-send-btn{min-height:42px;padding-inline:20px}
.chat-right-sidebar{padding:12px;border-left:1px solid rgba(100,122,146,.18);background:rgba(7,12,18,.78);backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);overflow-y:auto;height:100vh}
.chat-side-card{border:1px solid #253443;border-radius:14px;background:rgba(10,16,23,.78);padding:12px;margin-bottom:12px}
.chat-side-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:850;margin-bottom:8px}
.chat-side-title>span{display:flex;align-items:center;gap:7px}.online-dot{width:9px;height:9px;border-radius:50%;background:#20d886;display:inline-block}
.chat-online-members{display:grid;gap:4px}.chat-online-member{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;padding:5px 1px}.chat-online-member>div:nth-child(2){display:grid;gap:1px;min-width:0}.chat-online-member strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-online-member small{font-size:9px;color:#8c9bab}
.chat-recent-products{display:grid;gap:7px}.chat-side-empty{padding:10px 3px;color:#758495;font-size:10px}
.chat-side-quote{min-height:110px;border:1px solid #253443;border-radius:14px;background:linear-gradient(135deg,rgba(30,20,56,.7),rgba(7,15,26,.85));display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;color:#bfcafa;padding:15px}.chat-side-quote span{font-size:28px;color:#5d69ff}.chat-side-quote strong{font-family:"Segoe Script","Brush Script MT",cursive;font-size:17px;font-weight:500;line-height:1.4}
.chat-product-modal-card{max-width:680px}.chat-product-choices{display:grid;gap:6px;max-height:430px;overflow:auto;margin-top:10px}.chat-product-choice{display:grid;grid-template-columns:48px minmax(0,1fr) 28px;align-items:center;gap:10px;text-align:left;border:1px solid #253442;border-radius:10px;background:#0d151e;color:#eef3f8;padding:7px;cursor:pointer}.chat-product-choice:hover{background:#111f2b;border-color:#365976}.chat-product-choice img{width:48px;height:48px;object-fit:contain;background:#fff;border-radius:7px}.chat-product-choice span{display:grid;gap:3px;min-width:0}.chat-product-choice strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-product-choice small{font-size:9px;color:#8998a8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-product-choice>b{font-size:18px;color:#75bbff}

@media(max-width:1100px){.chat-shell{grid-template-columns:minmax(0,1fr) 260px}.chat-search-wrap{min-width:210px}}
@media(max-width:900px){
  .chat-main-panel{height:calc(100vh - 54px)}
  .chat-shell{display:block;min-height:calc(100vh - 54px);position:relative}
  .chat-right-sidebar{position:fixed;right:0;top:54px;bottom:0;width:min(330px,88vw);height:auto;z-index:80;box-shadow:-18px 0 45px rgba(0,0,0,.4)}
  .chat-shell.right-hidden .chat-right-sidebar{display:none}
  .chat-header{padding:12px 14px;min-height:72px}.chat-heading p{display:none}.chat-search-wrap{display:none}.chat-heading h1{font-size:17px}.chat-heading-icon{width:38px;height:38px}
  .chat-messages{padding:14px 14px 18px}.chat-message{grid-template-columns:38px minmax(0,1fr);gap:10px}.chat-avatar{width:38px;height:38px}.chat-message-text{font-size:13px}.chat-product-card{grid-template-columns:52px minmax(0,1fr) 20px}.chat-product-card img{width:52px;height:52px}
  .chat-composer{grid-template-columns:38px minmax(0,1fr) auto;padding:9px 12px 12px}.chat-attach-btn{width:38px;height:40px}.chat-send-btn{padding-inline:13px}.chat-attached-product{margin-inline:12px}
  .sidebar-signature{display:none}
}


/* v59 visual parity pass: make the real chat match the approved concept more closely */
#appSidebar .brand .logo{
  width:42px!important;
  height:42px!important;
  border-radius:11px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.025),0 0 20px rgba(67,163,255,.13)!important;
}
#appSidebar .brand strong{font-size:14px!important}
#appSidebar .brand span{font-size:10.5px!important}
.sidebar-signature{padding:12px 4px 15px!important}
.sidebar-signature span{
  font-size:29px!important;
  font-weight:600!important;
  background:linear-gradient(90deg,#f7fbff 0%,#f7fbff 38%,#ff4baa 68%,#4e8cff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:none!important;
  position:relative;
}
.sidebar-signature span::after{
  content:"";
  position:absolute;
  left:8%;right:2%;bottom:-7px;height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff315d,#ff3aae,#4c77ff);
  transform:skewX(-20deg);
  box-shadow:0 0 12px rgba(255,46,151,.24);
}
.sidebar-signature small{margin-top:11px!important;color:#c2cad5!important}

/* The default West Coast wallpaper should actually be visible. */
.app::before{
  filter:saturate(1.02) brightness(.95) contrast(1.06)!important;
}
.app::after{
  background:
    radial-gradient(circle at 72% 26%, rgba(75,84,255,.06), transparent 35%),
    radial-gradient(circle at 35% 72%, rgba(224,36,135,.055), transparent 36%),
    linear-gradient(180deg, rgba(3,7,12,.34), rgba(3,7,12,.56))!important;
}
.app main{
  background:linear-gradient(180deg,rgba(6,10,15,.34),rgba(6,10,15,.46))!important;
}

/* Chat gets the edge-to-edge community layout instead of looking like a plain admin page. */
.app[data-page="chat"] main{
  padding:0!important;
  min-height:100vh;
  background:rgba(4,8,13,.10)!important;
  overflow:hidden;
}
.app[data-page="chat"] #chatPage{min-height:100vh}
.chat-shell{
  grid-template-columns:minmax(0,1fr) 330px!important;
  background:rgba(3,7,12,.08)!important;
}
.chat-shell.right-hidden{grid-template-columns:minmax(0,1fr)!important}
.chat-main-panel{
  position:relative;
  height:100vh!important;
  background:linear-gradient(180deg,rgba(3,8,14,.18),rgba(3,8,14,.24));
}
.chat-header{
  min-height:96px!important;
  padding:18px 30px!important;
  background:rgba(5,10,16,.72)!important;
  border-bottom:1px solid rgba(112,137,164,.20)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.12);
}
.chat-heading{gap:14px!important}
.chat-heading-icon{
  width:48px!important;height:48px!important;border-radius:14px!important;
  background:linear-gradient(145deg,#1d2a3d,#111c2a)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}
.chat-heading h1{font-size:24px!important;letter-spacing:-.02em}
.chat-heading p{font-size:12.5px!important;color:#9caabd!important;margin-top:3px!important}
.chat-header-actions{gap:10px!important}
.chat-search-wrap{
  min-width:320px!important;height:44px!important;border-radius:12px!important;
  background:rgba(13,22,32,.78)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}
.chat-icon-btn{
  height:44px!important;min-width:44px!important;border-radius:11px!important;
  background:rgba(15,25,36,.82)!important;
}
.chat-panel-toggle{
  width:auto!important;padding:0 12px!important;display:inline-flex!important;
  align-items:center;justify-content:center;gap:7px;white-space:nowrap;
  color:#b7c8dc!important;
}
.chat-panel-toggle span{font-size:11px;font-weight:800}
.chat-panel-toggle.active{color:#e8f2ff!important;border-color:#345873!important;background:rgba(18,39,57,.90)!important}

.chat-messages{
  padding:26px 34px 30px!important;
  background:transparent!important;
}
.chat-message{
  max-width:980px;
  grid-template-columns:48px minmax(0,1fr)!important;
  gap:14px!important;
  padding:10px 0 18px!important;
}
.chat-avatar{width:48px!important;height:48px!important}
.chat-message-meta strong{font-size:13.5px}
.chat-message-text{font-size:14px!important;line-height:1.48!important}
.chat-product-card{
  max-width:700px!important;
  grid-template-columns:68px minmax(0,1fr) 28px!important;
  padding:10px!important;
  border-radius:14px!important;
  background:rgba(10,18,27,.70)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.18);
}
.chat-product-card img{width:68px!important;height:68px!important;border-radius:10px!important}

/* Center a polished empty state over the wallpaper instead of leaving tiny text at the bottom. */
.chat-empty{
  position:absolute!important;
  inset:96px 0 78px 0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  color:#95a6b8!important;
  pointer-events:none;
  z-index:2;
}
.chat-empty.hidden{display:none!important}
.chat-empty-card{
  min-width:250px;
  display:grid;
  justify-items:center;
  gap:7px;
  padding:22px 28px;
  border:1px solid rgba(107,135,163,.24);
  border-radius:17px;
  background:rgba(7,14,22,.56);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.chat-empty-icon{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,#1d2b3e,#111d2a);
  color:#b8c9dd;font-weight:900;letter-spacing:-2px;font-size:17px;
}
.chat-empty-card strong{font-size:15px;color:#eef5fc}
.chat-empty-card span{font-size:11px;color:#8393a4}

.chat-composer{
  padding:12px 28px 22px!important;
  background:linear-gradient(180deg,rgba(4,9,14,.04),rgba(4,9,14,.78))!important;
}
.chat-attach-btn{width:46px!important;height:46px!important;border-radius:12px!important;background:rgba(16,28,40,.88)!important}
#chatMessageInput{
  min-height:46px!important;
  border-radius:12px!important;
  background:rgba(13,23,34,.86)!important;
  border-color:#2a3d50!important;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
}
.chat-send-btn{min-height:46px!important;padding-inline:22px!important;border-radius:12px!important}

.chat-right-sidebar{
  width:auto!important;
  padding:16px!important;
  background:rgba(5,10,16,.68)!important;
  border-left:1px solid rgba(113,139,167,.20)!important;
  backdrop-filter:blur(15px)!important;
  -webkit-backdrop-filter:blur(15px)!important;
}
.chat-side-card{
  padding:15px!important;
  border-radius:16px!important;
  background:rgba(8,15,23,.66)!important;
  border-color:rgba(92,121,151,.28)!important;
  box-shadow:0 18px 45px rgba(0,0,0,.14);
}
.chat-side-title{margin-bottom:12px!important}
.chat-side-title>span{font-size:12px!important}
.chat-online-member{padding:7px 2px!important}
.chat-side-quote{
  min-height:125px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(26,19,58,.67),rgba(7,15,26,.68))!important;
}
.chat-side-quote strong{font-size:18px!important;color:#ced6ff!important}

@media(max-width:1100px){
  .chat-shell{grid-template-columns:minmax(0,1fr) 290px!important}
  .chat-search-wrap{min-width:240px!important}
  .chat-panel-toggle span{display:none}
}
@media(max-width:900px){
  .app[data-page="chat"] main{min-height:calc(100vh - 54px)}
  .chat-main-panel{height:calc(100vh - 54px)!important}
  .chat-header{min-height:72px!important;padding:12px 14px!important}
  .chat-heading h1{font-size:18px!important}
  .chat-heading-icon{width:40px!important;height:40px!important}
  .chat-messages{padding:14px 14px 18px!important}
  .chat-message{grid-template-columns:40px minmax(0,1fr)!important;gap:10px!important}
  .chat-avatar{width:40px!important;height:40px!important}
  .chat-empty{inset:72px 0 70px 0!important}
  .chat-empty-card{min-width:220px;padding:18px 22px}
  .chat-composer{padding:9px 12px 12px!important}
  .chat-right-sidebar{padding:12px!important}
}


/* v60 — mobile chat parity + default West Coast visual theme */
html,body{overflow-x:hidden}
body.chat-panel-open{overflow:hidden}

/* Slightly smaller top-left brand mark, matching the approved concept. */
#appSidebar .brand .logo{
  width:36px!important;
  height:36px!important;
  border-radius:10px!important;
}
#appSidebar .brand{gap:10px}

/* The default artwork should read as part of the UI, not disappear behind black layers. */
.app[data-background-mode="default"]::before{
  filter:saturate(1.12) brightness(1.0) contrast(1.04)!important;
}
.app[data-background-mode="default"]::after{
  background:
    radial-gradient(circle at 73% 39%,rgba(255,38,142,.055),transparent 30%),
    radial-gradient(circle at 35% 74%,rgba(57,79,255,.055),transparent 38%),
    linear-gradient(180deg,rgba(2,7,13,.28),rgba(2,7,13,.47))!important;
}
.app[data-background-mode="default"] main{
  background:linear-gradient(180deg,rgba(4,9,15,.25),rgba(4,9,15,.38))!important;
}

.mobile-appbar-title{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.mobile-appbar-logo{display:none;width:30px;height:30px;border-radius:8px;object-fit:cover;flex:0 0 auto}
.mobile-chat-panel-btn{display:none;width:46px;height:46px;border-radius:13px;border:1px solid #273746;background:rgba(14,24,34,.92);color:#c8d8eb;font-size:20px;font-weight:850;cursor:pointer;flex:0 0 auto}
.mobile-chat-panel-btn.active{color:#fff;border-color:#3c6590;background:#17304a}
.chat-mobile-panel-backdrop{display:none}

@media(max-width:900px){
  .app[data-page="chat"]{height:100dvh;min-height:100dvh;overflow:hidden}
  .app[data-page="chat"] .mobile-appbar{
    height:72px;min-height:72px;padding:10px 12px;
    background:rgba(5,10,16,.90)!important;
    border-bottom:1px solid rgba(106,134,164,.22);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)
  }
  .app[data-page="chat"] .mobile-appbar-logo{display:block}
  .app[data-page="chat"] .mobile-appbar strong{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .app[data-page="chat"] .mobile-menu-btn{width:46px;height:46px;border-radius:13px;background:rgba(14,24,34,.92)}
  .app[data-page="chat"] .mobile-chat-panel-btn:not(.hidden){display:grid;place-items:center}
  .app[data-page="chat"] main{
    height:calc(100dvh - 72px)!important;
    min-height:0!important;
    overflow:hidden!important;
    padding:0!important;
  }
  .app[data-page="chat"] #chatPage,
  .app[data-page="chat"] .chat-shell,
  .app[data-page="chat"] .chat-main-panel{
    width:100%;height:100%!important;min-height:0!important;
  }
  .app[data-page="chat"] .chat-shell{
    display:block!important;
    position:relative;
    overflow:hidden;
    background:rgba(2,7,12,.06)!important;
  }
  .app[data-page="chat"] .chat-main-panel{
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto auto!important;
    overflow:hidden;
    background:linear-gradient(180deg,rgba(3,8,14,.08),rgba(3,8,14,.18))!important;
  }
  .app[data-page="chat"] .chat-header{
    min-height:64px!important;
    padding:10px 14px!important;
    gap:10px!important;
    background:rgba(5,10,16,.63)!important;
  }
  .app[data-page="chat"] .chat-heading{gap:10px!important;min-width:0}
  .app[data-page="chat"] .chat-heading-icon{width:38px!important;height:38px!important;border-radius:11px!important;flex:0 0 auto}
  .app[data-page="chat"] .chat-heading h1{font-size:17px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .app[data-page="chat"] .chat-heading p{display:none!important}
  .app[data-page="chat"] .chat-header-actions{display:none!important}
  .app[data-page="chat"] .chat-messages{
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    padding:14px 13px 18px!important;
  }
  .app[data-page="chat"] .chat-message{
    width:100%;max-width:100%!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:9px!important;padding:8px 0 14px!important;
  }
  .app[data-page="chat"] .chat-avatar{width:36px!important;height:36px!important;font-size:11px}
  .app[data-page="chat"] .chat-message-body{min-width:0}
  .app[data-page="chat"] .chat-message-meta{gap:6px;flex-wrap:wrap}
  .app[data-page="chat"] .chat-message-meta strong{font-size:12.5px}
  .app[data-page="chat"] .chat-message-meta time{font-size:9.5px}
  .app[data-page="chat"] .chat-message-text{font-size:13px!important;line-height:1.48!important;overflow-wrap:anywhere}
  .app[data-page="chat"] .chat-product-card,
  .app[data-page="chat"] .chat-product-card.compact{
    width:100%;max-width:100%!important;
    grid-template-columns:54px minmax(0,1fr) 22px!important;
    padding:8px!important;border-radius:12px!important;
  }
  .app[data-page="chat"] .chat-product-card img{width:54px!important;height:54px!important}
  .app[data-page="chat"] .chat-product-card strong{white-space:normal!important;line-height:1.25}
  .app[data-page="chat"] .chat-empty{inset:64px 0 72px 0!important;padding:14px!important}
  .app[data-page="chat"] .chat-empty-card{min-width:0;width:min(280px,86vw);padding:18px 20px}
  .app[data-page="chat"] .chat-attached-product{margin:0 10px 7px!important}
  .app[data-page="chat"] .chat-composer{
    position:relative!important;
    bottom:auto!important;
    grid-template-columns:40px minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:9px 10px calc(10px + env(safe-area-inset-bottom))!important;
    background:linear-gradient(180deg,rgba(4,9,14,.50),rgba(4,9,14,.93))!important;
    border-top:1px solid rgba(103,132,161,.18);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
  }
  .app[data-page="chat"] .chat-attach-btn{width:40px!important;height:42px!important;border-radius:11px!important}
  .app[data-page="chat"] #chatMessageInput{min-height:42px!important;max-height:112px!important;font-size:16px!important;padding:10px 11px!important}
  .app[data-page="chat"] .chat-send-btn{min-height:42px!important;padding-inline:13px!important;border-radius:11px!important;font-size:12px}

  /* Right rail becomes an off-canvas info drawer on phones/tablets. */
  .app[data-page="chat"] .chat-right-sidebar{
    display:block!important;
    position:fixed!important;
    top:72px!important;right:0!important;bottom:0!important;
    width:min(360px,92vw)!important;height:auto!important;
    padding:13px!important;
    z-index:98!important;
    transform:translateX(104%);
    transition:transform .22s ease;
    box-shadow:-18px 0 48px rgba(0,0,0,.44)!important;
    background:rgba(5,10,16,.94)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  .app[data-page="chat"] .chat-shell.mobile-panel-open .chat-right-sidebar{transform:translateX(0)}
  .app[data-page="chat"] .chat-shell.right-hidden .chat-right-sidebar{display:block!important}
  .chat-mobile-panel-backdrop{
    position:fixed;inset:72px 0 0 0;z-index:97;
    background:rgba(0,0,0,.58);
    backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)
  }
  .chat-mobile-panel-backdrop:not(.hidden){display:block}
  .app[data-page="chat"] .chat-side-card{padding:14px!important;border-radius:15px!important}
  .app[data-page="chat"] .chat-side-quote{min-height:115px!important}
}

@media(max-width:520px){
  .app[data-page="chat"] .chat-heading-icon{display:none}
  .app[data-page="chat"] .chat-header{min-height:54px!important;padding:8px 12px!important}
  .app[data-page="chat"] .chat-empty{inset:54px 0 72px 0!important}
  .app[data-page="chat"] .chat-send-btn{padding-inline:11px!important}
}


/* v61 — stronger approved West Coast default artwork */
.app[data-background-mode="default"]::before{
  opacity:var(--member-bg-opacity)!important;
  filter:saturate(1.18) brightness(.94) contrast(1.07)!important;
}
.app[data-background-mode="default"]::after{
  background:
    radial-gradient(circle at 55% 68%,rgba(255,62,136,.035),transparent 32%),
    linear-gradient(180deg,rgba(2,7,13,.20),rgba(2,7,13,.38))!important;
}
.app[data-background-mode="default"] main{
  background:linear-gradient(180deg,rgba(4,9,15,.18),rgba(4,9,15,.30))!important;
}
.app[data-page="chat"][data-background-mode="default"] main{
  background:rgba(3,8,13,.055)!important;
}
.app[data-page="chat"][data-background-mode="default"] .chat-shell{
  background:rgba(3,8,13,.035)!important;
}
.app[data-page="chat"][data-background-mode="default"] .chat-main-panel{
  background:linear-gradient(180deg,rgba(3,8,14,.04),rgba(3,8,14,.10))!important;
}
.appearance-preview[data-mode="default"]::before{
  filter:saturate(1.12) brightness(.98) contrast(1.05)!important;
}


/* v62 — bundled galaxy default background (desktop + mobile) */
.app[data-background-mode="default"]::before{
  background-position:center center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  filter:saturate(1.08) brightness(.88) contrast(1.06)!important;
}
.app[data-background-mode="default"]::after{
  background:
    radial-gradient(circle at 22% 34%,rgba(255,39,185,.035),transparent 34%),
    radial-gradient(circle at 58% 55%,rgba(91,61,255,.04),transparent 38%),
    linear-gradient(180deg,rgba(2,5,12,.32),rgba(2,5,12,.52))!important;
}
.appearance-preview[data-mode="default"]::before{
  background-position:center center!important;
  background-size:cover!important;
  filter:saturate(1.08) brightness(.90) contrast(1.05)!important;
}
@media(max-width:800px){
  /* Shift left slightly so the magenta/purple nebula stays in frame on tall phones. */
  .app[data-background-mode="default"]::before{
    background-position:38% center!important;
  }
  .appearance-preview[data-mode="default"]::before{
    background-position:38% center!important;
  }
  .app[data-background-mode="default"]::after{
    background:
      radial-gradient(circle at 20% 32%,rgba(255,39,185,.035),transparent 36%),
      linear-gradient(180deg,rgba(2,5,12,.34),rgba(2,5,12,.56))!important;
  }
}

/* v63 — premium Discord-style Los Primos sidebar */
@media(min-width:801px){
  .app{grid-template-columns:240px minmax(0,1fr)}
}
#appSidebar{
  --sidebar-nav-text:#aebdd1;
  --sidebar-nav-icon:#9eafd0;
  display:flex;
  flex-direction:column;
  padding:13px 10px 12px!important;
  background:
    radial-gradient(circle at 10% 10%,rgba(24,64,103,.16),transparent 28%),
    linear-gradient(180deg,rgba(4,12,20,.97),rgba(3,10,17,.985))!important;
  border-right:1px solid rgba(94,124,158,.20)!important;
  box-shadow:10px 0 30px rgba(0,0,0,.12);
}
#appSidebar>.brand{
  flex:0 0 auto;
  gap:10px!important;
  min-height:48px;
  padding:0 2px 0 1px;
}
#appSidebar .brand .logo{
  width:38px!important;
  height:38px!important;
  border-radius:10px!important;
  border-color:rgba(78,116,157,.42)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.025),0 0 20px rgba(62,91,255,.11)!important;
}
#appSidebar .brand strong{
  color:#f2f6fc;
  font-size:14px!important;
  font-weight:850;
  letter-spacing:.005em;
}
#appSidebar .brand span{
  color:#7688a0;
  font-size:10.5px!important;
  margin-top:2px;
}
#appSidebar nav{
  flex:1 1 auto;
  min-height:0;
  margin-top:23px!important;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 0 10px;
  scrollbar-width:thin;
  scrollbar-color:rgba(89,116,146,.28) transparent;
}
#appSidebar nav::-webkit-scrollbar{width:5px}
#appSidebar nav::-webkit-scrollbar-thumb{background:rgba(89,116,146,.26);border-radius:99px}
.sidebar-section-head,
.sidebar-section-label{
  color:#8193b1!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
}
.sidebar-section-head{
  min-height:26px;
  padding:0 7px 7px 6px!important;
}
.sidebar-section-label{
  margin:17px 7px 7px!important;
  padding:0!important;
}
.nav-organize-btn{
  color:#98a8c2!important;
  font-size:9px!important;
  font-weight:850!important;
  padding:4px 5px!important;
  border-radius:7px!important;
}
.nav-organize-btn:hover,.nav-organize-btn.active{
  color:#dce7f7!important;
  background:rgba(36,58,83,.62)!important;
}
.workspace-nav{gap:3px!important}
.nav-sort-item{border-radius:10px!important}
#appSidebar .nav-item{
  position:relative;
  min-height:47px;
  gap:12px!important;
  padding:0 10px!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  background:transparent!important;
  color:var(--sidebar-nav-text)!important;
  font-size:13.5px;
  font-weight:600;
  line-height:1.1;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
#appSidebar .nav-sort-item .nav-item{padding-right:38px!important}
#appSidebar .nav-item>span:not(.nav-icon):not(.nav-count){
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#appSidebar .nav-item:hover{
  color:#eef5ff!important;
  background:rgba(19,40,61,.72)!important;
  border-color:rgba(75,111,151,.20)!important;
}
#appSidebar .nav-item.active{
  color:#f5f9ff!important;
  background:
    radial-gradient(circle at 18% 42%,rgba(77,133,255,.25),transparent 46%),
    linear-gradient(100deg,rgba(24,67,132,.92),rgba(7,45,96,.96))!important;
  border-color:rgba(63,119,205,.36)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,45,106,.16)!important;
}
#appSidebar .nav-item.active::before{
  content:"";
  position:absolute;
  left:-1px;
  top:9px;
  bottom:9px;
  width:2px;
  border-radius:99px;
  background:#72a8ff;
  box-shadow:0 0 10px rgba(84,145,255,.58);
}
.nav-icon{
  width:21px;
  height:21px;
  flex:0 0 21px;
  display:grid;
  place-items:center;
  color:var(--sidebar-nav-icon);
}
.nav-icon svg{
  display:block;
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.nav-icon svg rect,
.nav-icon svg circle{fill:none}
.nav-icon .nav-icon-dot{fill:currentColor;stroke:none}
#appSidebar .nav-item.active .nav-icon{color:#b9d2ff}
#appSidebar .nav-item:hover .nav-icon{color:#c2d2e9}
#appSidebar .nav-item .nav-count{
  min-width:20px;
  height:19px;
  padding:0 5px;
  margin-left:auto;
  border:1px solid rgba(89,133,186,.34)!important;
  background:rgba(18,48,79,.88)!important;
  color:#b9d8ff!important;
  box-shadow:none!important;
}
.nav-drag-handle{
  right:5px!important;
  width:29px!important;
  height:35px!important;
  color:#6c7d91!important;
}
.nav-drag-handle:hover{background:rgba(34,55,78,.78)!important;color:#bdcbe0!important}
.workspace-nav.organizing .nav-sort-item{background:rgba(9,20,31,.78)!important}
.sidebar-appearance-btn{margin:0!important;text-align:left!important}

#appSidebar .sidebar-bottom{
  position:static!important;
  flex:0 0 auto;
  margin-top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  padding:0 0 0!important;
  border-top:0!important;
}
.sidebar-signature{
  margin:0 2px 10px!important;
  padding:12px 5px 16px!important;
  min-height:112px;
  display:grid!important;
  align-content:center;
  justify-items:center;
  border-bottom:1px solid rgba(104,132,161,.16)!important;
}
.sidebar-signature span{
  font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive!important;
  font-size:31px!important;
  line-height:1!important;
  font-weight:650!important;
  letter-spacing:-.06em;
  transform:rotate(-3deg)!important;
  background:linear-gradient(95deg,#ffffff 0%,#f5f8ff 48%,#ff59b3 69%,#4f84ff 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
}
.sidebar-signature span::after{
  left:5%!important;
  right:-1%!important;
  bottom:-8px!important;
  height:3px!important;
  background:linear-gradient(90deg,#ff3068,#ff3dad 52%,#4b7dff)!important;
  box-shadow:0 0 13px rgba(255,48,158,.24)!important;
}
.sidebar-signature small{
  margin-top:12px!important;
  color:#c4ccda!important;
  font-size:7.5px!important;
  letter-spacing:.31em!important;
  font-weight:900!important;
}
.sidebar-user-card{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 28px;
  gap:9px;
  align-items:center;
  min-height:52px;
  margin:0 0 8px;
  padding:5px 2px;
}
.sidebar-user-avatar{
  width:34px;
  height:34px;
  border-radius:9px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#173959,#0e1d2c);
  border:1px solid rgba(91,139,184,.38);
  box-shadow:0 0 16px rgba(62,132,255,.10);
  color:#cce3ff;
  font-size:10px;
  font-weight:900;
}
.sidebar-user-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.sidebar-user-copy{min-width:0;display:grid;align-content:center;justify-items:start;gap:4px}
#appSidebar .user-email{
  width:100%;
  margin:0!important;
  color:#e7eef8;
  font-size:11.5px!important;
  font-weight:700;
  line-height:1.15;
}
.sidebar-profile-edit{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  border:1px solid rgba(68,102,132,.48);
  background:rgba(8,20,31,.62);
  color:#aebed0;
  cursor:pointer;
  font:800 13px/1 system-ui,sans-serif;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;
}
.sidebar-profile-edit:hover{
  background:rgba(24,58,88,.82);
  border-color:rgba(75,151,211,.66);
  color:#fff;
  transform:translateY(-1px);
}

#appSidebar .role-pill{
  margin:0!important;
  padding:3px 6px!important;
  color:#8fd0ff!important;
  background:rgba(10,52,82,.88)!important;
  border:1px solid rgba(41,111,156,.55)!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  line-height:1;
}
.sidebar-logout-btn{
  height:46px;
  border-radius:9px!important;
  background:rgba(7,18,29,.56)!important;
  border-color:rgba(63,94,124,.54)!important;
  color:#eef4fb!important;
  font-size:12px!important;
  font-weight:800!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}
.sidebar-logout-btn:hover{background:rgba(15,32,49,.78)!important;border-color:rgba(89,128,166,.62)!important}

@media(max-width:800px){
  #appSidebar{
    display:flex!important;
    flex-direction:column!important;
    width:min(294px,88vw)!important;
    padding:13px 10px 12px!important;
    overflow:hidden!important;
  }
  #appSidebar nav{
    display:block!important;
    flex:1 1 auto;
    overflow-y:auto;
    margin-top:17px!important;
    padding-bottom:8px;
  }
  #appSidebar .mobile-drawer-head{
    flex:0 0 auto;
    margin:0 0 10px!important;
    min-height:34px;
    padding:0 2px;
  }
  #appSidebar>.brand{min-height:44px}
  #appSidebar .brand .logo{width:36px!important;height:36px!important}
  #appSidebar .nav-item{min-height:45px;font-size:13.5px}
  #appSidebar .sidebar-bottom{
    flex:0 0 auto;
    margin-top:0!important;
    display:block!important;
    padding-top:0!important;
    border-top:0!important;
  }
  .sidebar-signature{min-height:92px;padding:8px 5px 13px!important;margin-bottom:7px!important}
  .sidebar-signature span{font-size:28px!important}
  .sidebar-user-card{min-height:46px;margin-bottom:7px}
  .sidebar-logout-btn{height:43px}
}

@media(max-height:720px){
  .sidebar-signature{min-height:78px!important;padding:7px 5px 11px!important}
  .sidebar-signature span{font-size:25px!important}
  .sidebar-signature small{margin-top:9px!important}
  #appSidebar .nav-item{min-height:42px}
  .sidebar-section-label{margin-top:11px!important}
}

/* v63 mobile drawer: keep the brand at the top like desktop; close control floats beside it. */
@media(max-width:800px){
  #appSidebar .mobile-drawer-head{
    position:absolute!important;
    top:12px!important;
    right:10px!important;
    z-index:2;
    width:36px;
    height:36px;
    min-height:36px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center;
  }
  #appSidebar .mobile-drawer-head span{display:none!important}
  #appSidebar .mobile-drawer-head .x-btn{
    width:34px;
    height:34px;
    border-radius:9px;
    background:rgba(13,27,41,.78);
    border:1px solid rgba(75,105,137,.38);
    color:#c7d4e5;
  }
  #appSidebar>.brand{padding-right:42px!important}
}


/* v64 direct desktop drag + mobile hold/drag sidebar ordering */
.nav-reorder-hint{
  color:#6f819d;
  font-size:8.5px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:none;
  white-space:nowrap;
  opacity:.9;
}
.nav-reorder-mobile{display:none}
#appSidebar .workspace-nav .nav-sort-item,
#appSidebar .workspace-nav .nav-sort-item>.nav-item{
  cursor:grab;
}
#appSidebar .workspace-nav .nav-sort-item.dragging,
#appSidebar .workspace-nav .nav-sort-item.dragging>.nav-item,
#appSidebar .workspace-nav.direct-reordering,
#appSidebar .workspace-nav.direct-reordering .nav-item{
  cursor:grabbing!important;
}
#appSidebar .workspace-nav .nav-sort-item{
  -webkit-user-drag:element;
}
#appSidebar .workspace-nav .nav-item{
  -webkit-user-select:none;
  user-select:none;
}
#appSidebar .workspace-nav .nav-sort-item.dragging{
  opacity:.72!important;
  transform:scale(.985);
  outline:1px solid rgba(92,153,255,.55)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.30),0 0 0 1px rgba(54,116,219,.14) inset!important;
}
#appSidebar .workspace-nav .nav-sort-item.drag-over{
  box-shadow:0 -2px 0 #5b9dff inset!important;
}

@media(max-width:800px){
  .nav-reorder-desktop{display:none}
  .nav-reorder-mobile{display:inline}
  #appSidebar .workspace-nav .nav-sort-item,
  #appSidebar .workspace-nav .nav-sort-item>.nav-item{
    cursor:pointer;
  }
  #appSidebar .workspace-nav .nav-sort-item{
    -webkit-user-drag:none;
    touch-action:pan-y;
  }
  #appSidebar .workspace-nav.hold-reordering .nav-sort-item{
    touch-action:none;
  }
  #appSidebar .workspace-nav.hold-reordering .nav-sort-item.dragging{
    opacity:.78!important;
    transform:scale(.975);
    box-shadow:0 14px 30px rgba(0,0,0,.34),0 0 0 1px rgba(72,135,233,.22) inset!important;
  }
}


/* v65 smooth mobile sidebar reorder */
.nav-drag-ghost{
  position:fixed!important;
  z-index:100000!important;
  margin:0!important;
  pointer-events:none!important;
  opacity:.98!important;
  transform-origin:center center;
  will-change:transform;
  border-radius:11px!important;
  background:linear-gradient(90deg,rgba(16,48,96,.98),rgba(8,39,82,.98))!important;
  outline:1px solid rgba(105,166,255,.65)!important;
  box-shadow:0 18px 42px rgba(0,0,0,.42),0 0 24px rgba(49,116,226,.18)!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}
.nav-drag-ghost>.nav-item{
  background:transparent!important;
  box-shadow:none!important;
}
#appSidebar .workspace-nav .nav-sort-item.mobile-drag-source{
  opacity:0!important;
  box-shadow:none!important;
  outline-color:transparent!important;
  transform:none!important;
}
#appSidebar .workspace-nav.mobile-reorder-active{
  overscroll-behavior:none;
}
html.nav-reordering,
body.nav-reordering{
  overscroll-behavior:none!important;
}

@media(max-width:800px){
  #appSidebar{
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
  }
  #appSidebar .workspace-nav.mobile-reorder-active,
  #appSidebar .workspace-nav.mobile-reorder-active .nav-sort-item,
  #appSidebar .workspace-nav.mobile-reorder-active .nav-item{
    touch-action:none!important;
  }
  #appSidebar .workspace-nav .nav-sort-item:not(.mobile-drag-source){
    will-change:transform;
  }
  .nav-drag-ghost{
    transition:box-shadow .12s ease, outline-color .12s ease;
  }
}


/* v66: member-owned chat edit/delete controls */
.chat-message-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:5px;
  opacity:0;
  transform:translateY(-1px);
  transition:opacity .16s ease;
}
.chat-message:hover .chat-message-actions,
.chat-message:focus-within .chat-message-actions{opacity:1}
.chat-message-meta .chat-message-actions>button.chat-action-btn{
  opacity:1;
  width:auto;
  height:26px;
  margin-left:0;
  padding:0 9px;
  border:1px solid rgba(130,166,210,.18);
  border-radius:8px;
  background:rgba(12,25,40,.7);
  color:#aac1dc;
  font-size:10px;
  font-weight:800;
  letter-spacing:.01em;
}
.chat-message-meta .chat-message-actions>button.chat-action-btn:hover{
  background:rgba(35,91,175,.26);
  border-color:rgba(79,142,239,.42);
  color:#e7f1ff;
}
.chat-message-meta .chat-message-actions>button.chat-action-btn.danger:hover{
  background:rgba(165,35,58,.2);
  border-color:rgba(255,92,112,.35);
  color:#ff97a4;
}
.chat-edited{
  color:#64778d;
  font-size:9.5px;
  font-style:italic;
  white-space:nowrap;
}
.chat-edit-box{margin-top:6px;max-width:760px}
.chat-edit-input{
  display:block;
  width:100%;
  min-height:62px;
  max-height:180px;
  resize:none;
  overflow-y:auto;
  padding:10px 12px;
  border:1px solid rgba(84,151,244,.48);
  border-radius:11px;
  outline:none;
  background:rgba(6,16,29,.92);
  color:#eef5ff;
  font:inherit;
  font-size:14px;
  line-height:1.45;
  box-shadow:0 0 0 3px rgba(45,111,220,.10);
}
.chat-edit-input:focus{
  border-color:#5c9dff;
  box-shadow:0 0 0 3px rgba(45,111,220,.17),0 10px 28px rgba(0,0,0,.14);
}
.chat-edit-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:7px}
.chat-edit-actions .btn{min-height:31px;padding:6px 12px;font-size:11px}
.chat-message.is-editing{background:linear-gradient(90deg,rgba(31,80,153,.08),transparent);border-radius:12px}

@media (max-width:900px){
  .chat-message-actions{opacity:1;gap:4px;flex-basis:100%;margin-left:0;margin-top:3px}
  .chat-message-meta .chat-message-actions>button.chat-action-btn{height:28px;padding:0 10px;font-size:10.5px}
  .chat-edit-input{font-size:13px;min-height:68px}
  .chat-edit-actions .btn{min-height:34px}
}

/* v67: message context menu — right-click desktop / long-press mobile */
.chat-context-backdrop{
  position:fixed;
  inset:0;
  z-index:11990;
  background:transparent;
}
.chat-context-menu{
  position:fixed;
  z-index:12000;
  width:210px;
  padding:7px;
  border:1px solid rgba(119,153,194,.22);
  border-radius:12px;
  background:rgba(8,17,28,.985);
  box-shadow:0 18px 48px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.025) inset;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transform-origin:top left;
  animation:chatContextIn .1s ease-out;
}
@keyframes chatContextIn{
  from{opacity:0;transform:scale(.97) translateY(-2px)}
  to{opacity:1;transform:scale(1) translateY(0)}
}
.chat-context-title{
  padding:6px 9px 5px;
  color:#687b91;
  font-size:9px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.chat-context-item{
  width:100%;
  min-height:38px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#dbe7f5;
  font:inherit;
  font-size:12px;
  font-weight:750;
  text-align:left;
  cursor:pointer;
}
.chat-context-item:hover,.chat-context-item:focus-visible{
  outline:none;
  background:rgba(49,105,188,.24);
  color:#fff;
}
.chat-context-item.danger{color:#ff9ba7}
.chat-context-item.danger:hover,.chat-context-item.danger:focus-visible{
  background:rgba(173,40,64,.23);
  color:#ffc1c9;
}
.chat-context-icon{
  width:20px;
  text-align:center;
  color:#7898bc;
  font-size:15px;
  line-height:1;
}
.chat-context-item.danger .chat-context-icon{color:#e97182}
.chat-context-cancel{display:none}
.chat-message{
  -webkit-touch-callout:none;
}
body.chat-context-open{
  overscroll-behavior:none;
}

@media (max-width:700px){
  .chat-context-backdrop{
    background:rgba(0,0,0,.42);
    backdrop-filter:blur(1.5px);
    -webkit-backdrop-filter:blur(1.5px);
  }
  .chat-context-menu{
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
    width:auto;
    padding:8px;
    border-radius:17px;
    transform-origin:bottom center;
    animation:chatContextSheetIn .16s cubic-bezier(.2,.8,.2,1);
  }
  @keyframes chatContextSheetIn{
    from{opacity:0;transform:translateY(14px) scale(.985)}
    to{opacity:1;transform:translateY(0) scale(1)}
  }
  .chat-context-title{padding:7px 11px 8px;font-size:9.5px}
  .chat-context-item{
    min-height:48px;
    padding:10px 12px;
    border-radius:12px;
    font-size:14px;
  }
  .chat-context-icon{width:24px;font-size:18px}
  .chat-context-cancel{
    display:flex;
    margin-top:5px;
    border-top:1px solid rgba(130,160,195,.12);
    border-radius:0 0 12px 12px;
    color:#9db0c6;
  }
  body.chat-context-open{
    overflow:hidden;
    touch-action:none;
  }
}

/* v68 Drop Calendar / Drop Hub */
.drops-subtitle{margin:6px 0 0;color:var(--muted);font-size:13px}
.drop-setup-notice{margin:0 0 14px;padding:12px 14px;border:1px solid #5f4d25;background:rgba(113,83,22,.28);border-radius:12px;color:#f4d98d;font-size:13px}
.drop-month-toolbar{display:flex;align-items:center;justify-content:center;gap:14px;margin:4px 0 14px}
.drop-month-toolbar h2{margin:0;min-width:190px;text-align:center;font-size:17px}
.drop-desktop-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:start}
.drop-calendar-card,.drop-upcoming-panel{background:rgba(10,15,21,.88);border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.2);overflow:hidden;backdrop-filter:blur(12px)}
.drop-weekdays{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--line);background:rgba(255,255,255,.018)}
.drop-weekdays span{padding:10px;text-align:center;color:#8290a0;font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.drop-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.drop-day{min-height:124px;padding:9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(9,14,20,.45);min-width:0}
.drop-day:nth-child(7n){border-right:0}.drop-day:nth-last-child(-n+7){border-bottom:0}
.drop-day.outside{opacity:.35}.drop-day.today{background:rgba(46,155,255,.08);box-shadow:inset 0 0 0 1px rgba(46,155,255,.34)}
.drop-day-number{font-size:11px;font-weight:850;color:#aab5c2;margin-bottom:6px}.drop-day.today .drop-day-number{color:#83c8ff}
.drop-day-events{display:grid;gap:5px}.drop-chip{display:block;width:100%;padding:6px 7px;border:1px solid rgba(63,156,232,.25);border-radius:8px;background:rgba(28,93,143,.2);color:#f2f7fb;text-align:left;cursor:pointer;overflow:hidden}
.drop-chip:hover{background:rgba(34,118,181,.32);border-color:rgba(80,176,255,.45)}.drop-chip span{display:block;color:#78bdf0;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.drop-chip b{display:block;margin-top:2px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drop-more{font-size:9px;color:#788492}.drop-upcoming-panel{padding:14px}.drop-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.drop-panel-head h3{margin:3px 0 0;font-size:15px}.drop-count-pill{min-width:28px;height:28px;padding:0 8px;display:grid;place-items:center;border-radius:999px;background:#142434;color:#8ecbfb;font-size:11px;font-weight:850;border:1px solid #223a50}
.drop-upcoming-list{display:grid;gap:8px}.drop-upcoming-card{width:100%;display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:12px;background:#0d141c;color:var(--text);text-align:left;cursor:pointer}.drop-upcoming-card:hover{background:#111b25;border-color:#304052}.drop-upcoming-thumb,.drop-mobile-thumb{display:grid;place-items:center;background:#151d27;border:1px solid #25303c;overflow:hidden}.drop-upcoming-thumb{width:52px;height:52px;border-radius:10px}.drop-upcoming-thumb img,.drop-mobile-thumb img{width:100%;height:100%;object-fit:contain}.drop-upcoming-thumb span,.drop-mobile-thumb span{font-weight:900;color:#728091}.drop-upcoming-copy{min-width:0}.drop-upcoming-copy>span{display:block;color:#69b6ee;font-size:9px;text-transform:uppercase;font-weight:850;letter-spacing:.06em}.drop-upcoming-copy strong{display:block;font-size:12px;margin:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drop-upcoming-copy small{display:block;color:#7f8b98;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drop-countdown{text-align:right}.drop-countdown small{display:block;color:#657180;font-size:8px;font-weight:800}.drop-countdown b{font-size:10px;color:#d8eafb}.drop-empty{padding:22px 12px;text-align:center;color:var(--muted);font-size:12px;border:1px dashed #2a3541;border-radius:12px}
.drop-mobile-agenda{display:none}.drop-mobile-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:9px}.drop-mobile-head strong{font-size:15px}.drop-mobile-list{display:grid;gap:8px}.drop-mobile-card{width:100%;display:grid;grid-template-columns:44px 58px minmax(0,1fr) 18px;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:13px;background:rgba(10,15,21,.9);color:var(--text);text-align:left}.drop-mobile-date{text-align:center}.drop-mobile-date b{display:block;font-size:18px}.drop-mobile-date span{display:block;color:#75bced;font-size:9px;text-transform:uppercase;font-weight:850}.drop-mobile-thumb{width:58px;height:58px;border-radius:10px}.drop-mobile-copy{min-width:0}.drop-mobile-copy>span{display:block;color:#73bff3;font-size:9px;font-weight:850;text-transform:uppercase}.drop-mobile-copy strong{display:block;margin:2px 0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drop-mobile-copy small{display:block;color:#8693a1;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drop-mobile-arrow{font-size:24px;color:#607080}
.drop-detail-modal{max-width:850px}.drop-detail-hero{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px}.drop-detail-image{min-height:220px;border:1px solid var(--line);border-radius:16px;background:#0c131b;display:grid;place-items:center;overflow:hidden}.drop-detail-image img{width:100%;height:100%;max-height:300px;object-fit:contain}.drop-detail-image span{font-size:34px;font-weight:900;color:#536071}.drop-detail-badges{display:flex;gap:7px;flex-wrap:wrap}.drop-detail-badges span{padding:5px 8px;border-radius:999px;background:#15212d;border:1px solid #26394a;color:#86c8f8;font-size:10px;font-weight:850;text-transform:uppercase}.drop-detail-badges .drop-live-badge{color:#b9e0ff}.drop-detail-main h3{font-size:23px;margin:10px 0 5px}.drop-detail-time{margin:0 0 14px;color:#9ba8b5}.drop-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.drop-stat-grid>div{padding:12px;border:1px solid var(--line);border-radius:11px;background:#0e151d}.drop-stat-grid span,.drop-stat-grid small{display:block;color:#758392;font-size:9px;text-transform:uppercase;font-weight:800}.drop-stat-grid strong{display:block;margin-top:4px;font-size:16px}.drop-stat-grid strong.positive{color:#67d6a0}.drop-stat-grid small{margin-top:2px;text-transform:none;font-weight:600}.drop-detail-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.drop-detail-links a{text-decoration:none}.drop-notes{margin-top:16px;padding:14px;border-radius:12px;background:#0d141c;border:1px solid var(--line)}.drop-notes p{margin:6px 0 0;color:#b6c0ca;font-size:12px;line-height:1.55}.drop-editor-modal{max-width:820px}.drop-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.drop-editor-grid .span-2{grid-column:1/-1}.drop-editor-grid textarea{resize:vertical}
#deleteDropBtn{margin-left:6px}

@media(max-width:1050px){.drop-desktop-layout{grid-template-columns:minmax(0,1fr) 290px}.drop-day{min-height:112px}}
@media(max-width:800px){
  .drops-topbar{align-items:flex-start}.drops-subtitle{font-size:11px}.drop-month-toolbar{justify-content:space-between}.drop-month-toolbar h2{font-size:15px;min-width:0;flex:1}
  .drop-desktop-layout{display:block}.drop-upcoming-panel{display:none}.drop-mobile-agenda{display:block;margin-top:14px}.drop-mobile-head{margin-top:5px}.drop-detail-modal,.drop-editor-modal{width:calc(100vw - 22px);max-height:calc(100vh - 24px);overflow:auto}
  .drop-weekdays span{padding:7px 2px;font-size:8px}.drop-day{min-height:64px;padding:4px}.drop-day-number{font-size:9px;margin-bottom:3px}.drop-day-events{gap:2px}.drop-chip{min-height:15px;padding:2px 3px;border-radius:5px}.drop-chip span{font-size:6px;line-height:1.1}.drop-chip b{display:none}.drop-more{font-size:7px}
  .drop-detail-hero{grid-template-columns:1fr}.drop-detail-image{min-height:180px;max-height:240px}.drop-detail-main h3{font-size:20px}.drop-stat-grid{grid-template-columns:repeat(2,1fr)}.drop-detail-links{display:grid;grid-template-columns:1fr}.drop-detail-links .btn{width:100%;text-align:center}.drop-editor-grid{grid-template-columns:1fr}.drop-editor-grid .span-2{grid-column:auto}
}
@media(max-width:480px){.drop-stat-grid{grid-template-columns:1fr 1fr}.drop-mobile-card{grid-template-columns:38px 52px minmax(0,1fr) 14px;padding:9px 8px}.drop-mobile-thumb{width:52px;height:52px}.drop-mobile-copy strong{font-size:12px}.drop-mobile-copy small{font-size:9px}}

/* v69 — event types, timezone-aware scheduling, multi-link editors */
.field-help{display:block;margin-top:6px;color:#718091;font-size:10px;line-height:1.35}.multi-link-field{padding:10px;border:1px solid var(--line);border-radius:12px;background:rgba(8,14,20,.35)}.multi-link-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.multi-link-head label{margin:0}.btn.compact{padding:6px 9px;font-size:11px}.multi-link-editor{display:grid;gap:7px}.multi-link-row{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(0,1.6fr) 34px;gap:7px;align-items:center}.multi-link-row.ebay-comp-row{grid-template-columns:minmax(110px,.65fr) 95px minmax(0,1.45fr) 34px}.multi-link-row input{min-width:0}.icon-mini-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:#111922;color:#9facb9;font-size:18px;cursor:pointer}.icon-mini-btn:hover{background:#19232e;color:#fff}.drop-detail-time small{display:block;margin-top:5px;color:#6f7f8f;font-size:10px}.drop-detail-badges .drop-type-badge.drawing{color:#ffd88a;border-color:#5d4822;background:#211b10}.drop-detail-badges .drop-type-badge.drop{color:#9fd3ff}.drop-chip span{text-transform:uppercase;letter-spacing:.04em}
@media(max-width:700px){.multi-link-row,.multi-link-row.ebay-comp-row{grid-template-columns:1fr 34px}.multi-link-row.ebay-comp-row .drop-comp-price{grid-column:1/2}.multi-link-row .drop-link-url,.multi-link-row .drop-comp-url{grid-column:1/2}.multi-link-row .remove-multi-link{grid-column:2;grid-row:1/span 2}.multi-link-head{align-items:flex-start}.btn.compact{white-space:nowrap}}


/* v70 — interactive admin calendar */
.drop-day[data-drop-day]{position:relative;cursor:default;transition:background .12s ease,border-color .12s ease}
body.admin-mode .drop-day[data-drop-day],.admin .drop-day[data-drop-day]{cursor:pointer}
.drop-day[data-drop-day]:hover{background:rgba(255,255,255,.025)}
.drop-day.today[data-drop-day]:hover{background:rgba(46,155,255,.11)}
.drop-day.selected[data-drop-day]{background:rgba(46,155,255,.12);box-shadow:inset 0 0 0 2px rgba(88,177,255,.78)}
.drop-day.selected .drop-day-number{color:#b8e2ff;font-weight:950}
.drop-day-context-menu{position:fixed;z-index:10050;width:238px;padding:8px;border:1px solid #304052;border-radius:13px;background:#0d141c;box-shadow:0 18px 50px rgba(0,0,0,.45);user-select:none}
.drop-day-context-menu.hidden{display:none}
.drop-day-menu-head{padding:7px 8px 9px;border-bottom:1px solid var(--line);margin-bottom:5px}
.drop-day-menu-head strong{display:block;font-size:12px;color:#eef5fb}.drop-day-menu-head small{display:block;margin-top:2px;font-size:8px;font-weight:850;letter-spacing:.08em;color:#6d7c8b}
.drop-day-context-menu>button{width:100%;display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;align-items:center;padding:9px 8px;border:0;border-radius:9px;background:transparent;color:var(--text);text-align:left;cursor:pointer}
.drop-day-context-menu>button:hover{background:#15212c}.drop-day-context-menu>button>span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#142434;color:#86cbff;font-weight:900}.drop-day-context-menu b{display:block;font-size:11px}.drop-day-context-menu small{display:block;margin-top:2px;color:#718091;font-size:9px}
.drop-date-time-pair{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(105px,.75fr);gap:7px}.drop-date-time-pair input{min-width:0}
@media(max-width:700px){.drop-date-time-pair{grid-template-columns:1fr 1fr}}

.drop-calendar-admin-hint{margin:-5px 0 12px;text-align:center;color:#748393;font-size:10px}

/* v73 — multi-item events + URL import */
.drop-editor-modal{max-width:930px}
.drop-items-section{border:1px solid var(--line);border-radius:14px;padding:14px;background:rgba(8,14,20,.38)}
.drop-items-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.drop-items-head h3{margin:3px 0 0;font-size:16px}
.drop-import-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin-top:10px}
.drop-import-bar input{min-width:0}
.drop-items-editor{display:grid;gap:12px;margin-top:12px}
.drop-item-editor{border:1px solid #273746;border-radius:13px;background:#0b1219;padding:12px}
.drop-item-editor-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.drop-item-editor-head>div{min-width:0}.drop-item-number{display:block;color:#738396;font-size:9px;font-weight:900;letter-spacing:.12em}.drop-item-heading{display:block;margin-top:2px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drop-item-import-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:4px}.drop-item-import-row input{min-width:0}
.drop-item-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:9px}.drop-item-grid .span-2{grid-column:1/-1}
.drop-items-detail-list{display:grid;gap:12px;margin-top:16px}.drop-item-detail{border:1px solid var(--line);border-radius:14px;background:#0b1219;padding:13px}.drop-item-detail-top{display:grid;grid-template-columns:145px minmax(0,1fr);gap:14px}.drop-item-detail-image{height:145px;border:1px solid var(--line);border-radius:11px;background:#0d151d;display:grid;place-items:center;overflow:hidden}.drop-item-detail-image img{width:100%;height:100%;object-fit:contain}.drop-item-detail-image span{font-size:25px;font-weight:900;color:#536071}.drop-item-detail-copy h4{margin:4px 0 10px;font-size:17px}.event-summary-hero .drop-detail-image{min-height:170px}.event-links{margin-top:10px}.item-links{margin-top:11px}
@media(max-width:700px){.drop-import-bar,.drop-item-import-row{grid-template-columns:1fr}.drop-import-bar .btn,.drop-item-import-row .btn{width:100%}.drop-items-head{align-items:flex-start}.drop-item-grid{grid-template-columns:1fr}.drop-item-grid .span-2{grid-column:auto}.drop-item-detail-top{grid-template-columns:1fr}.drop-item-detail-image{height:180px}.drop-item-editor-head{align-items:flex-start;flex-wrap:wrap}}

/* v74 event-page import */
.drop-event-import-panel{
  border:1px solid rgba(74,163,255,.22);
  border-radius:14px;
  padding:14px;
  background:rgba(35,116,196,.06);
}
.drop-event-import-panel .drop-import-bar{margin-top:9px}

/* v76 — mobile event images + Target ACO choices */
.drop-aco-choice-panel{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(74,163,255,.28);
  border-radius:14px;
  background:rgba(29,111,186,.07);
}
.drop-aco-choice-copy h4{margin:4px 0 6px;font-size:16px}
.drop-aco-choice-copy p{margin:0;color:#aab6c2;font-size:12px;line-height:1.5}
.drop-aco-choice-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
.drop-aco-choice-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.drop-aco-choice-actions .btn span{min-width:22px;padding:2px 6px;border-radius:999px;background:rgba(255,255,255,.08);font-size:10px;font-weight:900}
.drop-aco-choice-actions .profit-action{border-color:rgba(86,205,143,.38);background:rgba(50,139,93,.16);color:#9ce2b9}
.drop-aco-choice-actions .profit-action:hover{background:rgba(50,139,93,.24)}
.drop-aco-choice-actions .profit-action.disabled,.drop-aco-choice-actions .profit-action:disabled{opacity:.45;cursor:not-allowed;filter:none}
.drop-aco-choice-note{display:block;margin-top:9px;color:#718090;font-size:10px;line-height:1.45}

@media(max-width:700px){
  /* Never crop product art on phones. The frame scales to the card width and the image stays fully contained. */
  .drop-item-detail-image{
    height:auto;
    aspect-ratio:4/3;
    padding:10px;
  }
  .drop-item-detail-image img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    object-position:center;
  }
  .event-summary-hero .drop-detail-image{
    height:auto;
    min-height:0;
    aspect-ratio:4/3;
    padding:10px;
  }
  .event-summary-hero .drop-detail-image img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    object-position:center;
  }
  /* With multiple items the hero repeats item 1 and wastes a lot of phone space, so show the event info first. */
  .event-summary-hero.multi-item-event .drop-detail-image{display:none}
  .drop-aco-choice-actions{display:grid;grid-template-columns:1fr}
  .drop-aco-choice-actions .btn{width:100%;min-height:46px}
}

/* v80 — mobile event modal viewport fit
   Keeps Drop/Drawing details fully inside the phone viewport, including Safari,
   without shrinking the product art or changing the desktop layout. */
@media(max-width:800px){
  #dropDetailModal,
  #dropEditorModal{
    padding:12px;
    place-items:start center;
    overflow-y:auto;
    overflow-x:hidden;
  }

  #dropDetailModal .drop-detail-modal,
  #dropEditorModal .drop-editor-modal{
    width:100%;
    max-width:100%;
    min-width:0;
    max-height:calc(100dvh - 24px);
    margin:0;
    overflow-y:auto;
    overflow-x:hidden;
  }

  #dropDetailModal .modal-head{
    align-items:flex-start;
    gap:10px;
  }
  #dropDetailModal .modal-head>div,
  #dropDetailBody,
  #dropDetailModal .event-summary-hero,
  #dropDetailModal .drop-detail-main,
  #dropDetailModal .drop-items-detail-list,
  #dropDetailModal .drop-item-detail,
  #dropDetailModal .drop-item-detail-top,
  #dropDetailModal .drop-item-detail-copy,
  #dropDetailModal .drop-stat-grid{
    min-width:0;
    max-width:100%;
  }
  #dropDetailModal .modal-head h2,
  #dropDetailModal .drop-detail-main h3,
  #dropDetailModal .drop-item-detail-copy h4{
    overflow-wrap:anywhere;
  }
  #dropDetailModal .x-btn{
    flex:0 0 auto;
    line-height:1;
  }
  #dropDetailModal .drop-item-detail{
    overflow:hidden;
  }
  #dropDetailModal .drop-detail-links .btn{
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
  }
}

@media(max-width:480px){
  #dropDetailModal,
  #dropEditorModal{
    padding:8px;
  }
  #dropDetailModal .drop-detail-modal,
  #dropEditorModal .drop-editor-modal{
    max-height:calc(100dvh - 16px);
    padding:14px;
    border-radius:14px;
  }
  #dropDetailModal .drop-item-detail{
    padding:10px;
  }
  #dropDetailModal .drop-stat-grid{
    gap:7px;
  }
  #dropDetailModal .drop-stat-grid>div{
    padding:10px;
  }
}


/* v81 — mobile Drop Calendar readability cleanup
   Mobile-only: shorter calendar, brighter dates, clearer event markers,
   stronger selection state, compact controls, and easier-to-scan agenda. */
.drop-hint-mobile,.drop-mobile-event-count{display:none}

@media(max-width:800px){
  /* The mobile app bar already says Drop Calendar, so remove the duplicate
     desktop-style intro and keep the useful controls close to the calendar. */
  .drops-topbar{
    min-height:0;
    margin:0 0 8px;
    padding:0;
    display:flex;
    justify-content:flex-end;
    align-items:center;
  }
  .drops-topbar>div:first-child{display:none}
  .drops-topbar .top-actions{
    width:100%;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:8px;
    margin:0;
  }
  .drops-topbar .top-actions .btn{
    min-height:42px;
    padding:9px 14px;
    font-size:13px;
    border-radius:11px;
  }

  .drop-month-toolbar{
    gap:9px;
    margin:2px 0 7px;
  }
  .drop-month-toolbar h2{
    font-size:17px;
    font-weight:900;
    color:#f2f6fb;
    letter-spacing:-.01em;
  }
  .drop-month-toolbar .btn{
    width:44px;
    min-width:44px;
    height:42px;
    padding:0;
    display:grid;
    place-items:center;
    font-size:20px;
    border-radius:11px;
  }

  .drop-calendar-admin-hint{
    margin:0 0 8px;
    color:#98a7b7;
    font-size:10px;
    line-height:1.25;
  }
  .drop-hint-desktop{display:none}
  .drop-hint-mobile{display:inline}

  .drop-calendar-card{
    border-radius:14px;
    border-color:#2b3948;
    box-shadow:0 12px 30px rgba(0,0,0,.2);
  }
  .drop-weekdays{
    background:rgba(255,255,255,.028);
    border-bottom-color:#2a3744;
  }
  .drop-weekdays span{
    padding:7px 1px;
    color:#9eacba;
    font-size:9px;
    font-weight:900;
    letter-spacing:.07em;
  }

  /* Keep a real month calendar, just sized for a phone instead of a desktop. */
  .drop-day{
    min-height:52px;
    padding:4px 4px 3px;
    border-color:#26333f;
    background:rgba(12,19,27,.72);
    overflow:hidden;
  }
  .drop-day.outside{opacity:.26}
  .drop-day-number{
    margin:0 0 3px;
    min-height:19px;
    display:flex;
    align-items:center;
    color:#d2dbe5;
    font-size:11px;
    line-height:1;
    font-weight:900;
  }
  .drop-day.today{
    background:rgba(42,132,211,.12);
    box-shadow:inset 0 0 0 1px rgba(75,165,241,.44);
  }
  .drop-day.today .drop-day-number{
    width:23px;
    min-width:23px;
    height:23px;
    min-height:23px;
    justify-content:center;
    margin:-1px 0 1px -1px;
    border-radius:999px;
    background:#238bda;
    color:white;
  }
  .drop-day.selected,
  .drop-day.selected[data-drop-day]{
    background:rgba(45,142,224,.2);
    box-shadow:inset 0 0 0 2px #48aaf2;
  }
  .drop-day.selected .drop-day-number{
    color:#fff;
    font-weight:950;
  }
  .drop-day.has-events:not(.selected){
    background:rgba(18,37,53,.78);
  }

  .drop-day-events{gap:2px;position:relative}
  .drop-chip{
    min-height:17px;
    height:17px;
    padding:1px 3px;
    border-radius:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .drop-chip span{
    width:100%;
    color:#8fd0ff;
    font-size:7.5px;
    line-height:1;
    font-weight:950;
    letter-spacing:.04em;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:clip;
  }
  .drop-chip b{display:none}
  .drop-chip.drawing{
    border-color:rgba(231,178,73,.55);
    background:rgba(121,82,18,.28);
  }
  .drop-chip.drawing span{color:#ffd581}
  .drop-chip.drop{
    border-color:rgba(73,170,241,.52);
    background:rgba(32,105,163,.3);
  }
  .drop-chip.drop span{color:#94d3ff}
  /* More than one event on a date: keep the cell compact and surface a count. */
  .drop-day-events .drop-chip:nth-of-type(n+2){display:none}
  .drop-mobile-event-count{
    position:absolute;
    right:1px;
    bottom:1px;
    min-width:14px;
    height:14px;
    padding:0 3px;
    border-radius:999px;
    display:grid;
    place-items:center;
    background:#1d2d3b;
    border:1px solid #395168;
    color:#b9d8ef;
    font-size:7px;
    font-weight:900;
    line-height:1;
  }
  .drop-more{display:none}

  .drop-mobile-agenda{margin-top:11px}
  .drop-mobile-head{
    justify-content:flex-start;
    align-items:baseline;
    gap:9px;
    margin:0 0 8px;
  }
  .drop-mobile-head .eyebrow{font-size:9px}
  .drop-mobile-head strong{
    font-size:17px;
    color:#f0f5fa;
  }
  .drop-mobile-list{gap:9px}
  .drop-mobile-card{
    grid-template-columns:38px 54px minmax(0,1fr) 16px;
    gap:9px;
    min-height:76px;
    padding:9px;
    border-color:#2a3947;
    border-radius:13px;
    background:rgba(11,18,25,.94);
  }
  .drop-mobile-date b{font-size:20px;color:#f3f7fb;line-height:1}
  .drop-mobile-date span{margin-top:3px;font-size:9px;color:#79c4f6}
  .drop-mobile-thumb{width:54px;height:54px;border-radius:10px}
  .drop-mobile-copy>span{
    font-size:9.5px;
    color:#83ccfb;
    letter-spacing:.025em;
  }
  .drop-mobile-copy strong{
    margin:3px 0;
    font-size:13.5px;
    line-height:1.22;
    color:#eef4f9;
  }
  .drop-mobile-copy small{
    font-size:10px;
    color:#9aa7b5;
  }
  .drop-mobile-arrow{font-size:25px;color:#8ca1b3}
}

@media(max-width:480px){
  .drop-day{min-height:50px;padding:4px 3px 3px}
  .drop-day-number{font-size:10.5px}
  .drop-weekdays span{font-size:8.5px}
  .drop-chip span{font-size:7px}
  .drop-mobile-card{grid-template-columns:36px 50px minmax(0,1fr) 14px;padding:8px;gap:8px}
  .drop-mobile-thumb{width:50px;height:50px}
}


/* v82 — Target Drop participation, product selection, and ACO run modes
   Designed as one responsive feature for desktop + mobile. */
.drop-participation-admin{
  border:1px solid rgba(59,160,244,.28);
  border-radius:14px;
  padding:14px;
  background:linear-gradient(180deg,rgba(38,126,204,.08),rgba(8,14,20,.32));
}
.drop-participation-admin-head h3{margin:3px 0 0;font-size:17px}
.drop-participation-option-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:12px;
}
.drop-participation-option{
  position:relative;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:10px;
  align-items:start;
  min-width:0;
  padding:13px;
  border:1px solid #283949;
  border-radius:13px;
  background:#0b131b;
  cursor:pointer;
}
.drop-participation-option:hover{border-color:#3c5b73;background:#0f1a24}
.drop-participation-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.drop-participation-check{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid #3a4c5e;
  border-radius:8px;
  background:#111b25;
  color:transparent;
  font-weight:950;
}
.drop-participation-option input:checked + .drop-participation-check{
  background:#2e9af0;
  border-color:#59b7ff;
  color:white;
  box-shadow:0 0 0 3px rgba(46,154,240,.12);
}
.drop-participation-option strong{display:block;font-size:13px;color:#eef6fd}
.drop-participation-option small{display:block;margin-top:5px;color:#8e9cac;font-size:10px;line-height:1.45}
.drop-participation-tip{
  margin-top:10px;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:#8190a0;
  font-size:10px;
  line-height:1.45;
}

.drop-profitable-explainer{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:12px;
  padding:10px 12px;
  border:1px solid rgba(83,205,143,.28);
  border-radius:11px;
  background:rgba(48,137,91,.11);
}
.drop-profitable-explainer strong{white-space:nowrap;color:#a9e8c4;font-size:12px}
.drop-profitable-explainer span{color:#8fa99b;font-size:10px;line-height:1.4}

.drop-target-action-panel{
  margin-top:12px;
  padding:14px;
  border:1px solid #293947;
  border-radius:14px;
  background:#0b1219;
}
.drop-selection-status{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
}
.drop-selection-status strong{display:block;margin-top:3px;font-size:14px}
.drop-target-action-panel .drop-aco-choice-actions{margin-top:0}
.drop-target-action-panel .drop-aco-choice-actions .btn:disabled{opacity:.45;cursor:not-allowed}

.drop-item-detail-title-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.drop-item-detail-title-row>div{min-width:0}
.drop-item-detail.aco-selectable{
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.drop-item-detail.aco-selectable.selected{
  border-color:#47aaf3;
  background:linear-gradient(180deg,rgba(38,130,207,.12),#0b1219 48%);
  box-shadow:inset 0 0 0 1px rgba(71,170,243,.24),0 8px 28px rgba(0,0,0,.12);
}
.drop-item-select-toggle{
  flex:0 0 auto;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 10px;
  border:1px solid #395064;
  border-radius:9px;
  background:#101922;
  color:#b7c6d4;
  font:inherit;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.drop-item-select-toggle span{
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border:1px solid #496177;
  border-radius:5px;
  color:transparent;
  background:#0b1219;
}
.drop-item-select-toggle.selected{
  border-color:#49aef7;
  background:rgba(45,145,222,.15);
  color:#a9daff;
}
.drop-item-select-toggle.selected span{
  background:#2d9aed;
  border-color:#5cbbff;
  color:#fff;
}
.drop-item-aco-unavailable{
  flex:0 0 auto;
  padding:6px 8px;
  border:1px solid #3a414a;
  border-radius:8px;
  color:#7e8b97;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
}
.drop-lineup-tbd{
  display:grid;
  gap:5px;
  padding:18px!important;
  text-align:left!important;
}
.drop-lineup-tbd strong{color:#e8f2fb;font-size:14px}
.drop-lineup-tbd span{color:#8493a3;font-size:11px;line-height:1.5}

.aco-event-locked-badge{
  align-self:center;
  padding:6px 8px;
  border:1px solid rgba(73,174,247,.35);
  border-radius:8px;
  background:rgba(45,145,222,.12);
  color:#9ed7ff;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  white-space:nowrap;
}
.aco-profitable-review-note{
  border-color:rgba(83,205,143,.28)!important;
  background:rgba(48,137,91,.09)!important;
}
.aco-admin-run-mode{
  padding:14px;
  border:1px solid rgba(83,205,143,.25);
  border-radius:12px;
  background:rgba(48,137,91,.08);
}
.aco-admin-run-mode strong{display:block;color:#a9e8c4;font-size:13px}
.aco-admin-run-mode span{display:block;margin-top:5px;color:#92a59b;font-size:11px;line-height:1.5}

@media(max-width:700px){
  .drop-participation-option-grid{grid-template-columns:1fr}
  .drop-participation-option{padding:12px}
  .drop-profitable-explainer{display:grid;gap:4px}
  .drop-profitable-explainer strong{white-space:normal}
  .drop-selection-status{align-items:flex-end}
  .drop-item-detail-title-row{gap:8px}
  .drop-item-detail-title-row h4{margin-right:0}
  .drop-item-select-toggle{min-height:38px;padding:8px 10px}
  .drop-target-action-panel{
    position:relative;
    padding:12px;
  }
  .drop-target-action-panel .drop-aco-choice-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .drop-target-action-panel .drop-aco-choice-actions .btn{width:100%;min-height:48px}
  .aco-event-locked-badge{align-self:flex-start}
}

@media(min-width:701px){
  .drop-target-action-panel .drop-aco-choice-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .drop-target-action-panel .drop-aco-choice-actions .btn{width:100%;min-height:44px}
}

/* v85 — chat replies, reactions, custom emoji, and GIFs (desktop + mobile) */
.chat-composer{
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:end!important;
}
.chat-composer-tools{display:flex;align-items:center;gap:7px;min-width:0}
.chat-composer-tools .chat-attach-btn{flex:0 0 auto}
.chat-emoji-btn{font-size:20px!important;line-height:1}
.chat-gif-btn{font-size:10px!important;font-weight:950!important;letter-spacing:.04em;padding:0!important}

.chat-reply-draft,
.chat-media-draft{
  margin:0 28px 8px;
  max-width:760px;
}
.chat-reply-draft{
  min-height:48px;
  display:grid;
  grid-template-columns:3px minmax(0,1fr) 32px;
  gap:10px;
  align-items:center;
  padding:8px 10px;
  border:1px solid rgba(81,137,209,.25);
  border-radius:11px;
  background:rgba(8,18,30,.88);
  box-shadow:0 8px 24px rgba(0,0,0,.14);
}
.chat-reply-draft-line{height:32px;border-radius:4px;background:#4195ee}
.chat-reply-draft-copy{display:grid;gap:2px;min-width:0}
.chat-reply-draft-copy>span{font-size:10px;color:#93a7bc}
.chat-reply-draft-copy>span strong{color:#70b8ff}
.chat-reply-draft-copy>small{font-size:11px;color:#d8e2ec;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#chatCancelReplyBtn,
#chatRemoveMediaDraftBtn{
  width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#8ea2b7;font-size:20px;cursor:pointer
}
#chatCancelReplyBtn:hover,#chatRemoveMediaDraftBtn:hover{background:rgba(255,255,255,.06);color:#fff}

.chat-reply-quote{
  width:min(680px,100%);
  margin:4px 0 5px;
  padding:5px 8px 5px 0;
  display:grid;
  grid-template-columns:3px minmax(0,1fr);
  gap:8px;
  align-items:center;
  border:0;
  border-radius:7px;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.chat-reply-quote:hover{background:rgba(61,122,194,.10)}
.chat-reply-quote>span{align-self:stretch;border-radius:4px;background:#315f8c}
.chat-reply-quote>div{display:grid;gap:1px;min-width:0}
.chat-reply-quote strong{color:#79baff;font-size:10.5px}
.chat-reply-quote small{color:#8597aa;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-message-flash{animation:chatMessageFlash 1.15s ease}
@keyframes chatMessageFlash{0%,100%{background:transparent}20%,70%{background:rgba(54,126,214,.14)}}

.chat-media-card{
  position:relative;
  display:block;
  width:max-content;
  max-width:min(520px,100%);
  margin-top:9px;
  border:1px solid rgba(111,145,180,.22);
  border-radius:13px;
  overflow:hidden;
  background:rgba(8,16,24,.72);
  box-shadow:0 12px 28px rgba(0,0,0,.16);
}
.chat-media-card img{display:block;max-width:100%;width:auto;max-height:360px;object-fit:contain;background:#090e14}
.chat-media-card>span{position:absolute;right:8px;bottom:8px;padding:3px 6px;border-radius:6px;background:rgba(0,0,0,.72);color:#fff;font-size:9px;font-weight:900;letter-spacing:.06em}
.chat-media-draft-card{
  display:grid;grid-template-columns:58px minmax(0,1fr) 32px;gap:10px;align-items:center;
  padding:7px;border:1px solid rgba(113,146,181,.25);border-radius:11px;background:rgba(8,18,28,.9)
}
.chat-media-draft-card img{width:58px;height:48px;object-fit:cover;border-radius:8px;background:#080d12}
.chat-media-draft-card>div{display:grid;gap:2px;min-width:0}
.chat-media-draft-card strong{font-size:11px;color:#eef5fc}.chat-media-draft-card small{font-size:9.5px;color:#8597aa}

.chat-inline-custom-emoji{width:24px;height:24px;object-fit:contain;vertical-align:-6px;margin:0 1px}
.chat-reactions{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:7px}
.chat-reaction-pill{
  min-height:28px;display:inline-flex;align-items:center;gap:5px;padding:3px 8px;
  border:1px solid rgba(100,135,173,.28);border-radius:9px;background:rgba(10,20,31,.78);
  color:#dce7f3;cursor:pointer;font:inherit
}
.chat-reaction-pill:hover{border-color:rgba(76,149,239,.55);background:rgba(34,82,139,.20)}
.chat-reaction-pill.mine{border-color:rgba(66,154,255,.72);background:rgba(32,91,166,.28);color:#f4f9ff}
.chat-reaction-pill>span{font-size:16px;line-height:1}.chat-reaction-pill>b{font-size:10px;color:#a9bbce}
.chat-reaction-custom-emoji{width:18px;height:18px;object-fit:contain;display:block}

.chat-context-menu{width:230px}
.chat-context-reaction-row{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:3px 4px 7px}
.chat-context-reaction-row button{
  height:34px;display:grid;place-items:center;border:1px solid transparent;border-radius:9px;background:rgba(255,255,255,.025);
  color:#eef4fb;font-size:18px;cursor:pointer
}
.chat-context-reaction-row button:hover,.chat-context-reaction-row button:focus-visible{outline:none;background:rgba(49,105,188,.24);border-color:rgba(94,151,230,.22)}
.chat-context-reaction-row button.more{font-size:19px;color:#91a8c1}

.chat-emoji-modal-card{max-width:620px}
.chat-emoji-modal-card #chatEmojiSearchInput{margin-bottom:10px}
.chat-emoji-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:9px 0 7px;color:#8fa1b5;font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.chat-emoji-section-head .btn{min-height:30px;padding:5px 10px;font-size:10px;text-transform:none;letter-spacing:0}
.chat-emoji-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;max-height:210px;overflow:auto;padding:3px}
.chat-emoji-grid.custom{grid-template-columns:repeat(6,minmax(0,1fr));max-height:180px}
.chat-emoji-choice{min-width:0;height:42px;display:grid;place-items:center;border:1px solid transparent;border-radius:9px;background:rgba(11,21,31,.68);font-size:23px;cursor:pointer;color:#fff}
.chat-emoji-choice:hover,.chat-emoji-choice:focus-visible{outline:none;background:rgba(45,98,161,.25);border-color:rgba(80,145,223,.35)}
.chat-emoji-choice.custom{height:54px;grid-template-rows:30px auto;gap:2px;padding:3px}
.chat-emoji-choice.custom img{width:28px;height:28px;object-fit:contain}.chat-emoji-choice.custom small{width:100%;font-size:7.5px;color:#7f93a8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-emoji-empty{grid-column:1/-1;padding:16px;text-align:center;color:#728397;font-size:10px}

.chat-gif-modal-card{max-width:600px}
.chat-gif-options{display:grid;gap:12px}
.chat-gif-url-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.chat-gif-divider{display:flex;align-items:center;gap:9px;color:#64778b;font-size:9px;font-weight:900}.chat-gif-divider::before,.chat-gif-divider::after{content:"";height:1px;flex:1;background:rgba(117,143,169,.18)}
.chat-gif-modal-preview{margin-top:12px;max-height:260px;border:1px solid rgba(100,133,167,.22);border-radius:12px;overflow:hidden;background:#080e14;display:grid;place-items:center}
.chat-gif-modal-preview img{display:block;max-width:100%;max-height:260px;object-fit:contain}.chat-gif-modal-preview.invalid::after{content:"Could not preview this URL. Make sure it is a direct GIF image link.";padding:20px;color:#ff9ca8;font-size:11px;text-align:center}
.chat-gif-modal-preview.invalid img{display:none}

@media(max-width:900px){
  .chat-reply-draft,.chat-media-draft{margin:0 12px 7px;max-width:none}
  .chat-composer{grid-template-columns:auto minmax(0,1fr) auto!important;gap:6px!important;padding:8px 10px calc(10px + env(safe-area-inset-bottom))!important}
  .chat-composer-tools{gap:4px}
  .chat-composer-tools .chat-attach-btn{width:34px!important;height:40px!important;border-radius:10px!important}
  .chat-composer-tools .chat-gif-btn{width:40px!important;font-size:9px!important}
  #chatMessageInput{min-width:0!important;padding-inline:10px!important}
  .chat-send-btn{min-width:52px!important;padding-inline:11px!important}
  .chat-media-card{max-width:100%}.chat-media-card img{max-height:300px}
  .chat-reply-quote{width:100%;max-width:100%}
  .chat-inline-custom-emoji{width:22px;height:22px;vertical-align:-5px}
  .chat-reaction-pill{min-height:30px;padding:3px 8px}
  .chat-emoji-grid{grid-template-columns:repeat(7,minmax(0,1fr));max-height:240px}
  .chat-emoji-grid.custom{grid-template-columns:repeat(4,minmax(0,1fr));max-height:190px}
}

@media(max-width:700px){
  .chat-context-menu{max-height:min(610px,calc(100dvh - 24px - env(safe-area-inset-bottom)));overflow:auto}
  .chat-context-reaction-row{grid-template-columns:repeat(6,1fr);padding:4px 4px 8px}
  .chat-context-reaction-row button{height:42px;font-size:21px}
  .chat-reply-draft{grid-template-columns:3px minmax(0,1fr) 30px;padding:7px 8px}
  .chat-media-draft-card{grid-template-columns:50px minmax(0,1fr) 30px}.chat-media-draft-card img{width:50px;height:43px}
  .chat-emoji-modal-card,.chat-gif-modal-card{width:calc(100vw - 18px)!important;max-width:none!important;margin:9px!important;max-height:calc(100dvh - 18px);overflow:auto;border-radius:16px!important}
  .chat-gif-url-row{grid-template-columns:1fr}.chat-gif-url-row .btn{width:100%}
}

@media(max-width:430px){
  .chat-composer-tools .chat-attach-btn{width:32px!important;height:40px!important}
  .chat-composer-tools .chat-gif-btn{width:37px!important}
  .chat-send-btn{min-width:48px!important;padding-inline:9px!important;font-size:11px!important}
  .chat-emoji-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
}

/* v86 — Discord-style chat alignment, quick reactions, and online-member layout */

/* Messages from other members stay on the left; the signed-in member's messages
   move to the right. This keeps the two sides visually distinct on desktop and mobile. */
.app[data-page="chat"] .chat-message{
  display:flex!important;
  width:100%!important;
  max-width:none!important;
  align-items:flex-start!important;
  justify-content:flex-start;
  gap:11px!important;
  position:relative;
}
.app[data-page="chat"] .chat-message.own{
  flex-direction:row-reverse;
  justify-content:flex-start;
}
.app[data-page="chat"] .chat-message .chat-message-body{
  position:relative;
  width:fit-content;
  min-width:96px;
  max-width:min(78%,820px);
  padding:9px 12px 10px;
  border:1px solid rgba(103,132,162,.20);
  border-radius:5px 15px 15px 15px;
  background:rgba(8,16,25,.70);
  box-shadow:0 8px 22px rgba(0,0,0,.10);
}
.app[data-page="chat"] .chat-message.own .chat-message-body{
  border-color:rgba(68,143,232,.28);
  border-radius:15px 5px 15px 15px;
  background:linear-gradient(145deg,rgba(24,73,126,.80),rgba(14,45,78,.82));
}
.app[data-page="chat"] .chat-message.own .chat-message-meta{
  justify-content:flex-end;
}
.app[data-page="chat"] .chat-message.own .chat-message-text,
.app[data-page="chat"] .chat-message.own .chat-reply-quote,
.app[data-page="chat"] .chat-message.own .chat-product-card{
  text-align:left;
}
.app[data-page="chat"] .chat-message .chat-avatar{
  flex:0 0 auto!important;
}

/* Discord-like mini action rail. React and Reply are available on every message;
   Edit/Delete appear only when the existing permissions allow them. */
.app[data-page="chat"] .chat-message-actions.chat-quick-actions{
  position:absolute!important;
  z-index:6;
  top:-22px;
  right:7px;
  margin:0!important;
  padding:3px;
  display:flex!important;
  align-items:center;
  gap:2px!important;
  opacity:0;
  transform:translateY(3px);
  pointer-events:none;
  border:1px solid rgba(91,119,151,.28);
  border-radius:9px;
  background:rgba(8,14,22,.96);
  box-shadow:0 8px 24px rgba(0,0,0,.30);
  transition:opacity .12s ease,transform .12s ease;
}
.app[data-page="chat"] .chat-message.own .chat-message-actions.chat-quick-actions{
  right:auto;
  left:7px;
}
.app[data-page="chat"] .chat-message:hover .chat-message-actions.chat-quick-actions,
.app[data-page="chat"] .chat-message:focus-within .chat-message-actions.chat-quick-actions{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-btn{
  width:30px!important;
  min-width:30px!important;
  height:28px!important;
  padding:0!important;
  margin:0!important;
  display:grid!important;
  place-items:center;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  color:#aebfd1!important;
  font-size:15px!important;
  font-weight:800!important;
  line-height:1!important;
}
.app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-btn:hover{
  background:rgba(59,116,187,.25)!important;
  color:#fff!important;
}
.app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-btn.danger:hover{
  background:rgba(170,42,61,.22)!important;
  color:#ff9eab!important;
}
.app[data-page="chat"] .chat-action-react{
  position:relative;
  font-size:17px!important;
}
.app[data-page="chat"] .chat-action-react>span{
  position:absolute;
  right:3px;
  top:1px;
  font-size:9px;
  font-weight:950;
  color:#7dbdff;
}

/* Keep reaction chips visually attached to the bubble. */
.app[data-page="chat"] .chat-reactions{margin-top:8px}
.app[data-page="chat"] .chat-message.own .chat-reactions{justify-content:flex-end}

/* Online panel: avatar gets its own fixed column so it can never cover the name. */
.app[data-page="chat"] .chat-online-members{
  gap:7px!important;
}
.app[data-page="chat"] .chat-online-member{
  width:100%;
  min-width:0;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:10px!important;
  padding:7px 2px!important;
}
.app[data-page="chat"] .chat-online-member .chat-avatar.small{
  grid-column:1;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  margin:0!important;
  overflow:hidden!important;
  z-index:1;
}
.app[data-page="chat"] .chat-online-copy{
  grid-column:2;
  min-width:0;
  display:grid;
  gap:2px;
  padding-left:0!important;
}
.app[data-page="chat"] .chat-online-name-row{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px;
}
.app[data-page="chat"] .chat-online-name-row>strong{
  min-width:0;
  flex:1 1 auto;
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px!important;
  line-height:1.2;
}
.app[data-page="chat"] .chat-online-name-row>em{
  flex:0 0 auto;
  font-style:normal;
  font-size:8px;
  line-height:1;
  font-weight:900;
  background:#285fd1;
  color:#fff;
  border-radius:6px;
  padding:4px 5px;
}
.app[data-page="chat"] .chat-online-copy>small{
  color:#8c9bab;
  font-size:9px;
  line-height:1.1;
}

/* More room for names on desktop while keeping the main chat dominant. */
@media(min-width:1101px){
  .app[data-page="chat"] .chat-shell:not(.right-hidden){
    grid-template-columns:minmax(0,1fr) 350px!important;
  }
}

@media(max-width:900px){
  .app[data-page="chat"] .chat-message{
    gap:8px!important;
    padding:9px 0 15px!important;
  }
  .app[data-page="chat"] .chat-message .chat-message-body{
    max-width:calc(100% - 46px);
    padding:8px 10px 9px;
  }
  .app[data-page="chat"] .chat-message .chat-avatar{
    width:36px!important;
    height:36px!important;
  }
  /* Phones do not have hover, so keep a tiny React button visible and leave
     the full Reply/Edit/Delete menu on long-hold. */
  .app[data-page="chat"] .chat-message-actions.chat-quick-actions{
    top:auto;
    bottom:-16px;
    right:5px;
    left:auto;
    opacity:1;
    transform:none;
    pointer-events:auto;
    padding:2px;
    background:rgba(7,13,21,.92);
  }
  .app[data-page="chat"] .chat-message.own .chat-message-actions.chat-quick-actions{
    left:5px;
    right:auto;
  }
  .app[data-page="chat"] .chat-message-actions.chat-quick-actions>button:not(.chat-action-react){
    display:none!important;
  }
  .app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-react{
    display:grid!important;
    width:31px!important;
    height:27px!important;
  }
  .app[data-page="chat"] .chat-online-member{
    grid-template-columns:40px minmax(0,1fr)!important;
    column-gap:10px!important;
  }
  .app[data-page="chat"] .chat-online-member .chat-avatar.small{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }
  .app[data-page="chat"] .chat-online-name-row>strong{font-size:12px!important}
}

@media(max-width:430px){
  .app[data-page="chat"] .chat-message .chat-message-body{
    max-width:calc(100% - 42px);
  }
  .app[data-page="chat"] .chat-message .chat-avatar{
    width:33px!important;
    height:33px!important;
  }
}

/* v87 — chat readability + viewport-fixed emoji/GIF/product pickers */

/* Chat attachment/picker dialogs use the same fixed overlay system as the rest
   of the app. This keeps them on top of the current viewport instead of flowing
   below the chat page. */
#chatProductModal,
#chatEmojiModal,
#chatGifModal{
  z-index:220!important;
  position:fixed!important;
  inset:0!important;
  width:auto!important;
  max-height:none!important;
  overflow:auto!important;
  padding:24px!important;
  background:rgba(0,0,0,.72)!important;
  place-items:center!important;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
#chatProductModal.hidden,
#chatEmojiModal.hidden,
#chatGifModal.hidden{display:none!important}
#chatProductModal>.modal,
#chatEmojiModal>.modal,
#chatGifModal>.modal{
  width:min(680px,calc(100vw - 48px))!important;
  max-height:min(760px,calc(100dvh - 48px))!important;
  overflow:auto!important;
  margin:0!important;
  padding:20px!important;
  background:rgba(11,19,28,.98)!important;
  border:1px solid #304356!important;
  border-radius:18px!important;
  box-shadow:0 30px 90px rgba(0,0,0,.62)!important;
}
#chatEmojiModal>.modal{width:min(650px,calc(100vw - 48px))!important}
#chatGifModal>.modal{width:min(620px,calc(100vw - 48px))!important}

/* Desktop chat should be comfortable to read on large monitors. */
@media(min-width:901px){
  .app[data-page="chat"] .chat-header{
    min-height:92px!important;
    padding:18px 26px!important;
  }
  .app[data-page="chat"] .chat-heading-icon{
    width:50px!important;
    height:50px!important;
  }
  .app[data-page="chat"] .chat-heading h1{
    font-size:27px!important;
    line-height:1.08!important;
  }
  .app[data-page="chat"] .chat-heading p{
    font-size:14px!important;
    line-height:1.35!important;
  }
  .app[data-page="chat"] .chat-search-wrap{
    min-width:300px!important;
    height:46px!important;
    font-size:14px!important;
  }
  .app[data-page="chat"] .chat-search-wrap input{
    font-size:14px!important;
  }
  .app[data-page="chat"] .chat-panel-toggle{
    height:46px!important;
    font-size:13px!important;
  }

  .app[data-page="chat"] .chat-messages{
    padding:28px 36px 34px!important;
  }
  .app[data-page="chat"] .chat-message{
    gap:13px!important;
    padding:11px 0 19px!important;
  }
  .app[data-page="chat"] .chat-message .chat-avatar{
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
  }
  .app[data-page="chat"] .chat-message .chat-message-body{
    min-width:132px!important;
    max-width:min(68%,860px)!important;
    padding:11px 14px 12px!important;
    border-radius:7px 17px 17px 17px!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-message-body{
    border-radius:17px 7px 17px 17px!important;
  }
  .app[data-page="chat"] .chat-message-meta{
    gap:8px!important;
    min-height:22px!important;
  }
  .app[data-page="chat"] .chat-message-meta strong{
    font-size:15px!important;
    line-height:1.2!important;
  }
  .app[data-page="chat"] .chat-message-meta time{
    font-size:11px!important;
  }
  .app[data-page="chat"] .chat-message-meta>em{
    font-size:9px!important;
    padding:4px 6px!important;
  }
  .app[data-page="chat"] .chat-message-text{
    margin-top:5px!important;
    font-size:16px!important;
    line-height:1.48!important;
  }
  .app[data-page="chat"] .chat-reply-quote{
    font-size:13px!important;
  }
  .app[data-page="chat"] .chat-reaction-chip{
    min-height:30px!important;
    padding:4px 9px!important;
    font-size:14px!important;
  }

  .app[data-page="chat"] .chat-message-actions.chat-quick-actions{
    top:-25px!important;
    padding:4px!important;
    border-radius:10px!important;
  }
  .app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-btn{
    width:34px!important;
    min-width:34px!important;
    height:32px!important;
    font-size:16px!important;
  }
  .app[data-page="chat"] .chat-action-react{
    font-size:19px!important;
  }

  .app[data-page="chat"] .chat-composer{
    padding:13px 22px 20px!important;
    gap:10px!important;
  }
  .app[data-page="chat"] .chat-attach-btn{
    width:48px!important;
    height:48px!important;
    font-size:16px!important;
  }
  .app[data-page="chat"] #chatMessageInput{
    min-height:48px!important;
    padding:12px 14px!important;
    font-size:15px!important;
    line-height:1.45!important;
  }
  .app[data-page="chat"] .chat-send-btn{
    min-height:48px!important;
    padding-inline:22px!important;
    font-size:13px!important;
  }

  .app[data-page="chat"] .chat-shell:not(.right-hidden){
    grid-template-columns:minmax(0,1fr) 330px!important;
  }
  .app[data-page="chat"] .chat-right-sidebar{
    padding:16px!important;
  }
  .app[data-page="chat"] .chat-side-card{
    padding:17px!important;
  }
  .app[data-page="chat"] .chat-side-title>span,
  .app[data-page="chat"] .chat-side-title>strong{
    font-size:13px!important;
  }
  .app[data-page="chat"] .chat-online-member{
    grid-template-columns:44px minmax(0,1fr)!important;
    column-gap:11px!important;
    padding:8px 2px!important;
  }
  .app[data-page="chat"] .chat-online-member .chat-avatar.small{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
  }
  .app[data-page="chat"] .chat-online-name-row>strong{
    font-size:13px!important;
  }
  .app[data-page="chat"] .chat-online-copy>small{
    font-size:10.5px!important;
  }
  .app[data-page="chat"] .chat-online-name-row>em{
    font-size:8.5px!important;
    padding:4px 6px!important;
  }
  .app[data-page="chat"] .chat-side-quote strong{
    font-size:19px!important;
  }
}

/* Keep the same hierarchy on tablets/phones without making bubbles cramped. */
@media(max-width:900px){
  #chatProductModal,
  #chatEmojiModal,
  #chatGifModal{
    padding:12px!important;
    align-items:center!important;
  }
  #chatProductModal>.modal,
  #chatEmojiModal>.modal,
  #chatGifModal>.modal{
    width:calc(100vw - 24px)!important;
    max-width:none!important;
    max-height:calc(100dvh - 24px)!important;
    margin:0!important;
    padding:16px!important;
    border-radius:18px!important;
  }
  .app[data-page="chat"] .chat-message .chat-message-body{
    min-width:110px!important;
    max-width:calc(100% - 48px)!important;
  }
  .app[data-page="chat"] .chat-message-meta strong{font-size:13.5px!important}
  .app[data-page="chat"] .chat-message-meta time{font-size:10px!important}
  .app[data-page="chat"] .chat-message-text{font-size:14.5px!important}
  .app[data-page="chat"] #chatMessageInput{font-size:14px!important}
}

/* v88 — Discord-inspired chat composer, file attachments, GIF search, and mobile cleanup */

/* Keep the user's requested split: other members left, your messages right,
   while the controls/composer behave much more like Discord. */
.app[data-page="chat"] .chat-header{
  background:rgba(7,12,19,.94)!important;
  border-bottom:1px solid rgba(125,147,171,.18)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.02)!important;
}
.app[data-page="chat"] .chat-heading-icon{
  border-radius:50%!important;
  background:#172230!important;
  letter-spacing:0!important;
}
.app[data-page="chat"] .chat-heading h1{font-weight:850!important}
.app[data-page="chat"] .chat-message .chat-message-body{
  overflow:visible!important;
}

/* Composer: Discord-style single rounded field with GIF/emoji controls inside. */
.app[data-page="chat"] .chat-composer{
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:8px!important;
}
.app[data-page="chat"] .chat-composer-input-shell{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:5px;
  border:1px solid #2a3948;
  border-radius:14px;
  background:#17212c;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  overflow:hidden;
}
.app[data-page="chat"] .chat-composer-input-shell:focus-within{
  border-color:#3d5d7b;
  box-shadow:0 0 0 2px rgba(47,129,214,.10);
}
.app[data-page="chat"] #chatMessageInput{
  width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  max-height:160px!important;
  margin:0!important;
  padding:12px 10px 11px 14px!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  resize:none!important;
  background:transparent!important;
  color:#edf2f7!important;
  box-shadow:none!important;
}
.app[data-page="chat"] #chatMessageInput::placeholder{color:#778697!important}
.app[data-page="chat"] .chat-composer-inline-tools{
  height:46px;
  display:flex;
  align-items:center;
  gap:2px;
  padding:0 7px 0 1px;
}
.app[data-page="chat"] .chat-inline-tool{
  min-width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#aeb9c5;
  cursor:pointer;
  font:inherit;
}
.app[data-page="chat"] .chat-inline-tool:hover{background:rgba(255,255,255,.06);color:#f2f5f8}
.app[data-page="chat"] .chat-inline-tool.chat-gif-btn{font-size:10px!important;font-weight:950!important;letter-spacing:.03em}
.app[data-page="chat"] .chat-inline-tool.chat-emoji-btn{font-size:22px!important;line-height:1!important}
.app[data-page="chat"] .chat-plus-btn{
  border-radius:50%!important;
  font-size:25px!important;
  font-weight:400!important;
  line-height:1!important;
}

/* Attachment draft strip. */
.chat-attachment-drafts{
  margin:0 22px 8px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  max-width:900px;
}
.chat-attachment-draft{
  width:min(260px,100%);
  min-width:0;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 28px;
  align-items:center;
  gap:9px;
  padding:7px;
  border:1px solid #2b3b4b;
  border-radius:11px;
  background:#111b25;
}
.chat-attachment-draft>img{width:46px;height:46px;object-fit:cover;border-radius:8px;background:#080d12}
.chat-attachment-draft>span:nth-child(2){min-width:0;display:grid;gap:2px}
.chat-attachment-draft strong{font-size:11px;color:#eef3f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-attachment-draft small{font-size:9px;color:#8b9aaa}
.chat-attachment-draft>button{width:27px;height:27px;border:0;border-radius:7px;background:transparent;color:#8fa0b1;font-size:18px;cursor:pointer}
.chat-attachment-draft>button:hover{background:rgba(255,255,255,.06);color:#fff}
.chat-file-type{
  width:42px;height:42px;display:grid;place-items:center;border-radius:8px;
  background:#253446;color:#9ecbff;font-size:9px;font-weight:950;letter-spacing:.04em
}

/* Attachments inside sent messages. */
.chat-attachment-image-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,220px));
  gap:4px;
  width:min(448px,100%);
  margin-top:8px;
}
.chat-attachment-image-grid.count-1{grid-template-columns:minmax(0,420px)}
.chat-attachment-image{
  display:block;overflow:hidden;border-radius:9px;border:1px solid rgba(113,140,169,.22);background:#080d12
}
.chat-attachment-image img{display:block;width:100%;max-height:330px;aspect-ratio:auto;object-fit:cover}
.chat-file-attachments{display:grid;gap:6px;margin-top:8px;width:min(470px,100%)}
.chat-file-attachment{
  min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) 24px;align-items:center;gap:9px;
  padding:8px;border:1px solid #2b3b4b;border-radius:10px;background:#101a24;color:#edf3f8;text-decoration:none
}
.chat-file-attachment:hover{background:#142231;border-color:#3d566e}
.chat-file-copy{min-width:0;display:grid;gap:2px}.chat-file-copy strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-file-copy small{font-size:9px;color:#8c9baa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-file-attachment>b{color:#88bdf2;font-size:16px;text-align:center}

/* Drag files over chat like Discord. */
#chatPage{position:relative}
#chatPage.chat-file-dragging::after{
  content:"Drop files to upload";
  position:absolute;z-index:190;inset:18px;border:2px dashed #4a9df3;border-radius:18px;
  display:grid;place-items:center;background:rgba(20,57,96,.82);backdrop-filter:blur(5px);
  color:#fff;font-size:22px;font-weight:850;pointer-events:none
}

/* Small attach menu anchored above + on desktop; bottom sheet on mobile. */
#chatAttachModal,
#chatEmojiModal,
#chatGifModal{
  z-index:240!important;
  position:fixed!important;
  inset:0!important;
  padding:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  overflow:visible!important;
  place-items:initial!important;
}
#chatAttachModal.hidden,#chatEmojiModal.hidden,#chatGifModal.hidden{display:none!important}
#chatAttachModal>.modal,
#chatEmojiModal>.modal,
#chatGifModal>.modal{
  position:fixed!important;
  margin:0!important;
  background:#111a24!important;
  border:1px solid #304153!important;
  box-shadow:0 18px 55px rgba(0,0,0,.58)!important;
  overflow:hidden!important;
}
#chatAttachModal>.modal{width:min(330px,calc(100vw - 24px))!important;padding:8px!important;border-radius:12px!important}
#chatEmojiModal>.modal{width:min(430px,calc(100vw - 24px))!important;max-height:min(560px,calc(100dvh - 24px))!important;padding:12px!important;border-radius:13px!important;overflow:auto!important}
#chatGifModal>.modal{width:min(500px,calc(100vw - 24px))!important;max-height:min(600px,calc(100dvh - 24px))!important;padding:12px!important;border-radius:13px!important;overflow:auto!important}
.chat-attach-menu-title{padding:7px 9px 5px;color:#8293a5;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.07em}
.chat-attach-menu-item{
  width:100%;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;
  padding:9px;border:0;border-radius:8px;background:transparent;color:#eef3f8;text-align:left;cursor:pointer
}
.chat-attach-menu-item:hover{background:#1c2734}.chat-attach-menu-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#263547;color:#aed1f6;font-size:17px}.chat-attach-menu-item>span:last-child{min-width:0;display:grid;gap:2px}.chat-attach-menu-item strong{font-size:12px}.chat-attach-menu-item small{font-size:9px;color:#8494a5}

/* Emoji picker closer to Discord: compact header/search, no giant centered dialog. */
#chatEmojiModal .modal-head{margin-bottom:7px!important}
#chatEmojiModal .modal-head h2{font-size:15px!important;margin:0!important}
#chatEmojiModal .modal-head p{display:none!important}
#chatEmojiModal #chatEmojiSearchInput{height:36px!important;font-size:12px!important;background:#0b121a!important}
#chatEmojiModal .chat-emoji-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;max-height:190px}
#chatEmojiModal .chat-emoji-grid.custom{grid-template-columns:repeat(6,minmax(0,1fr));max-height:140px}
#chatEmojiModal .chat-emoji-choice{height:38px;font-size:22px;background:transparent}
#chatEmojiModal .chat-emoji-choice:hover{background:#1d2a38}
#chatEmojiModal .modal-actions{display:none!important}

/* GIF search. */
.chat-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.chat-picker-head>strong{font-size:15px;color:#f0f4f8}.chat-picker-head .x-btn{width:30px;height:30px}
.chat-gif-search-wrap{height:38px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid #2a3949;border-radius:8px;background:#0a1119;color:#76889a}
.chat-gif-search-wrap input{width:100%;min-width:0;border:0!important;background:transparent!important;outline:0!important;padding:0!important;color:#edf2f7!important;font-size:12px!important}
.chat-gif-search-status{min-height:20px;padding:7px 2px 3px;color:#8293a4;font-size:9.5px;display:grid;gap:2px}.chat-gif-search-status strong{color:#cbd6e1;font-size:10px}
.chat-gif-search-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;max-height:390px;overflow:auto;border-radius:9px}
.chat-gif-result{min-width:0;min-height:94px;padding:0;border:0;border-radius:7px;overflow:hidden;background:#080e14;cursor:pointer}.chat-gif-result:hover{outline:2px solid #3d8fe3;outline-offset:-2px}.chat-gif-result img{display:block;width:100%;height:100%;min-height:94px;max-height:180px;object-fit:cover}
.chat-gif-loading{grid-column:1/-1;min-height:120px;display:flex;align-items:center;justify-content:center;gap:6px}.chat-gif-loading span{width:7px;height:7px;border-radius:50%;background:#7f91a5;animation:chatGifPulse .8s infinite alternate}.chat-gif-loading span:nth-child(2){animation-delay:.15s}.chat-gif-loading span:nth-child(3){animation-delay:.3s}@keyframes chatGifPulse{to{opacity:.25;transform:translateY(-3px)}}
.chat-gif-more-options{margin-top:9px;border-top:1px solid rgba(117,141,166,.16);padding-top:8px}.chat-gif-more-options>summary{cursor:pointer;color:#91a4b8;font-size:10px;font-weight:800}.chat-gif-more-options .chat-gif-options{margin-top:9px;gap:7px}.chat-gif-url-row{grid-template-columns:minmax(0,1fr) auto!important}.chat-gif-url-row input{min-width:0;font-size:11px!important}.chat-giphy-attribution{text-align:right;margin-top:7px;color:#6f8194;font-size:8px;font-weight:800;letter-spacing:.04em}

/* Message action rail shouldn't cover message text. */
.app[data-page="chat"] .chat-message-actions.chat-quick-actions{top:-18px!important}
.app[data-page="chat"] .chat-message-meta{position:relative}

/* Online panel name/avatar separation. */
.app[data-page="chat"] .chat-online-member{overflow:hidden!important}
.app[data-page="chat"] .chat-online-name-row{width:100%!important}
.app[data-page="chat"] .chat-online-name-row>strong{max-width:100%!important}

@media(max-width:900px){
  /* Mobile: the app header already says Chat, so remove the extra channel bar to save space. */
  .app[data-page="chat"] .chat-main-panel{height:calc(100dvh - 66px)!important;min-height:0!important}
  .app[data-page="chat"] .chat-header{display:none!important}
  .app[data-page="chat"] .chat-messages{padding:13px 12px 20px!important}

  .app[data-page="chat"] .chat-message{gap:7px!important;padding:7px 0 14px!important}
  .app[data-page="chat"] .chat-message .chat-avatar{width:38px!important;height:38px!important;min-width:38px!important}
  .app[data-page="chat"] .chat-message .chat-message-body{max-width:calc(100% - 48px)!important;min-width:96px!important;padding:8px 10px 9px!important}
  .app[data-page="chat"] .chat-message-meta{gap:6px!important;flex-wrap:wrap}
  .app[data-page="chat"] .chat-message-meta strong{font-size:13px!important}
  .app[data-page="chat"] .chat-message-meta time{font-size:9.5px!important}
  .app[data-page="chat"] .chat-message-text{font-size:14px!important;line-height:1.42!important;margin-top:4px!important}

  /* Tiny Discord-like react control: outside the text area, not sitting on top of it. */
  .app[data-page="chat"] .chat-message-actions.chat-quick-actions{
    top:50%!important;bottom:auto!important;right:-34px!important;left:auto!important;
    transform:translateY(-50%)!important;opacity:1!important;pointer-events:auto!important;
    padding:1px!important;border-radius:9px!important;background:#111a24!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-message-actions.chat-quick-actions{left:-34px!important;right:auto!important}
  .app[data-page="chat"] .chat-message-actions.chat-quick-actions>button:not(.chat-action-react){display:none!important}
  .app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-react{width:29px!important;min-width:29px!important;height:29px!important;font-size:17px!important}

  .chat-reply-draft,.chat-media-draft,.chat-attachment-drafts{margin:0 10px 7px!important;max-width:none!important}
  .chat-attachment-drafts{display:grid;grid-template-columns:1fr;gap:6px}
  .chat-attachment-draft{width:100%}

  /* Composer always fits the viewport; GIF/emoji live inside the text field. */
  .app[data-page="chat"] .chat-composer{
    grid-template-columns:42px minmax(0,1fr) 62px!important;
    gap:6px!important;
    padding:8px 10px calc(10px + env(safe-area-inset-bottom))!important;
    background:rgba(7,12,18,.97)!important;
    border-top:1px solid rgba(111,137,163,.16);
  }
  .app[data-page="chat"] .chat-plus-btn{width:42px!important;height:42px!important;min-width:42px!important}
  .app[data-page="chat"] .chat-composer-input-shell{border-radius:12px}
  .app[data-page="chat"] #chatMessageInput{min-height:42px!important;padding:10px 6px 9px 11px!important;font-size:14px!important}
  .app[data-page="chat"] .chat-composer-inline-tools{height:42px;padding-right:5px;gap:0}
  .app[data-page="chat"] .chat-inline-tool{min-width:30px;width:30px;height:31px;padding:0}
  .app[data-page="chat"] .chat-inline-tool.chat-gif-btn{font-size:8.5px!important}
  .app[data-page="chat"] .chat-inline-tool.chat-emoji-btn{font-size:19px!important}
  .app[data-page="chat"] .chat-send-btn{min-width:62px!important;min-height:42px!important;padding:0 10px!important;font-size:12px!important;border-radius:11px!important}

  /* Pickers become a Discord-like bottom sheet on phones, always in viewport. */
  #chatAttachModal,#chatEmojiModal,#chatGifModal{
    background:rgba(0,0,0,.48)!important;
    backdrop-filter:blur(2px)!important;
    -webkit-backdrop-filter:blur(2px)!important;
  }
  #chatAttachModal>.modal,#chatEmojiModal>.modal,#chatGifModal>.modal{
    left:8px!important;right:8px!important;top:auto!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;
    width:auto!important;max-width:none!important;margin:0!important;
    border-radius:16px!important;
  }
  #chatAttachModal>.modal{padding:9px!important}
  #chatEmojiModal>.modal{max-height:min(62dvh,560px)!important;padding:12px!important}
  #chatGifModal>.modal{max-height:min(70dvh,620px)!important;padding:12px!important}
  #chatEmojiModal .chat-emoji-grid{grid-template-columns:repeat(7,minmax(0,1fr));max-height:180px}
  #chatEmojiModal .chat-emoji-grid.custom{grid-template-columns:repeat(5,minmax(0,1fr));max-height:120px}
  .chat-gif-search-results{max-height:45dvh;grid-template-columns:repeat(2,minmax(0,1fr))}
  .chat-gif-result img{max-height:150px}
  .chat-attachment-image-grid{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}.chat-attachment-image-grid.count-1{grid-template-columns:minmax(0,1fr)}
}

@media(max-width:430px){
  .app[data-page="chat"] .chat-composer{grid-template-columns:40px minmax(0,1fr) 58px!important;padding-inline:8px!important}
  .app[data-page="chat"] .chat-plus-btn{width:40px!important;height:40px!important;min-width:40px!important}
  .app[data-page="chat"] .chat-send-btn{min-width:58px!important;padding-inline:8px!important}
  .app[data-page="chat"] .chat-inline-tool{min-width:28px;width:28px}
  #chatEmojiModal .chat-emoji-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  #chatEmojiModal .chat-emoji-grid.custom{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* v89 — chat action placement, reliable message sides, and full-height desktop calendar */

/* Put the message action rail BELOW the bubble so it never covers the name or text. */
.app[data-page="chat"] .chat-message-meta{
  position:static!important;
}
.app[data-page="chat"] .chat-message .chat-message-body{
  position:relative!important;
}
.app[data-page="chat"] .chat-message-actions.chat-quick-actions{
  top:calc(100% + 5px)!important;
  bottom:auto!important;
  right:0!important;
  left:auto!important;
  transform:translateY(2px)!important;
}
.app[data-page="chat"] .chat-message.own .chat-message-actions.chat-quick-actions{
  left:0!important;
  right:auto!important;
}
.app[data-page="chat"] .chat-message:hover .chat-message-actions.chat-quick-actions,
.app[data-page="chat"] .chat-message:focus-within .chat-message-actions.chat-quick-actions{
  transform:translateY(0)!important;
}

/* Reserve a small action lane under every message so the rail cannot overlap the next one. */
@media(min-width:901px){
  .app[data-page="chat"] .chat-message{
    padding-bottom:44px!important;
  }

  /* Make left/right ownership deterministic instead of depending on flex direction. */
  .app[data-page="chat"] .chat-message{
    display:grid!important;
    grid-template-columns:50px minmax(0,1fr)!important;
    align-items:start!important;
    column-gap:13px!important;
    width:100%!important;
  }
  .app[data-page="chat"] .chat-message .chat-avatar{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
  }
  .app[data-page="chat"] .chat-message .chat-message-body{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:start!important;
  }
  .app[data-page="chat"] .chat-message.own{
    grid-template-columns:minmax(0,1fr) 50px!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-avatar{
    grid-column:2!important;
    justify-self:end!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-message-body{
    grid-column:1!important;
    justify-self:end!important;
  }
}

@media(max-width:900px){
  /* Same ownership layout on phones: others left, you right. */
  .app[data-page="chat"] .chat-message{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    align-items:start!important;
    column-gap:7px!important;
    width:100%!important;
    padding-bottom:39px!important;
  }
  .app[data-page="chat"] .chat-message .chat-avatar{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
  }
  .app[data-page="chat"] .chat-message .chat-message-body{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:start!important;
    max-width:min(88%,520px)!important;
  }
  .app[data-page="chat"] .chat-message.own{
    grid-template-columns:minmax(0,1fr) 38px!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-avatar{
    grid-column:2!important;
    justify-self:end!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-message-body{
    grid-column:1!important;
    justify-self:end!important;
  }

  /* Phones keep only the quick-react control visible; it now sits under the bubble. */
  .app[data-page="chat"] .chat-message-actions.chat-quick-actions{
    top:calc(100% + 4px)!important;
    bottom:auto!important;
    right:0!important;
    left:auto!important;
    transform:none!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .app[data-page="chat"] .chat-message.own .chat-message-actions.chat-quick-actions{
    left:0!important;
    right:auto!important;
  }
}

/* Desktop Drop Calendar: use the available viewport height instead of stopping halfway down. */
@media(min-width:801px){
  #dropsPage:not(.hidden){
    display:flex!important;
    flex-direction:column;
    min-height:calc(100dvh - 74px);
  }
  #dropsPage .drop-desktop-layout{
    flex:1 1 auto;
    min-height:560px;
    align-items:stretch!important;
  }
  #dropsPage .drop-calendar-card{
    display:flex;
    flex-direction:column;
    min-height:0;
    height:auto;
  }
  #dropsPage .drop-calendar-grid{
    flex:1 1 auto;
    min-height:0;
    grid-auto-rows:minmax(78px,1fr);
  }
  #dropsPage .drop-day{
    min-height:0!important;
    height:auto;
  }
  #dropsPage .drop-upcoming-panel{
    min-height:0;
    height:auto;
    overflow:auto;
  }
}

/* v90 — products fill the desktop workspace + responsive pagination */
@media (min-width: 761px) {
  .app[data-page="products"] main {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 18px;
  }

  .app[data-page="products"] #productsPage {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .app[data-page="products"] .product-table-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
  }

  .app[data-page="products"] .product-table-wrap table {
    height: 100%;
  }

  .app[data-page="products"] .product-table-wrap tbody {
    height: 100%;
  }

  .app[data-page="products"] .product-table-wrap tbody tr {
    height: 1%;
  }

  .app[data-page="products"] .product-table-wrap td {
    padding-top: 9px;
    padding-bottom: 9px;
  }
}

.product-pager {
  flex: 0 0 auto;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 2px 0;
}

.product-pager-summary {
  color: #8d9cad;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.product-pager-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.product-page-numbers {
  display: flex;
  align-items: center;
  gap: 6px;
}

.product-page-number {
  min-width: 36px;
  height: 36px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #0d151e;
  color: #aebdca;
  font-weight: 800;
  cursor: pointer;
}

.product-page-number:hover {
  border-color: #315778;
  color: #fff;
  background: #12202c;
}

.product-page-number.active {
  color: #fff;
  background: #167ed0;
  border-color: #2e9bff;
  box-shadow: 0 0 0 2px rgba(46,155,255,.12);
}

.product-page-ellipsis {
  color: #6f7d8d;
  min-width: 18px;
  text-align: center;
}

.product-page-nav {
  min-width: 96px;
}

@media (max-width: 760px) {
  .product-pager {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 12px 0 4px;
  }

  .product-pager-summary {
    text-align: center;
    font-size: 12px;
  }

  .product-pager-controls {
    justify-content: center;
    width: 100%;
  }

  .product-page-numbers {
    max-width: 45vw;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .product-page-numbers::-webkit-scrollbar { display: none; }

  .product-page-number {
    min-width: 40px;
    height: 40px;
  }

  .product-page-nav {
    min-width: 0;
    padding-left: 11px;
    padding-right: 11px;
  }
}


/* v92 — Discord-style add-reaction icon (no native yellow emoji button) */
.app[data-page="chat"] .chat-action-react{
  color:#aebfd1!important;
}
.app[data-page="chat"] .chat-action-react .chat-react-outline-icon,
.app[data-page="chat"] .chat-context-react-icon .chat-react-outline-icon{
  width:19px;
  height:19px;
  display:block;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.app[data-page="chat"] .chat-action-react .chat-react-eye,
.app[data-page="chat"] .chat-context-react-icon .chat-react-eye{
  fill:currentColor;
  stroke:none;
}
.app[data-page="chat"] .chat-action-react .chat-react-plus,
.app[data-page="chat"] .chat-context-react-icon .chat-react-plus{
  stroke-width:2;
}
.app[data-page="chat"] .chat-action-react>span{display:none!important}
.app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-react:hover{
  color:#d8dee9!important;
  background:rgba(79,92,113,.34)!important;
}
.app[data-page="chat"] .chat-context-react-icon{
  display:grid;
  place-items:center;
  color:#b5bac1;
}
@media(max-width:900px){
  .app[data-page="chat"] .chat-message-meta .chat-message-actions.chat-quick-actions>button.chat-action-react{
    font-size:0!important;
  }
  .app[data-page="chat"] .chat-action-react .chat-react-outline-icon{
    width:18px;
    height:18px;
  }
}


/* v94 — iPhone keyboard + mobile chat composer stability */
@media(max-width:900px){
  /* Use the actual visible iOS Safari viewport when the keyboard opens. */
  .app[data-page="chat"]{
    height:var(--lp-chat-viewport-height,100dvh)!important;
    min-height:var(--lp-chat-viewport-height,100dvh)!important;
    max-height:var(--lp-chat-viewport-height,100dvh)!important;
    overflow:hidden!important;
  }
  .app[data-page="chat"] main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:calc(var(--lp-chat-viewport-height,100dvh) - 72px)!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .app[data-page="chat"] #chatPage,
  .app[data-page="chat"] .chat-shell,
  .app[data-page="chat"] .chat-main-panel{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    overflow-x:hidden!important;
  }

  /* Keep the composer inside the viewport instead of letting Safari widen the page. */
  .app[data-page="chat"] .chat-composer{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    grid-template-columns:40px minmax(0,1fr) 58px!important;
    column-gap:6px!important;
    overflow:hidden!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .app[data-page="chat"] .chat-composer>*{
    min-width:0!important;
    box-sizing:border-box!important;
  }
  .app[data-page="chat"] .chat-composer-input-shell{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .app[data-page="chat"] #chatMessageInput{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* Fixed button width prevents "Sending..." from pushing Send off-screen. */
  .app[data-page="chat"] .chat-send-btn{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    padding-left:6px!important;
    padding-right:6px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }

  /* No horizontal page drift while the iPhone keyboard is opening/closing. */
  html,body{
    max-width:100%!important;
    overflow-x:hidden!important;
  }
}


/* v95 — revert the buggy visualViewport height lock on mobile chat.
   Keep the width/focus fixes, but let Safari handle vertical resizing naturally. */
@media(max-width:900px){
  .app[data-page="chat"]{
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  .app[data-page="chat"] main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:calc(100dvh - 66px)!important;
    max-height:none!important;
    overflow:hidden!important;
    padding-bottom:0!important;
  }
  .app[data-page="chat"] #chatPage,
  .app[data-page="chat"] .chat-shell{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:calc(100dvh - 66px)!important;
    max-height:none!important;
  }
  .app[data-page="chat"] .chat-main-panel{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:calc(100dvh - 66px)!important;
    min-height:calc(100dvh - 66px)!important;
    max-height:calc(100dvh - 66px)!important;
    overflow:hidden!important;
  }
  .app[data-page="chat"] .chat-messages{
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .app[data-page="chat"] .chat-composer{
    position:relative!important;
    bottom:auto!important;
    z-index:2!important;
  }
  .app[data-page="chat"] .chat-send-btn{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
  }
}


/* v96 — keep the mobile typing bar visible like Discord.
   The channel header is hidden on mobile, so use a simple vertical flex layout:
   messages take the remaining space and the composer always owns the bottom row. */
@media(max-width:900px){
  .app[data-page="chat"]{
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:hidden!important;
  }

  .app[data-page="chat"] main{
    height:calc(100dvh - 72px)!important;
    min-height:0!important;
    max-height:calc(100dvh - 72px)!important;
    padding:0!important;
    overflow:hidden!important;
  }

  .app[data-page="chat"] #chatPage,
  .app[data-page="chat"] .chat-shell,
  .app[data-page="chat"] .chat-main-panel{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }

  .app[data-page="chat"] .chat-main-panel{
    display:flex!important;
    flex-direction:column!important;
  }

  .app[data-page="chat"] .chat-header{
    display:none!important;
  }

  .app[data-page="chat"] .chat-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    width:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:18px!important;
  }

  .app[data-page="chat"] .chat-setup-notice,
  .app[data-page="chat"] .chat-reply-draft,
  .app[data-page="chat"] .chat-attached-product,
  .app[data-page="chat"] .chat-media-draft,
  .app[data-page="chat"] .chat-attachment-drafts{
    flex:0 0 auto!important;
  }

  .app[data-page="chat"] .chat-composer{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    margin:0 8px calc(8px + env(safe-area-inset-bottom))!important;
    padding:7px!important;
    grid-template-columns:40px minmax(0,1fr) 58px!important;
    gap:6px!important;
    border:1px solid rgba(86,111,138,.32)!important;
    border-radius:16px!important;
    background:rgba(14,24,35,.97)!important;
    box-shadow:0 8px 30px rgba(0,0,0,.30)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    overflow:hidden!important;
    z-index:10!important;
  }

  .app[data-page="chat"] .chat-composer-input-shell{
    min-width:0!important;
    width:100%!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .app[data-page="chat"] #chatMessageInput{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    min-height:40px!important;
    padding:9px 5px 8px 7px!important;
    background:transparent!important;
    border:0!important;
    font-size:16px!important;
  }

  .app[data-page="chat"] .chat-plus-btn{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    border-radius:12px!important;
  }

  .app[data-page="chat"] .chat-composer-inline-tools{
    height:40px!important;
  }

  .app[data-page="chat"] .chat-send-btn{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    min-height:40px!important;
    height:40px!important;
    padding:0 7px!important;
    border-radius:12px!important;
  }
}


/* v97 — own-message name row alignment
   The sender name/time inside your right-side bubbles should still start at the left
   edge of the bubble, like Discord-style chat, instead of being pushed to the right. */
.app[data-page="chat"] .chat-message.own .chat-message-meta{
  justify-content:flex-start!important;
  text-align:left!important;
}
.app[data-page="chat"] .chat-message.own .chat-message-meta > strong,
.app[data-page="chat"] .chat-message.own .chat-message-meta > time,
.app[data-page="chat"] .chat-message.own .chat-message-meta > em{
  text-align:left!important;
}


/* v98 — ACO disclaimer / authorization */
.aco-disclaimer-card{
  margin-top:16px;
  padding:15px 16px;
  border:1px solid rgba(231,180,76,.34);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(52,39,13,.42),rgba(28,23,14,.36));
  box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.aco-disclaimer-heading{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.aco-disclaimer-heading>div{
  display:grid;
  gap:2px;
}
.aco-disclaimer-heading strong{
  font-size:13px;
  color:#f7e4b1;
}
.aco-disclaimer-heading span:not(.aco-disclaimer-icon){
  font-size:10px;
  color:#bba97f;
}
.aco-disclaimer-icon{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(229,170,50,.16);
  border:1px solid rgba(229,170,50,.38);
  color:#ffd46e;
  font-weight:900;
}
.aco-disclaimer-card p{
  margin:8px 0;
  color:#c8c2b3;
  font-size:11px;
  line-height:1.55;
}
.aco-disclaimer-check{
  margin-top:12px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:11px 12px;
  border:1px solid rgba(116,143,171,.26);
  border-radius:11px;
  background:rgba(8,15,22,.58);
  cursor:pointer;
}
.aco-disclaimer-check input{
  width:18px;
  height:18px;
  margin:1px 0 0;
  flex:0 0 18px;
  accent-color:#2f91ef;
}
.aco-disclaimer-check>span{
  display:grid;
  gap:3px;
  color:#aeb9c6;
  font-size:10.5px;
  line-height:1.4;
}
.aco-disclaimer-check strong{
  color:#eef4fa;
  font-size:11.5px;
}
.aco-disclaimer-card.needs-acceptance{
  animation:acoDisclaimerPulse .45s ease-in-out 2;
  border-color:rgba(255,102,102,.70);
}
@keyframes acoDisclaimerPulse{
  50%{box-shadow:0 0 0 3px rgba(255,92,92,.12)}
}
@media(max-width:700px){
  .aco-disclaimer-card{
    padding:13px;
    border-radius:13px;
  }
  .aco-disclaimer-card p{
    font-size:10.5px;
  }
}


/* v99 — always-visible ACO disclaimer */
.aco-page-disclaimer{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:0 0 18px;
  padding:14px 16px;
  border:1px solid rgba(235,183,69,.42);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(52,39,13,.48),rgba(28,23,14,.42));
  box-shadow:0 8px 26px rgba(0,0,0,.12);
}
.aco-page-disclaimer-icon{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(242,190,70,.42);
  background:rgba(242,190,70,.14);
  color:#ffd66f;
  font-weight:950;
}
.aco-page-disclaimer>div:last-child{
  min-width:0;
}
.aco-page-disclaimer strong{
  display:block;
  margin-bottom:4px;
  color:#ffe2a0;
  font-size:13px;
}
.aco-page-disclaimer p{
  margin:0;
  color:#cfc6b2;
  font-size:11px;
  line-height:1.55;
}
.aco-page-disclaimer span{
  display:block;
  margin-top:7px;
  color:#a99c7e;
  font-size:10px;
  font-weight:700;
}
@media(max-width:700px){
  .aco-page-disclaimer{
    margin:0 0 14px;
    padding:12px 13px;
    border-radius:12px;
  }
  .aco-page-disclaimer p{
    font-size:10.5px;
  }
}


/* v100 — stronger ACO landing choices + explainer */
.aco-about-card{
  display:grid;
  grid-template-columns:60px minmax(0,1fr);
  gap:16px;
  padding:18px 20px;
  border:1px solid #243746;
  border-radius:16px;
  background:linear-gradient(145deg,rgba(10,18,27,.94),rgba(10,17,24,.88));
  box-shadow:0 12px 32px rgba(0,0,0,.18);
}
.aco-about-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(145deg,#13273a,#0d1e2c);
  border:1px solid #31556f;
  color:#98dcff;
  font-size:27px;
  font-weight:900;
}
.aco-about-copy h3{
  margin:4px 0 8px;
  font-size:22px;
}
.aco-about-copy p{
  margin:0;
  max-width:920px;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}
.aco-about-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
.aco-about-points span{
  display:block;
  padding:12px 13px;
  border:1px solid rgba(83,110,135,.28);
  border-radius:12px;
  background:rgba(10,16,23,.72);
  color:#aeb9c6;
  font-size:10.5px;
  line-height:1.5;
}
.aco-about-points b{color:#eef5fb}
.aco-home-choices{
  display:grid;
  gap:14px;
}
.aco-home-choice-head h3{
  margin:3px 0 4px;
  font-size:22px;
}
.aco-home-choice-head p{
  margin:0;
  color:var(--muted);
  font-size:12px;
}
.aco-home-choice-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.aco-home-choice-card{
  position:relative;
  width:100%;
  min-height:260px;
  display:grid;
  grid-template-rows:auto auto 1fr;
  align-content:start;
  gap:16px;
  padding:22px;
  text-align:left;
  border:1px solid #294155;
  border-radius:20px;
  background:linear-gradient(160deg,#0c1620,#0a1118);
  color:#edf5fb;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.aco-home-choice-card:hover{
  transform:translateY(-3px);
  border-color:#4c7393;
  box-shadow:0 20px 44px rgba(0,0,0,.24);
  background:linear-gradient(160deg,#0f1d29,#0c141d);
}
.aco-home-choice-card.single{
  background:linear-gradient(160deg,#0d1822,#0a1219 70%);
}
.aco-home-choice-card.multiple{
  background:linear-gradient(160deg,#0f1d2a,#0a1219 70%);
  border-color:#33607d;
}
.aco-home-choice-badge{
  justify-self:start;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(119,164,201,.32);
  background:rgba(16,36,53,.66);
  color:#aedfff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.aco-home-choice-icon{
  width:78px;
  height:78px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(145deg,#17314a,#102436);
  border:1px solid #3f6988;
  color:#c4edff;
  font-size:34px;
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.aco-home-choice-copy h4{
  margin:0 0 8px;
  font-size:24px;
}
.aco-home-choice-copy p{
  margin:0 0 12px;
  color:#b4c0cb;
  font-size:12px;
  line-height:1.55;
}
.aco-home-choice-copy ul{
  margin:0;
  padding-left:18px;
  color:#8fa1b2;
  font-size:11px;
  line-height:1.6;
}
.aco-home-choice-copy li + li{margin-top:3px}

@media(max-width:1000px){
  .aco-home-choice-grid,
  .aco-about-points{grid-template-columns:1fr}
}
@media(max-width:800px){
  .aco-about-card{grid-template-columns:1fr;padding:16px}
  .aco-about-icon{width:52px;height:52px;border-radius:14px;font-size:24px}
  .aco-about-copy h3,.aco-home-choice-head h3{font-size:19px}
  .aco-home-choice-grid{grid-template-columns:1fr;gap:12px}
  .aco-home-choice-card{min-height:0;padding:18px;border-radius:17px;gap:13px}
  .aco-home-choice-icon{width:64px;height:64px;border-radius:18px;font-size:29px}
  .aco-home-choice-copy h4{font-size:20px}
}


/* v101 — Shopify guest-checkout ACO */
.aco-shopify-entry-card{
  width:100%;display:grid;grid-template-columns:78px minmax(0,1fr) auto;align-items:center;gap:18px;
  padding:20px 22px;border:1px solid rgba(79,190,125,.42);border-radius:19px;text-align:left;
  background:linear-gradient(145deg,rgba(10,31,25,.96),rgba(8,19,20,.94));color:#eef9f3;cursor:pointer;
  box-shadow:0 16px 42px rgba(0,0,0,.19);transition:.16s ease
}
.aco-shopify-entry-card:hover{transform:translateY(-2px);border-color:rgba(92,218,145,.72);box-shadow:0 20px 48px rgba(0,0,0,.25)}
.aco-shopify-entry-icon{width:74px;height:74px;display:grid;place-items:center;border-radius:21px;background:linear-gradient(145deg,#143c2d,#0f2a23);border:1px solid #397858;color:#9bf2bd;font-size:32px;font-weight:950}
.aco-shopify-entry-copy h4{margin:6px 0 7px;font-size:22px}.aco-shopify-entry-copy p{margin:0;color:#afc7bb;font-size:11px;line-height:1.55;max-width:980px}
.aco-shopify-entry-top{display:flex;gap:6px;flex-wrap:wrap}.aco-shopify-pill{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:rgba(57,136,90,.18);border:1px solid rgba(81,190,123,.34);color:#9ee8bc;font-size:8.5px;font-weight:950;letter-spacing:.07em}.aco-shopify-pill.guest{color:#b7d8ff;border-color:rgba(88,148,199,.30);background:rgba(47,94,136,.16)}
.aco-shopify-entry-features{display:flex;gap:8px;flex-wrap:wrap;margin-top:11px}.aco-shopify-entry-features span{padding:5px 8px;border-radius:8px;background:rgba(255,255,255,.035);color:#8fa99d;font-size:9px}.aco-shopify-entry-card>b{font-size:28px;color:#76d49d}
.aco-type-card.shopify{border-color:rgba(73,170,111,.46);background:linear-gradient(145deg,#0d211a,#0a1515)}
.aco-type-card.shopify .aco-type-icon{border-color:#397858;background:#112f24;color:#9bf2bd}
.aco-mode-badge.shopify{border-color:rgba(73,180,118,.42)!important;background:rgba(32,92,58,.20)!important;color:#9ae6b8!important}
.aco-shopify-flow-head,.aco-shopify-builder-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:15px 16px;margin:4px 0 16px;border:1px solid rgba(67,145,97,.31);border-radius:14px;background:linear-gradient(145deg,rgba(13,35,27,.60),rgba(9,18,20,.56))}
.aco-shopify-flow-head h4,.aco-shopify-builder-head h4{margin:3px 0 5px;font-size:16px}.aco-shopify-flow-head p,.aco-shopify-builder-head p{margin:0;color:#9db0a7;font-size:10.5px;line-height:1.5;max-width:780px}
.aco-shopify-no-account{flex:0 0 auto;padding:7px 10px;border-radius:999px;border:1px solid rgba(85,197,130,.38);background:rgba(44,125,76,.16);color:#99e6b8;font-size:9px;font-weight:950;letter-spacing:.08em}
.aco-shopify-payment-card{margin-top:7px}.aco-shopify-billing-toggle{margin:14px 0}
.aco-shopify-product-builder{margin-bottom:14px;padding:16px;border:1px solid rgba(71,160,108,.34);border-radius:15px;background:linear-gradient(145deg,rgba(11,28,23,.74),rgba(8,17,20,.68))}
.aco-shopify-product-builder .aco-shopify-builder-head{padding:0;margin:0 0 14px;border:0;background:transparent}
.aco-shopify-builder-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:12px}.aco-shopify-builder-actions .import-status{margin-right:auto}
.aco-sensitive-guest-details{margin-top:14px;padding-top:12px;border-top:1px solid rgba(106,132,156,.18)}
.aco-item-meta a{color:#72bdf2;text-decoration:none}.aco-item-meta a:hover{text-decoration:underline}
@media(max-width:800px){
  .aco-shopify-entry-card{grid-template-columns:58px minmax(0,1fr);padding:16px;gap:12px}.aco-shopify-entry-icon{width:56px;height:56px;border-radius:16px;font-size:25px}.aco-shopify-entry-card>b{display:none}.aco-shopify-entry-copy h4{font-size:18px}.aco-shopify-entry-features{display:grid;grid-template-columns:1fr 1fr}
  .aco-shopify-flow-head,.aco-shopify-builder-head{display:grid;gap:10px}.aco-shopify-no-account{justify-self:start}.aco-shopify-builder-actions{align-items:stretch;flex-direction:column}.aco-shopify-builder-actions .btn{width:100%}.aco-shopify-builder-actions .import-status{margin:0}
}


/* v102 — ACO page regrouped to match requested hierarchy */
.aco-landing-v102{gap:18px}
.aco-overview-panel{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr);
  gap:14px;
  padding:16px;
  border:1px solid #273a4a;
  border-radius:18px;
  background:linear-gradient(150deg,rgba(10,18,27,.94),rgba(8,14,21,.90));
  box-shadow:0 16px 40px rgba(0,0,0,.18);
}
.aco-overview-explain{
  display:grid;
  grid-template-columns:62px minmax(0,1fr);
  gap:16px;
  padding:10px;
}
.aco-overview-icon{
  width:60px;height:60px;display:grid;place-items:center;
  border-radius:17px;background:#102638;border:1px solid #315a77;
  color:#9edfff;font-size:27px;font-weight:950
}
.aco-overview-copy h2{margin:4px 0 8px;font-size:25px;letter-spacing:-.02em}
.aco-overview-copy>p{margin:0;color:#a9b7c4;font-size:12px;line-height:1.62;max-width:930px}
.aco-overview-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:15px}
.aco-overview-steps>span{display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;padding:10px;border:1px solid rgba(82,110,135,.28);border-radius:11px;background:rgba(9,15,22,.64)}
.aco-overview-steps b{grid-row:1/3;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#142638;color:#a9defd;font-size:10px}
.aco-overview-steps strong{font-size:10.5px;color:#eef4f8}.aco-overview-steps small{font-size:9px;color:#7f8f9e;line-height:1.35;margin-top:2px}
.aco-overview-support{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:13px}.aco-overview-support strong{font-size:9px;color:#8698a8;text-transform:uppercase;letter-spacing:.06em}.aco-overview-support span{padding:5px 8px;border-radius:999px;background:rgba(59,105,140,.13);border:1px solid rgba(76,127,165,.25);color:#9dc6e0;font-size:8.5px;font-weight:800}
.aco-overview-disclaimer{
  align-self:stretch;padding:15px 16px;border:1px solid rgba(233,181,61,.34);border-radius:14px;
  background:linear-gradient(160deg,rgba(58,42,11,.38),rgba(28,22,12,.46));
}
.aco-overview-disclaimer-head{display:flex;align-items:center;gap:9px;margin-bottom:9px}.aco-overview-disclaimer-head>span{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:rgba(231,177,55,.15);border:1px solid rgba(231,177,55,.35);color:#ffd46e;font-weight:950}.aco-overview-disclaimer-head>div{display:grid;gap:1px}.aco-overview-disclaimer-head strong{font-size:12px;color:#ffe2a1}.aco-overview-disclaimer-head small{font-size:8.5px;color:#9f916f}
.aco-overview-disclaimer p{margin:8px 0;color:#c0b69f;font-size:9.5px;line-height:1.5}.aco-overview-disclaimer-confirm{margin-top:10px;padding:8px 9px;border-radius:9px;background:rgba(255,211,103,.07);color:#cbbd91;font-size:8.5px;font-weight:800}
.aco-home-choices-v102{gap:13px}
.aco-home-choice-grid-v102{align-items:stretch}
.aco-choice-v102{min-height:355px;grid-template-rows:auto auto 1fr auto;padding:24px}
.aco-choice-v102 .aco-home-choice-icon{width:86px;height:86px;border-radius:24px;font-size:38px}
.aco-choice-v102 .aco-home-choice-copy h4{font-size:27px;margin-bottom:9px}
.aco-choice-v102 .aco-home-choice-copy p{font-size:12.5px;max-width:600px}
.aco-choice-v102 .aco-home-choice-copy ul{font-size:11px;line-height:1.75}
.aco-choice-cta{align-self:end;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding:11px 12px;border-radius:11px;background:rgba(69,132,180,.10);border:1px solid rgba(78,137,179,.22);color:#afd9f3;font-size:10px;font-weight:900;letter-spacing:.02em}.aco-choice-cta b{font-size:18px;color:#78c6f5}
.aco-choice-v102.multiple .aco-choice-cta{background:rgba(58,117,157,.12)}
@media(max-width:1100px){.aco-overview-panel{grid-template-columns:1fr}.aco-overview-disclaimer{min-height:auto}}
@media(max-width:800px){
  .aco-overview-panel{padding:11px;border-radius:15px;gap:10px}
  .aco-overview-explain{grid-template-columns:1fr;padding:8px}.aco-overview-icon{width:52px;height:52px;border-radius:14px;font-size:23px}
  .aco-overview-copy h2{font-size:21px}.aco-overview-copy>p{font-size:11px}
  .aco-overview-steps{grid-template-columns:1fr}.aco-overview-disclaimer{padding:13px}
  .aco-home-choice-grid-v102{grid-template-columns:1fr}.aco-choice-v102{min-height:0;padding:19px}.aco-choice-v102 .aco-home-choice-icon{width:68px;height:68px;border-radius:19px;font-size:30px}.aco-choice-v102 .aco-home-choice-copy h4{font-size:22px}.aco-choice-cta{margin-top:13px}
}


/* v103 — simplify ACO home + add GUI site tile page */
.aco-landing-v102 .aco-shopify-entry-card,
.aco-landing-v102 .aco-privacy-strip{
  display:none!important;
}
.aco-home-choices-v102{
  gap:10px;
}
.aco-home-choice-head p{
  max-width:720px;
}
.aco-home-choice-grid-v102{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.aco-choice-v102{
  min-height:420px;
  aspect-ratio:1 / 1;
  justify-items:flex-start;
  align-content:flex-start;
  grid-template-rows:auto auto 1fr auto;
  padding:26px;
}
.aco-choice-v102 .aco-home-choice-copy{
  display:grid;
  align-content:start;
  gap:8px;
}
.aco-choice-v102 .aco-home-choice-copy p{
  max-width:440px;
}

.aco-site-choice-screen{
  display:grid;
  gap:16px;
}
.aco-site-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.aco-site-card{
  width:100%;
  min-height:220px;
  display:grid;
  grid-template-rows:auto auto 1fr;
  gap:16px;
  padding:22px;
  text-align:left;
  border:1px solid #294155;
  border-radius:20px;
  background:linear-gradient(160deg,#0c1620,#0a1118);
  color:#edf5fb;
  box-shadow:0 16px 40px rgba(0,0,0,.18);
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.aco-site-card:hover{
  transform:translateY(-3px);
  border-color:#4c7393;
  box-shadow:0 20px 44px rgba(0,0,0,.24);
  background:linear-gradient(160deg,#0f1d29,#0c141d);
}
.aco-site-card-badge{
  justify-self:start;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(119,164,201,.32);
  background:rgba(16,36,53,.66);
  color:#aedfff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.aco-site-card-badge.guest{
  color:#a7ecc0;
  border-color:rgba(89,180,127,.34);
  background:rgba(29,74,48,.56);
}
.aco-site-card-icon{
  width:78px;
  height:78px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(145deg,#17314a,#102436);
  border:1px solid #3f6988;
  color:#c4edff;
  font-size:34px;
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.aco-site-card-copy h3{
  margin:0 0 8px;
  font-size:24px;
}
.aco-site-card-copy p{
  margin:0;
  color:#b4c0cb;
  font-size:12px;
  line-height:1.6;
  max-width:460px;
}
.aco-site-card.target .aco-site-card-icon{background:linear-gradient(145deg,#16314a,#102436);border-color:#3d6e92;color:#c4edff}
.aco-site-card.walmart .aco-site-card-icon{background:linear-gradient(145deg,#2b3a18,#1d2a13);border-color:#7c9d3b;color:#eff7c0}
.aco-site-card.pokemon .aco-site-card-icon{background:linear-gradient(145deg,#3a2a13,#2a1d10);border-color:#b89039;color:#ffe39a}
.aco-site-card.shopify{border-color:rgba(73,170,111,.46);background:linear-gradient(160deg,#0d211a,#0a1515)}
.aco-site-card.shopify .aco-site-card-icon{background:linear-gradient(145deg,#143c2d,#0f2a23);border-color:#397858;color:#9bf2bd}
.aco-site-choice-note{
  padding:12px 14px;
  border:1px solid rgba(76,127,165,.24);
  border-radius:12px;
  background:rgba(10,18,27,.78);
  color:#8ea0b3;
  font-size:10.5px;
  line-height:1.55;
}

@media(max-width:1100px){
  .aco-home-choice-grid-v102,
  .aco-site-grid{grid-template-columns:1fr}
  .aco-choice-v102{aspect-ratio:auto;min-height:340px}
}
@media(max-width:800px){
  .aco-choice-v102{min-height:0;padding:20px}
  .aco-site-card{min-height:0;padding:18px;border-radius:17px;gap:13px}
  .aco-site-card-icon{width:64px;height:64px;border-radius:18px;font-size:29px}
  .aco-site-card-copy h3{font-size:20px}
}


/* v104 — tone down oversized ACO home cards and keep them neatly inside the workspace */
.aco-home-choices-v102{
  max-width:1180px;
  width:100%;
}
.aco-home-choice-head{
  max-width:920px;
}
.aco-home-choice-grid-v102{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  width:100%;
  max-width:1180px;
  align-items:stretch;
}
.aco-choice-v102{
  min-height:295px;
  aspect-ratio:auto;
  height:100%;
  max-width:100%;
  padding:22px;
  border-radius:18px;
  overflow:hidden;
  justify-items:flex-start;
  align-content:start;
  box-sizing:border-box;
}
.aco-choice-v102 .aco-home-choice-badge{
  font-size:9px;
  padding:5px 9px;
}
.aco-choice-v102 .aco-home-choice-icon{
  width:72px;
  height:72px;
  border-radius:20px;
  font-size:31px;
}
.aco-choice-v102 .aco-home-choice-copy h4{
  font-size:21px;
  margin-bottom:7px;
}
.aco-choice-v102 .aco-home-choice-copy p{
  font-size:11px;
  line-height:1.55;
  max-width:420px;
}
.aco-choice-v102 .aco-home-choice-copy ul{
  font-size:10px;
  line-height:1.6;
  padding-left:16px;
}
.aco-choice-v102 .aco-home-choice-copy li + li{
  margin-top:2px;
}
.aco-choice-cta{
  margin-top:14px;
  padding:10px 11px;
  font-size:9.5px;
}

@media(max-width:1200px){
  .aco-home-choice-grid-v102{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:900px){
  .aco-home-choices-v102,
  .aco-home-choice-grid-v102{
    max-width:none;
  }
  .aco-home-choice-grid-v102{
    grid-template-columns:1fr;
    gap:12px;
  }
  .aco-choice-v102{
    min-height:0;
    padding:18px;
  }
  .aco-choice-v102 .aco-home-choice-icon{
    width:64px;
    height:64px;
    border-radius:18px;
    font-size:28px;
  }
  .aco-choice-v102 .aco-home-choice-copy h4{
    font-size:20px;
  }
}


/* v106 — Sam's Club + Costco ACO site tiles */
.aco-site-card-badge.account{
  color:#c9e8ff;
  border-color:rgba(95,157,202,.36);
  background:rgba(35,82,117,.48);
}
.aco-site-card.sams .aco-site-card-icon{
  background:linear-gradient(145deg,#15364a,#102838);
  border-color:#3e7898;
  color:#bdeaff;
}
.aco-site-card.costco .aco-site-card-icon{
  background:linear-gradient(145deg,#3a2020,#261616);
  border-color:#915050;
  color:#ffd0d0;
}


/* v108 — Item Not in Catalog + ACO auto-drafts */
.aco-draft-resume-card{
  display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:14px;
  padding:14px 16px;border:1px solid rgba(72,145,195,.38);border-radius:15px;
  background:linear-gradient(145deg,rgba(11,31,45,.94),rgba(9,18,27,.94));
  box-shadow:0 12px 32px rgba(0,0,0,.18)
}
.aco-draft-resume-icon{
  width:46px;height:46px;display:grid;place-items:center;border-radius:13px;
  background:#102638;border:1px solid #315a77;color:#9edfff;font-size:20px;font-weight:900
}
.aco-draft-resume-copy{display:grid;gap:3px;min-width:0}
.aco-draft-resume-copy>strong{font-size:14px;color:#eef7ff}
.aco-draft-resume-copy>span{font-size:10.5px;color:#a9bac8}
.aco-draft-resume-copy>small{font-size:9px;color:#728595;line-height:1.45}
.aco-draft-resume-actions{display:flex;gap:8px;align-items:center}
.aco-draft-save-state{
  display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;
  border:1px solid rgba(84,112,138,.26);background:rgba(15,27,38,.62);
  color:#7f94a7;font-size:8.5px;font-weight:800
}
.aco-draft-save-state.saving{color:#b7c6d3}
.aco-draft-save-state.saved{color:#9ddfba;border-color:rgba(73,170,111,.28);background:rgba(27,76,48,.18)}
.aco-draft-save-state.error{color:#ff9a9a;border-color:rgba(255,101,101,.3);background:rgba(88,28,28,.18)}

.aco-product-source-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px
}
.aco-product-source-grid .aco-catalog-chooser{margin:0;height:100%}
.aco-manual-chooser{
  border-color:rgba(229,174,71,.32)!important;
  background:linear-gradient(145deg,rgba(49,35,14,.34),rgba(13,20,27,.94))!important
}
.aco-manual-chooser .aco-catalog-icon{
  background:rgba(93,65,18,.36)!important;border-color:rgba(218,166,67,.38)!important;color:#ffd986!important
}
.aco-manual-item-builder{
  margin:0 0 14px;padding:15px;border:1px solid rgba(219,170,75,.32);border-radius:14px;
  background:linear-gradient(145deg,rgba(42,31,13,.34),rgba(9,17,23,.78))
}
.aco-manual-builder-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:13px}
.aco-manual-builder-head h4{margin:3px 0 5px;font-size:16px}
.aco-manual-builder-head p{margin:0;max-width:760px;color:#9eaaae;font-size:10px;line-height:1.5}
.aco-manual-retailer-badge{
  flex:0 0 auto;padding:6px 9px;border-radius:999px;border:1px solid rgba(213,165,72,.35);
  background:rgba(111,76,20,.18);color:#f0cf87;font-size:9px;font-weight:900
}
.aco-manual-builder-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:11px}
.aco-manual-builder-actions .import-status{margin-right:auto}
.aco-manual-item-chip{
  display:inline-flex;align-items:center;padding:3px 6px;border-radius:999px;
  border:1px solid rgba(212,164,72,.25);background:rgba(105,73,20,.15);
  color:#dcbf82;font-size:7.5px;font-weight:900;letter-spacing:.04em
}
.aco-empty-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:8px}

@media(max-width:800px){
  .aco-draft-resume-card{grid-template-columns:42px minmax(0,1fr);padding:13px}
  .aco-draft-resume-icon{width:40px;height:40px;border-radius:12px}
  .aco-draft-resume-actions{grid-column:1/-1}
  .aco-draft-resume-actions .btn{flex:1}
  .aco-product-source-grid{grid-template-columns:1fr}
  .aco-manual-builder-head{display:grid;gap:8px}
  .aco-manual-retailer-badge{justify-self:start}
  .aco-manual-builder-actions{align-items:stretch;flex-direction:column}
  .aco-manual-builder-actions .btn{width:100%}
  .aco-manual-builder-actions .import-status{margin:0}
}


/* v111 — selected-product mass edit */
.mass-edit-btn{
  border-color:#385776;
  background:#102033;
  color:#acd8ff;
  font-weight:850;
}
.mass-edit-btn:hover{background:#152a42;border-color:#4e79a1;color:#d8eeff}
.mass-edit-modal{width:min(720px,96vw)}
.mass-edit-note{
  margin:-2px 0 16px;padding:11px 12px;border:1px solid #25394d;border-radius:11px;
  background:#0b1823;color:#9eb0c1;font-size:11px;line-height:1.5
}
.mass-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.mass-edit-field{
  min-width:0;padding:12px;border:1px solid #22313f;border-radius:12px;background:#0a1118
}
.mass-edit-field.mass-edit-featured{border-color:#315875;background:#0b1721}
.mass-edit-toggle{
  display:flex!important;align-items:center;gap:8px!important;margin:0 0 9px!important;
  color:#d7e5f2!important;font-size:12px!important;font-weight:850!important;cursor:pointer
}
.mass-edit-toggle input{width:16px!important;height:16px!important;margin:0!important;accent-color:var(--accent);cursor:pointer}
.mass-edit-field input:disabled{opacity:.42;cursor:not-allowed}
.mass-edit-preview{
  margin-top:12px;padding:10px 11px;border:1px solid #263541;border-radius:10px;background:#0b1219;
  color:#91a3b4;font-size:11px;line-height:1.45
}
.mass-edit-preview strong{color:#d8e7f4}
.mass-edit-preview-error{color:#ff9ca7;font-weight:800}

@media(max-width:700px){
  .mass-edit-grid{grid-template-columns:1fr}
  .mass-edit-modal{width:calc(100vw - 18px);max-height:calc(100dvh - 18px);padding:15px}
  #bulkBar .mass-edit-btn{order:2}
}


/* v114 member display name */
.display-name-modal{width:min(520px,calc(100vw - 28px))}
.display-name-account-card{
  display:flex;
  align-items:center;
  gap:12px;
  margin:4px 0 18px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(8,17,25,.7);
}
.display-name-account-card small{
  display:block;
  margin-bottom:3px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.display-name-account-card strong{
  display:block;
  max-width:360px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#e7eef8;
  font-size:12px;
}
.display-name-avatar-preview{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:11px;
  border:1px solid rgba(76,139,193,.5);
  background:linear-gradient(145deg,#173959,#0e1d2c);
  color:#d9ecff;
  font-size:12px;
  font-weight:900;
}
#displayNameInput{font-size:16px}
@media(max-width:800px){
  .display-name-modal{width:min(94vw,520px)}
  .display-name-account-card strong{max-width:66vw}
}


/* v116 — duplicate calendar events + movable duplicate window */
.drop-detail-admin-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#duplicateDropModal{background:rgba(0,0,0,.48)}
.duplicate-drop-modal{width:min(680px,calc(100vw - 28px));will-change:transform;transition:box-shadow .12s ease}
.duplicate-drop-modal.is-dragging{box-shadow:0 34px 95px rgba(0,0,0,.62);user-select:none}
.duplicate-drop-drag-handle{cursor:grab;align-items:flex-start;margin:-6px -6px 15px;padding:6px;border-radius:10px}
.duplicate-drop-modal.is-dragging .duplicate-drop-drag-handle{cursor:grabbing}
.duplicate-drop-drag-copy{min-width:0;flex:1}
.duplicate-drop-drag-label{display:flex;align-items:center;gap:6px;margin-bottom:4px;color:#7790a6;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.duplicate-drop-grip{font-size:15px;line-height:1;letter-spacing:-3px;color:#6d8da8}
.duplicate-drop-head-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.duplicate-drop-center-btn{min-height:30px;padding:5px 9px;font-size:10px}

.duplicate-drop-source-card{
  display:flex;align-items:center;gap:13px;padding:13px;margin:4px 0 18px;
  border:1px solid var(--line);border-radius:13px;background:rgba(8,18,27,.76)
}
.duplicate-drop-source-image{
  width:58px;height:58px;flex:0 0 58px;border-radius:11px;overflow:hidden;
  display:grid;place-items:center;background:#111d28;border:1px solid rgba(68,105,139,.5);
  color:#8ea3b7;font-size:12px;font-weight:900
}
.duplicate-drop-source-image img{width:100%;height:100%;object-fit:contain;background:#fff}
.duplicate-drop-source-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.duplicate-drop-source-copy small{font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#6f91ad}
.duplicate-drop-source-copy strong{font-size:15px;color:#f4f8fc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.duplicate-drop-source-copy span{font-size:11px;color:var(--muted)}
.duplicate-drop-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.duplicate-drop-timezone{
  min-height:40px;display:flex;align-items:center;padding:0 11px;border:1px solid var(--line);
  border-radius:9px;background:#0b141d;color:#dbe9f5;font-size:12px;font-weight:700
}
.duplicate-drop-dates-section{
  margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:13px;background:rgba(8,17,25,.6)
}
.duplicate-drop-dates-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.duplicate-drop-dates-head label{display:block;font-weight:800;color:#e6eef7;font-size:12px}
.duplicate-drop-dates{display:grid;gap:8px}
.duplicate-drop-date-row{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:8px;align-items:center}
.duplicate-drop-date-row input{width:100%}
.duplicate-drop-tip{
  margin-top:10px;padding:9px 10px;border-radius:9px;background:rgba(31,132,214,.08);
  border:1px solid rgba(31,132,214,.18);color:#8fb6d5;font-size:10px;line-height:1.45
}
@media(max-width:650px){
  #duplicateDropModal{background:rgba(0,0,0,.62)}
  .duplicate-drop-modal{width:calc(100vw - 20px);transform:none!important}
  .duplicate-drop-drag-handle{cursor:default}
  .duplicate-drop-drag-label,.duplicate-drop-center-btn{display:none}
  .duplicate-drop-settings-grid{grid-template-columns:1fr}
  .duplicate-drop-dates-head{align-items:stretch;flex-direction:column}
  .duplicate-drop-dates-head .btn{align-self:flex-start}
  .drop-detail-admin-actions{gap:6px}
}


/* v117 — retailer logos on Drop Calendar */
.drop-chip-kicker{
  display:flex!important;
  align-items:center;
  gap:5px;
  min-width:0;
  margin:0;
  color:#78bdf0;
  font-size:8px;
  font-weight:850;
  line-height:1.05;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.drop-chip-kicker em{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font:inherit;
  color:inherit;
  font-style:normal;
}
.drop-retailer-logo{
  position:relative;
  display:inline-grid;
  place-items:center;
  width:16px;
  height:16px;
  flex:0 0 16px;
  border-radius:5px;
  overflow:hidden;
  box-sizing:border-box;
  background:#fff;
  border:1px solid rgba(255,255,255,.16);
  line-height:1;
  font-style:normal;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.drop-retailer-logo svg{display:block;width:100%;height:100%}
.drop-retailer-logo b{
  display:block!important;
  margin:0!important;
  color:inherit!important;
  font:900 8px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.drop-retailer-logo.retailer-target{background:#fff;padding:1px}
.drop-retailer-logo.retailer-walmart{background:#0071ce;padding:1px}
.drop-retailer-logo.retailer-sams{background:#fff;padding:1px}
.drop-retailer-logo.retailer-costco{background:#fff;color:#e31837}
.drop-retailer-logo.retailer-costco b{font-size:11px!important;font-style:italic!important}
.drop-retailer-logo.retailer-pokemon-center{background:#fff;padding:1px}
.drop-retailer-logo.retailer-shopify{background:#95bf47;color:#fff}
.drop-retailer-logo.retailer-fivebelow{
  background:linear-gradient(145deg,#00a6d7 0 54%,#e83f8d 54% 100%);
  color:#fff
}
.drop-retailer-logo.retailer-fivebelow b{font-size:10px!important}
.drop-retailer-logo.retailer-bestbuy{background:#ffe000;padding:1px}
.drop-retailer-logo.retailer-gamestop{background:#171a1f;color:#fff}
.drop-retailer-logo.retailer-gamestop b{font-size:6.5px!important}
.drop-retailer-logo.retailer-amazon{background:#fff;color:#111820}
.drop-retailer-logo.retailer-amazon b{font-size:12px!important}
.drop-retailer-logo.retailer-default{background:#172838;color:#9ed2fa}

.drop-upcoming-thumb,.drop-mobile-thumb{position:relative}
.drop-retailer-logo.corner{
  position:absolute;
  right:4px;
  bottom:4px;
  width:18px;
  height:18px;
  z-index:2;
  border-radius:6px;
  box-shadow:0 2px 7px rgba(0,0,0,.45);
}
.drop-retailer-logo.placeholder{
  width:30px;
  height:30px;
  flex-basis:30px;
  border-radius:9px;
}
.drop-retailer-logo.placeholder b{font-size:12px!important}

@media(max-width:800px){
  .drop-chip-kicker{gap:2px;font-size:6px;line-height:1}
  .drop-retailer-logo.calendar{
    width:11px;
    height:11px;
    flex-basis:11px;
    border-radius:3px;
  }
  .drop-retailer-logo.calendar b{font-size:5.5px!important}
  .drop-retailer-logo.retailer-costco.calendar b{font-size:7px!important}
  .drop-retailer-logo.retailer-fivebelow.calendar b{font-size:7px!important}
  .drop-retailer-logo.retailer-amazon.calendar b{font-size:8px!important}
  .drop-retailer-logo.retailer-gamestop.calendar b{font-size:4px!important}
}


/* v118 — Drop Calendar event draft autosave / resume */
.drop-editor-modal-head{
  align-items:flex-start;
  gap:12px;
}
.drop-editor-head-actions{
  display:flex;
  align-items:center;
  gap:9px;
}
.drop-draft-save-state{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(91,122,148,.38);
  border-radius:999px;
  background:rgba(7,18,27,.72);
  color:#91a1b2;
  font-size:10px;
  font-weight:800;
  letter-spacing:.02em;
  white-space:nowrap;
}
.drop-draft-save-state.saving{
  color:#ffd66b;
  border-color:rgba(202,160,54,.42);
}
.drop-draft-save-state.saved{
  color:#8fdbb5;
  border-color:rgba(54,160,108,.42);
}
.drop-draft-save-state.error{
  color:#ff9a9a;
  border-color:rgba(215,75,75,.46);
}

.drop-resume-draft-btn{
  border-color:rgba(56,157,233,.48)!important;
  background:rgba(17,66,102,.64)!important;
  color:#c9ebff!important;
}
.drop-resume-draft-btn:hover{
  background:rgba(24,91,139,.78)!important;
  border-color:rgba(82,183,255,.72)!important;
}

.drop-draft-resume-panel{
  display:grid;
  grid-template-columns:46px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:2px 0 16px;
  padding:13px 14px;
  border:1px solid rgba(52,151,224,.46);
  border-radius:13px;
  background:
    linear-gradient(135deg,rgba(17,61,94,.76),rgba(9,26,39,.88));
}
.drop-draft-resume-panel.hidden{display:none!important}
.drop-draft-resume-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(34,151,236,.16);
  border:1px solid rgba(74,169,238,.42);
  color:#9ddcff;
  font-size:20px;
  font-weight:900;
}
.drop-draft-resume-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.drop-draft-resume-copy strong{
  color:#f3f8fd;
  font-size:13px;
  line-height:1.2;
}
.drop-draft-resume-copy span{
  color:#a9bccd;
  font-size:11px;
  line-height:1.3;
}
.drop-draft-resume-copy small{
  margin-top:2px;
  color:#72879a;
  font-size:10px;
}
.drop-draft-resume-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

@media(max-width:800px){
  .drop-editor-modal-head{
    align-items:center;
  }
  .drop-editor-head-actions{
    gap:6px;
  }
  .drop-draft-save-state{
    min-height:25px;
    padding:4px 7px;
    font-size:9px;
  }
  .drop-draft-resume-panel{
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
    padding:12px;
  }
  .drop-draft-resume-icon{
    width:40px;
    height:40px;
  }
  .drop-draft-resume-actions{
    grid-column:1 / -1;
    width:100%;
  }
  .drop-draft-resume-actions .btn{
    flex:1 1 140px;
  }
}

@media(max-width:560px){
  #resumeDropDraftBtn{
    order:3;
    flex:1 1 100%;
  }
  .drop-editor-head-actions .drop-draft-save-state{
    display:none;
  }
}


/* v119 — Products Show All / Use Pages */
.product-show-all-btn {
  min-width: 88px;
  height: 36px;
  padding: 0 14px;
  border-color: rgba(47,150,232,.48);
  background: rgba(17,55,82,.72);
  color: #bfe5ff;
  white-space: nowrap;
}

.product-show-all-btn:hover {
  border-color: #3da5f4;
  background: rgba(22,79,119,.84);
  color: #fff;
}

.product-show-all-btn[aria-pressed="true"] {
  background: #167ed0;
  border-color: #2e9bff;
  color: #fff;
  box-shadow: 0 0 0 2px rgba(46,155,255,.11);
}

@media (min-width: 761px) {
  .app[data-page="products"] #productsPage.show-all-products .product-table-wrap table,
  .app[data-page="products"] #productsPage.show-all-products .product-table-wrap tbody {
    height: auto;
  }

  .app[data-page="products"] #productsPage.show-all-products .product-table-wrap tbody tr {
    height: auto;
  }
}

@media (max-width: 760px) {
  .product-show-all-btn {
    min-width: 76px;
    height: 40px;
    padding-left: 11px;
    padding-right: 11px;
  }

  .product-pager.show-all-mode .product-pager-controls {
    justify-content: center;
  }
}


/* v120 — catalog selection -> ACO handoff confirmation */
.aco-preloaded-products-banner{
  display:flex;
  align-items:center;
  gap:11px;
  margin:0 0 13px;
  padding:11px 13px;
  border:1px solid rgba(55,162,228,.44);
  border-radius:12px;
  background:linear-gradient(135deg,rgba(19,74,109,.74),rgba(8,27,41,.82));
}
.aco-preloaded-products-banner.hidden{display:none!important}
.aco-preloaded-products-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#1b8ed8;
  color:#fff;
  font-size:17px;
  font-weight:900;
}
.aco-preloaded-products-banner > div:last-child{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.aco-preloaded-products-banner strong{
  color:#f3f9ff;
  font-size:12px;
  line-height:1.2;
}
.aco-preloaded-products-banner span{
  color:#a8c5d8;
  font-size:10px;
  line-height:1.3;
}

@media(max-width:760px){
  .aco-preloaded-products-banner{
    padding:10px;
    margin-bottom:10px;
  }
  .aco-preloaded-products-icon{
    width:32px;
    height:32px;
    flex-basis:32px;
  }
}


/* ==========================================================================
   v121 — Resources
   ========================================================================== */

.resources-page {
  min-width: 0;
}

.resources-topbar .muted {
  margin: 4px 0 0;
}

.resources-workspace {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  gap: 14px;
  min-height: 620px;
}

.resources-sidebar,
.resources-main {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(7, 15, 23, .88);
  backdrop-filter: blur(10px);
}

.resources-sidebar {
  padding: 12px 8px 12px;
  overflow: hidden;
}

.resources-sidebar-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 8px 10px;
  border-bottom: 1px solid rgba(70, 95, 116, .27);
  margin-bottom: 7px;
}

.resources-sidebar-head strong {
  font-size: 12px;
  color: #edf6ff;
}

.resources-sidebar-head span {
  font-size: 9px;
  color: var(--muted);
}

.resource-folder-tree {
  max-height: calc(100vh - 245px);
  overflow: auto;
  padding: 2px 0 14px;
}

.resource-tree-row {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  min-height: 34px;
  padding-left: calc(var(--resource-depth, 0) * 14px);
  border-radius: 8px;
}

.resource-tree-row.active {
  background: rgba(33, 135, 207, .18);
}

.resource-tree-toggle {
  width: 20px;
  height: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #7990a4;
  cursor: pointer;
}

.resource-tree-toggle.empty {
  opacity: .45;
  cursor: default;
}

.resource-tree-folder {
  min-width: 0;
  height: 32px;
  padding: 0 7px 0 2px;
  border: 0;
  background: transparent;
  color: #cbd8e4;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  text-align: left;
  cursor: pointer;
  border-radius: 7px;
}

.resource-tree-folder:hover {
  background: rgba(255,255,255,.045);
  color: #fff;
}

.resource-tree-folder > span:nth-child(2) {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 11px;
  font-weight: 750;
}

.resource-tree-folder small {
  color: #587085;
  font-size: 8px;
  font-weight: 800;
}

.resource-folder-glyph {
  color: #e2b650;
  font-size: 11px;
}

.resource-folder-glyph.root {
  color: #69b9ef;
}

.resource-tree-empty {
  padding: 14px 10px;
  color: #6f8293;
  font-size: 10px;
}

.resources-main {
  padding: 14px;
  overflow: hidden;
}

.resources-main-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
}

.resource-breadcrumbs {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  overflow-x: auto;
  scrollbar-width: none;
}

.resource-breadcrumbs::-webkit-scrollbar {
  display: none;
}

.resource-breadcrumbs button {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: #8fcff8;
  padding: 5px 2px;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.resource-breadcrumbs span {
  color: #52687b;
  font-size: 11px;
}

.resource-search-input {
  flex: 0 1 320px;
  min-width: 180px;
}

.resources-current-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(69, 93, 113, .28);
}

.resources-current-head h2 {
  margin: 0 0 3px;
  font-size: 19px;
}

.resource-section {
  margin-top: 16px;
}

.resource-section-label {
  margin-bottom: 8px;
  color: #6d8193;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .16em;
}

.resource-folder-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.resource-folder-card {
  position: relative;
  display: flex;
  align-items: stretch;
  min-width: 0;
  border: 1px solid rgba(60, 93, 119, .42);
  border-radius: 11px;
  background: rgba(11, 25, 36, .78);
  overflow: hidden;
}

.resource-folder-card:hover {
  border-color: rgba(56, 154, 224, .65);
  background: rgba(14, 36, 52, .86);
}

.resource-folder-card-main {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 8px;
  padding: 12px 9px 12px 11px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.resource-big-folder {
  color: #e8bb51;
  font-size: 22px;
}

.resource-folder-card-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.resource-folder-card-copy strong {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #f0f6fb;
  font-size: 11px;
}

.resource-folder-card-copy small {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #73899c;
  font-size: 8px;
}

.resource-folder-chevron {
  color: #5d768a;
  font-size: 19px;
}

.resource-card-admin-actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 6px 6px 6px 0;
}

.resource-item-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.resource-item-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid rgba(57, 84, 106, .38);
  border-radius: 10px;
  background: rgba(10, 21, 31, .77);
}

.resource-item-card:hover {
  border-color: rgba(57, 142, 204, .55);
}

.resource-item-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  border: 1px solid rgba(69, 110, 140, .38);
  background: rgba(17, 46, 67, .72);
  color: #93d4ff;
  font-size: 19px;
  font-weight: 900;
}

.resource-item-icon.type-guide {
  color: #c5a8ff;
  background: rgba(69, 42, 103, .42);
}

.resource-item-icon.type-file {
  color: #93dfb0;
  background: rgba(32, 83, 57, .42);
}

.resource-item-copy {
  min-width: 0;
}

.resource-item-type {
  margin-bottom: 2px;
  color: #5f9bc4;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.resource-item-copy strong {
  display: block;
  color: #f2f7fb;
  font-size: 11px;
}

.resource-item-copy p {
  margin: 3px 0;
  max-width: 780px;
  color: #9aabba;
  font-size: 9px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.resource-item-copy small {
  color: #657b8e;
  font-size: 8px;
}

.resource-item-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.resource-open-btn {
  min-height: 31px;
  padding: 6px 9px;
  font-size: 9px;
}

.resources-empty {
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  text-align: center;
  color: #8397aa;
}

.resources-empty strong {
  color: #dce9f3;
  font-size: 13px;
}

.resources-empty span {
  font-size: 10px;
}

.resource-setup-missing {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0;
  padding: 14px;
  border: 1px solid rgba(217, 154, 55, .5);
  border-radius: 12px;
  background: rgba(67, 45, 15, .75);
}

.resource-setup-missing.hidden {
  display: none !important;
}

.resource-setup-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(228, 164, 48, .17);
  color: #ffd46e;
  font-size: 20px;
  font-weight: 900;
}

.resource-setup-missing strong,
.resource-setup-missing span {
  display: block;
}

.resource-setup-missing strong {
  margin-bottom: 2px;
  color: #ffe9b6;
  font-size: 12px;
}

.resource-setup-missing span {
  color: #c6ae7d;
  font-size: 10px;
}

.resource-editor-modal {
  width: min(620px, calc(100vw - 28px));
}

.resource-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}

.resource-form-wide {
  grid-column: 1 / -1;
}

.resource-guide-modal {
  width: min(760px, calc(100vw - 28px));
}

.resource-guide-description {
  margin: 4px 0 14px;
  padding: 10px 12px;
  border-left: 3px solid #2e95d6;
  border-radius: 0 8px 8px 0;
  background: rgba(29, 72, 100, .2);
  color: #b7c7d5;
  font-size: 11px;
  line-height: 1.45;
}

.resource-guide-body {
  min-height: 120px;
  max-height: 58vh;
  overflow: auto;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(5, 12, 19, .72);
  color: #d7e1e9;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: 11px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

@media (max-width: 1050px) {
  .resource-folder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .resources-workspace {
    grid-template-columns: 1fr;
    gap: 10px;
    min-height: 0;
  }

  .resources-sidebar {
    padding: 9px 7px;
  }

  .resource-folder-tree {
    max-height: 220px;
  }

  .resources-main {
    padding: 11px;
  }

  .resources-main-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .resource-search-input {
    min-width: 0;
    width: 100%;
    flex-basis: auto;
  }

  .resource-folder-grid {
    grid-template-columns: 1fr;
  }

  .resource-item-card {
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
  }

  .resource-item-icon {
    width: 38px;
    height: 38px;
  }

  .resource-item-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-left: 48px;
  }

  .resource-item-copy p {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .resource-form-grid {
    grid-template-columns: 1fr;
  }

  .resource-form-wide {
    grid-column: auto;
  }
}

@media (max-width: 480px) {
  .resources-topbar .top-actions {
    width: 100%;
  }

  .resources-topbar .top-actions .btn {
    flex: 1 1 auto;
  }

  .resource-item-actions {
    padding-left: 0;
  }
}


/* v122 — Resources interaction repair */
#resourcesPage,
#resourcesPage .resources-workspace,
#resourcesPage .resources-sidebar,
#resourcesPage .resources-main {
  pointer-events: auto;
}

#resourcesPage button,
#resourcesPage a,
#resourcesPage input,
#resourcesPage select,
#resourcesPage textarea {
  pointer-events: auto;
}