/* Shared, accessible visual system for storefront and support workspaces. */
:root {
  --bg-1:#0d1018; --bg-2:#111622; --bg-3:#181e2c;
  --ink-1:#f2f4fa; --ink-2:#ced4e2; --ink-3:#a7b0c3; --ink-muted:#939eb4;
  --line:rgba(177,190,217,.16); --line-strong:rgba(177,190,217,.28);
  --surface:#151b28; --surface-strong:#1c2434; --surface-soft:#151b28;
  --gradient-primary:linear-gradient(135deg,#7055db,#8565e9); --grad:var(--gradient-primary);
  --a-bg:#0d1018; --a-bg-2:#141a27; --a-bg-3:#1c2434; --a-border:#2a3448;
  --a-text:#f2f4fa; --a-text-2:#ced4e2; --a-text-3:#a7b0c3;
  --a-out-bg:#493777; --a-out-bg-2:#534082; --a-primary-gradient:var(--gradient-primary);
  --m-bg:#0d1018; --m-bg-2:#141a27; --m-surface:#1c2434; --m-surface-2:#242f43;
  --m-text:#f2f4fa; --m-text-2:#ced4e2; --m-text-3:#a7b0c3;
  --m-out-bg:#493777; --m-out-bg-2:#534082;
  color-scheme:dark;
}
body { background:#0d1018; background-attachment:scroll; }
.pp-header,.brand-header { background:#111622; backdrop-filter:none; }
.pp-logo-text,.brand-name { white-space:nowrap; }
.pp-logo-mark,.brand-symbol { box-shadow:none; flex-shrink:0; }
.pixel-float { display:none; }
.hero { padding:64px 20px 48px; min-height:540px; }
.hero h1 { max-width:780px; letter-spacing:-1.2px; }
.pp-title,.hero h1 { font-family:Inter,"Segoe UI",sans-serif; }
.pp-card,.pp-product,.stat,.step,.card,.preview-card { background:#151b28; border:1px solid var(--line); box-shadow:0 8px 24px #0002; }
.pp-product { height:100%; padding:24px; }
.pp-btn,.button,.m-btn,.a-btn { border-radius:10px; box-shadow:none; line-height:1.35; }
.pp-btn.primary,.button.primary,.m-btn-primary,.a-btn-primary { background:var(--gradient-primary); box-shadow:none; }
.pp-btn:hover,.button:hover { box-shadow:none; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid #b8a6ff; outline-offset:3px; }
button:disabled { cursor:not-allowed; opacity:.55; transform:none; }
.admin-page .msg.admin,.client-page .msg.admin,.a-msg-out { background:#493777; border-color:#65528b; box-shadow:none; }
.admin-page .msg.client,.client-page .msg.client,.a-msg-in { background:#1c2434; box-shadow:none; }
.messages,.a-messages,.m-messages { background:#0d1018; overscroll-behavior:contain; }
.msg,.a-msg,.m-msg { flex-shrink:0; overflow-wrap:anywhere; }
.msg .meta,.a-msg-meta { color:#c5cadd; }
.chat-item strong { font-family:Inter,"Segoe UI",sans-serif; }
.chat-item { box-shadow:none; background:#151b28; }
.chat-item.active { background:#292440; border-color:#9b83ed; }
.status-box,.banner,.m-banner,.a-banner { box-shadow:none; }
.chat-filters { display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; }
.chat-filters button { background:#1c2434; color:#ced4e2; border:1px solid #364158; padding:8px 11px; border-radius:9px; font:inherit; font-size:13px; }
.chat-filters button[aria-pressed=true] { background:#493777; border-color:#b8a6ff; color:white; }
.a-search-wrap .chat-filters { padding-bottom:0; }
.draft-panel { min-height:0; }
.admin-main { display:flex; flex-direction:column; }
.admin-main>.messages { flex:1 1 0; min-height:0; height:auto; }
.admin-main>.chat-header,.admin-main>.send-form,.admin-main>.draft-panel { flex:0 0 auto; }
.draft-panel summary { cursor:pointer; padding:8px 4px; font-size:13px; color:#c8b9f9; }
.draft-panel textarea { width:100%; min-height:64px; max-height:140px; }
.delivery-status { margin:4px 0; color:#bac7df; font-size:12px; line-height:1.4; }
.delivery-status[data-state=error] { color:#ffb6b6; }
.delivery-status[data-state=sent] { color:#8cdec0; }
.a-client-info,.a-operator-summary { flex-wrap:wrap; overflow:visible; }
.a-client-info-main { display:none; }
.a-msg-delete { min-width:32px; min-height:32px; left:-36px; }
.a-screen-chat.is-empty .a-client-info { display:none; }
@media(max-width:1100px) {
  input,textarea,select { font-size:16px !important; }
  .admin-main { display:flex !important; flex-direction:column; gap:6px; }
  .admin-layout:not([data-mobile-view=chat]) .admin-main { display:none !important; }
  .admin-main>.messages { flex:1 1 0; height:auto; min-height:0; }
  .admin-main>.chat-header,.admin-main>.send-form,.admin-main>.draft-panel { flex:0 0 auto; }
  #admin-collapse-chat { display:none; }
  .send-form { padding-bottom:env(safe-area-inset-bottom,0px); }
  .admin-page .msg.admin { background:#493777; }
  .m-login { overflow-y:auto; justify-content:flex-start; padding-top:max(24px,env(safe-area-inset-top)); }
  .m-login-card { margin:auto; flex-shrink:0; }
  .a-screen-login { overflow-y:auto; }
  .a-login-card { flex-shrink:0; }
}
@media(max-width:600px) {
  .pp-header { padding:10px 14px; flex-wrap:wrap; gap:10px; }
  .pp-nav { width:auto; margin-left:auto; justify-content:space-between; gap:4px; }
  .pp-nav a { padding:9px 10px; }
  .pp-logo-text { font-size:19px; }
  .hero { min-height:0; padding:42px 18px; }
  .hero h1 { font-size:34px; line-height:1.12; }
  .hero-cta { width:100%; display:grid; }
  .hero-cta a { width:100%; }
  .shop-page { padding:28px 16px; }
  .shop-grid { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
