*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html, body, #root { height: 100%; }
    body { font-family: 'Inter', sans-serif; background: #F8F9FA; color: #1A1A2E; -webkit-font-smoothing: antialiased; }
    button, input, select, textarea { font-family: inherit; }
    ::-webkit-scrollbar { width: 6px; height: 6px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: #D1D5DB; border-radius: 3px; }
    a { text-decoration: none; }
    input::placeholder, textarea::placeholder { color: #C4C9D1; opacity: 1; }
    .dash-page {
      height: 100%;
      overflow: hidden;
      padding: 20px 24px;
      display: flex;
      flex-direction: column;
      min-width: 0;
    }
    .dash-page-scroll {
      height: 100%;
      overflow: auto;
      padding: 20px 24px;
      min-width: 0;
    }
    .dash-panel {
      background: #fff;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      overflow: hidden;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    }
    .dash-panel-header {
      padding: 14px 16px;
      border-bottom: 1px solid #F3F4F6;
      flex-shrink: 0;
    }
    .dash-page-title {
      font-size: 21px;
      font-weight: 800;
      letter-spacing: 0;
      color: #1A1A2E;
      margin: 0;
    }
    .dash-page-subtitle {
      font-size: 12px;
      color: #6B7280;
      margin-top: 3px;
      line-height: 1.35;
    }
    .dash-attached {
      border-top: none !important;
      border-top-left-radius: 0 !important;
      border-top-right-radius: 0 !important;
    }
    .products-page {
      position: relative;
      background:
        radial-gradient(circle at 18% 8%, rgba(0, 111, 221, 0.12), transparent 28%),
        radial-gradient(circle at 88% 6%, rgba(115, 208, 75, 0.12), transparent 25%),
        linear-gradient(180deg, #F7FBFF 0%, #F8FAFC 48%, #FFFFFF 100%);
      isolation: isolate;
    }
    .products-page::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        linear-gradient(135deg, transparent 0 38%, rgba(0, 111, 221, 0.08) 38% 48%, transparent 48% 100%),
        linear-gradient(153deg, transparent 0 54%, rgba(115, 208, 75, 0.08) 54% 64%, transparent 64% 100%);
      opacity: 0.82;
    }
    .products-panel {
      position: relative;
      z-index: 1;
      border-color: rgba(199, 213, 230, 0.9);
      box-shadow: 0 18px 50px rgba(15, 23, 42, 0.07);
      backdrop-filter: blur(4px);
    }
    .products-panel .dash-panel-header {
      background:
        radial-gradient(circle at 8% 0%, rgba(0, 111, 221, 0.10), transparent 32%),
        radial-gradient(circle at 88% 0%, rgba(115, 208, 75, 0.12), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
    }
    .products-table thead tr {
      background: linear-gradient(90deg, #F8FBFF 0%, #F7FAF6 100%) !important;
    }
    .products-table tbody tr {
      transition: background 120ms ease, box-shadow 120ms ease;
    }
    .products-table tbody tr:hover {
      background: #F8FBFF !important;
      box-shadow: inset 3px 0 0 rgba(0, 111, 221, 0.42);
    }
    .workspace-page {
      position: relative;
      isolation: isolate;
      background:
        radial-gradient(circle at 16% 8%, rgba(0, 111, 221, 0.10), transparent 26%),
        radial-gradient(circle at 86% 10%, rgba(115, 208, 75, 0.10), transparent 23%),
        linear-gradient(180deg, #F7FBFF 0%, #F8FAFC 46%, #FFFFFF 100%);
    }
    .workspace-page::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      opacity: 0.78;
      background:
        linear-gradient(140deg, transparent 0 37%, rgba(0, 111, 221, 0.06) 37% 46%, transparent 46% 100%),
        linear-gradient(156deg, transparent 0 56%, rgba(115, 208, 75, 0.06) 56% 65%, transparent 65% 100%);
    }
    .workspace-page > * {
      position: relative;
      z-index: 1;
    }
    .workspace-panel {
      border-color: rgba(199, 213, 230, 0.92);
      box-shadow: 0 18px 50px rgba(15, 23, 42, 0.06);
      backdrop-filter: blur(4px);
    }
    .workspace-panel .dash-panel-header {
      background:
        radial-gradient(circle at 8% 0%, rgba(0, 111, 221, 0.08), transparent 30%),
        radial-gradient(circle at 88% 0%, rgba(115, 208, 75, 0.10), transparent 26%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
    }
    .workspace-panel-flat {
      border-color: rgba(199, 213, 230, 0.84);
      box-shadow: 0 14px 36px rgba(15, 23, 42, 0.05);
    }
    .workspace-panel-flat .dash-panel-header {
      background:
        radial-gradient(circle at 10% 0%, rgba(0, 111, 221, 0.06), transparent 30%),
        linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%);
    }
    .workspace-table thead tr {
      background: linear-gradient(90deg, #F8FBFF 0%, #F7FAF6 100%) !important;
    }
    .workspace-table thead th {
      background: transparent !important;
    }
    .workspace-table tbody tr {
      transition: background 120ms ease, box-shadow 120ms ease;
    }
    .workspace-table tbody tr:hover {
      background: #F8FBFF !important;
      box-shadow: inset 3px 0 0 rgba(0, 111, 221, 0.32);
    }
    .export-rules-page {
      width: 100%;
      max-width: none;
      min-height: 100%;
    }
    .export-rules-grid {
      display: grid;
      grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
      gap: 14px;
      align-items: start;
    }
    .support-page {
      padding: 0;
      background: transparent;
    }
    .support-workspace {
      height: 100%;
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
      gap: 12px;
      background: transparent;
    }
    .support-ticket-rail {
      min-height: 0;
      display: flex;
      flex-direction: column;
      background: #fff;
      border: 1px solid rgba(199, 213, 230, 0.92);
      border-radius: 10px;
      box-shadow: 0 18px 50px rgba(15, 23, 42, 0.06);
      overflow: hidden;
    }
    .support-chat-panel {
      min-width: 0;
      min-height: 0;
      display: flex;
      flex-direction: column;
      background: #fff;
      border: 1px solid rgba(199, 213, 230, 0.92);
      border-radius: 10px;
      box-shadow: 0 18px 50px rgba(15, 23, 42, 0.06);
      overflow: hidden;
    }
    .orders-table-scroll {
      position: relative;
    }
    .orders-table thead th {
      position: sticky !important;
      top: 0;
      z-index: 30 !important;
      background: #F9FAFB;
    }
    .orders-source-col {
      position: sticky !important;
      left: 0;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-right: 1px solid rgba(148, 163, 184, 0.36);
      box-shadow:
        inset -1px 0 0 rgba(255, 255, 255, 0.68),
        10px 0 18px rgba(15, 23, 42, 0.045);
    }
    .orders-source-col-header {
      z-index: 40 !important;
      background:
        linear-gradient(135deg, rgba(240,249,255,0.96) 0%, rgba(246,253,249,0.94) 100%) !important;
      box-shadow:
        inset 0 -1px 0 #E5E7EB,
        inset -1px 0 0 rgba(255, 255, 255, 0.68),
        10px 0 18px rgba(15, 23, 42, 0.045);
    }
    .orders-source-col-cell {
      z-index: 12 !important;
      background:
        linear-gradient(135deg, rgba(241,250,255,0.78) 0%, rgba(244,253,248,0.76) 100%) !important;
    }
    .orders-table tbody tr:hover .orders-source-col-cell {
      background:
        linear-gradient(135deg, rgba(231,246,255,0.92) 0%, rgba(236,252,244,0.88) 100%) !important;
    }
    @media (max-width: 760px) {
      .dash-page,
      .dash-page-scroll {
        padding: 14px;
      }
      .export-rules-grid {
        grid-template-columns: 1fr;
      }
      .support-page {
        padding: 0;
      }
      .support-workspace {
        grid-template-columns: minmax(220px, 38%) minmax(0, 1fr);
      }
    }
    .settings-shell {
      width: 100%;
    }
    .settings-overview-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      padding: 14px 16px 16px;
    }
    .settings-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 360px;
      gap: 14px;
      align-items: start;
    }
    .settings-stack {
      display: grid;
      gap: 14px;
      min-width: 0;
    }
    .settings-danger-section {
      margin-top: 14px;
    }
    .settings-row {
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr) auto;
      gap: 12px;
      padding: 15px 16px;
      border-top: 1px solid #F3F4F6;
      align-items: center;
    }
    .settings-row:first-child {
      border-top: none;
    }
    .settings-row-main {
      min-width: 0;
    }
    .settings-action {
      display: flex;
      justify-content: flex-end;
      min-width: 0;
    }
    @media (max-width: 980px) {
      .settings-overview-grid,
      .settings-grid {
        grid-template-columns: 1fr;
      }
    }
    @media (max-width: 640px) {
      .settings-overview-grid {
        padding: 12px;
      }
      .settings-row {
        grid-template-columns: 34px minmax(0, 1fr);
      }
      .settings-action {
        grid-column: 2;
        justify-content: flex-start;
        width: 100%;
      }
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    @keyframes logoDropIn {
      0% { opacity: 0; transform: translateY(-12px) scale(0.92); }
      58% { opacity: 1; transform: translateY(3px) scale(1.03); }
      100% { opacity: 1; transform: translateY(0) scale(1); }
    }
    @keyframes logoPulse {
      0%, 100% { transform: scale(0.98); filter: drop-shadow(0 12px 20px rgba(0, 111, 221, 0.12)); }
      42% { transform: scale(1.07); filter: drop-shadow(0 20px 28px rgba(115, 208, 75, 0.22)); }
      72% { transform: scale(1); filter: drop-shadow(0 15px 22px rgba(0, 111, 221, 0.14)); }
    }
    @keyframes loadingDot {
      0%, 80%, 100% { opacity: 0.32; transform: translateY(0); }
      40% { opacity: 1; transform: translateY(-3px); }
    }
    @keyframes livePulse {
      0% { box-shadow: 0 0 0 0 rgba(115, 208, 75, 0.38); }
      70% { box-shadow: 0 0 0 8px rgba(115, 208, 75, 0); }
      100% { box-shadow: 0 0 0 0 rgba(115, 208, 75, 0); }
    }
    .live-feed-dot {
      width: 8px;
      height: 8px;
      flex: 0 0 8px;
      border-radius: 50%;
      background: #16A34A;
      box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.38);
      animation: livePulse 1.35s ease-out infinite;
    }
    @keyframes orderGlow {
      0% { background: #F0FBE8; }
      100% { background: #fff; }
    }
    .skeleton-pill {
      background: linear-gradient(90deg, #E5E7EB 0%, #F3F4F6 44%, #E5E7EB 88%);
      background-size: 220% 100%;
      animation: skeletonShimmer 1.25s ease-in-out infinite;
    }
    @keyframes skeletonShimmer {
      0% { background-position: 120% 0; }
      100% { background-position: -120% 0; }
    }
    @media (prefers-reduced-motion: reduce) {
      .dashboard-loader-logo,
      .dashboard-loader-mark,
      .dashboard-loader-dot,
      .live-feed-dot,
      .skeleton-pill { animation: none !important; }
    }
    .subscription-signout {
      color: #6B7280;
      transition: color 140ms ease;
    }
    .subscription-signout:hover {
      color: #1A1A2E;
    }
    .subscription-signout svg {
      transform: translateY(-1px);
      transition: color 140ms ease;
    }
    @keyframes confettiFall {
      0% { opacity: 0; transform: translate3d(var(--x-start), -28px, 0) rotate(0deg); }
      12% { opacity: 1; }
      100% { opacity: 0; transform: translate3d(var(--x-end), 330px, 0) rotate(var(--spin)); }
    }
    @keyframes modalRise {
      0% { opacity: 0; transform: translate(-50%, calc(-50% + 14px)) scale(0.98); }
      100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    }
    .home-brush-layer {
      position: absolute;
      inset: -70px -110px -130px -110px;
      width: calc(100% + 220px);
      height: calc(100% + 200px);
      pointer-events: none;
      z-index: 0;
      opacity: 0.9;
    }
    .home-brush-stripe {
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 58;
      filter: blur(0.2px);
      animation: homeBrushFloat 9s ease-in-out infinite;
    }
    .home-brush-stripe-blue {
      stroke: rgba(0, 111, 221, 0.105);
    }
    .home-brush-stripe-green {
      stroke: rgba(115, 208, 75, 0.115);
    }
    .home-brush-stripe-a {
      stroke-width: 62;
      animation-duration: 10.5s;
    }
    .home-brush-stripe-b {
      stroke-width: 70;
      animation-duration: 12s;
      animation-delay: -3s;
    }
    .home-brush-stripe-c {
      stroke-width: 52;
      animation-duration: 9.5s;
      animation-delay: -5s;
    }
    @keyframes homeBrushFloat {
      0%, 100% { transform: translate3d(-10px, -4px, 0) rotate(-0.35deg); }
      45% { transform: translate3d(18px, 9px, 0) rotate(0.45deg); }
      72% { transform: translate3d(4px, -10px, 0) rotate(0.1deg); }
    }
    @media (prefers-reduced-motion: reduce) {
      .checkout-confetti-piece,
      .checkout-tutorial-modal,
      .home-brush-stripe { animation: none !important; }
    }