:root{color-scheme:dark;--bg:var(--gh-background);--panel:var(--gh-surface);--panel2:var(--gh-soft);--line:var(--gh-line);--text:var(--gh-ink);--muted:var(--gh-muted);--accent:var(--gh-brand);--danger:var(--gh-danger);--ok:var(--gh-brand);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% -10%,var(--gh-soft) 0,transparent 34%),var(--bg);color:var(--text);min-height:100vh}.hidden,#app.hidden,#app.hidden *,.shell.hidden,.shell.hidden *{display:none!important}.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{border-right:1px solid var(--line);padding:24px 18px;display:flex;flex-direction:column;gap:26px;background:rgba(8,12,24,.78);backdrop-filter:blur(18px);position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#42c6ff);font-weight:900}.brand strong,.brand small,.sidebar-foot span,.sidebar-foot small{display:block}.brand small,.sidebar-foot small{color:var(--muted);margin-top:3px}.sidebar nav{display:grid;gap:6px}.nav{border:0;background:transparent;color:var(--muted);padding:12px 14px;text-align:left;border-radius:11px;font-weight:700;cursor:pointer}.nav.active,.nav:hover{background:var(--panel2);color:var(--text)}.sidebar-foot{margin-top:auto;padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}main{padding:28px 34px;max-width:1440px;width:100%;margin:0 auto}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}h1,h2,h3,p{margin-top:0}h1{font-size:30px;margin-bottom:0}.eyebrow{color:var(--gh-brand);letter-spacing:.14em;font-weight:800}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:20px}.metric,.panel,.item{border:1px solid var(--line);background:linear-gradient(180deg,rgba(21,31,52,.94),rgba(13,20,35,.94));border-radius:16px}.metric{padding:18px}.metric strong{display:block;font-size:28px;margin-top:9px}.metric span,.muted{color:var(--muted)}.panel{padding:20px}.panel-head,.item-head,.item-row{display:flex;align-items:center;justify-content:space-between;gap:14px}.toolbar{display:grid;grid-template-columns:minmax(180px,1fr) 190px auto;gap:10px;margin-bottom:14px}.stack{display:grid;gap:10px}.item{padding:16px}.item h3{margin-bottom:5px}.item-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:13px}.chip{border:1px solid var(--line);border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800}.chip.ok{color:var(--ok)}.chip.danger{color:var(--danger)}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--gh-soft);color:var(--text);padding:11px 12px;font:inherit}button{font:inherit}.primary,.ghost,.icon{border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer}.primary{background:var(--accent);color:white;border:0}.ghost,.icon{background:transparent;color:var(--text);border:1px solid var(--line)}.ghost.active{background:var(--panel2);border-color:var(--accent);color:var(--text)}.icon{padding:5px 10px;font-size:20px}dialog{width:min(620px,calc(100vw - 24px));border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);padding:0}dialog::backdrop{background:rgba(2,5,12,.72);backdrop-filter:blur(5px)}form{padding:22px}.dialog-head,.dialog-actions{display:flex;justify-content:space-between;align-items:center;gap:12px}.dialog-actions{justify-content:flex-end;margin-top:18px}label{display:grid;gap:7px;margin:13px 0;color:var(--muted);font-size:13px;font-weight:700}.check{display:flex;align-items:center}.check input{width:auto}.grid2,.grid3{display:grid;gap:10px}.grid2{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr 100px 100px}.fatal{margin:32px auto;max-width:680px;padding:22px;border:1px solid #65313b;background:#25131a;border-radius:16px;color:#ffd2d8}.empty{padding:36px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:16px}.view{display:none}.view.active{display:block}@media(max-width:820px){.shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:14px}.sidebar nav{grid-template-columns:repeat(4,1fr);overflow:auto}.nav{text-align:center;padding:9px 7px;font-size:12px}.sidebar-foot{display:none}main{padding:20px 14px}.metric-grid{grid-template-columns:repeat(2,1fr)}.toolbar{grid-template-columns:1fr}.grid2,.grid3{grid-template-columns:1fr}.item-row{align-items:flex-start;flex-direction:column}}
.operation-note{margin-bottom:14px}.operation-stack{margin-top:14px}.ops-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.compact{margin:8px 0 0;max-width:820px}.ok-text{color:var(--ok)}.danger-text{color:var(--danger)}button:disabled{opacity:.42;cursor:not-allowed}@media(max-width:820px){.sidebar nav{grid-template-columns:repeat(5,minmax(90px,1fr))}.ops-actions{justify-content:flex-start}}
.provider-toolbar{grid-template-columns:1fr auto auto auto}.provider-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 24px}.mapping-head{margin:8px 0 12px}@media(max-width:980px){.provider-grid{grid-template-columns:1fr}.provider-toolbar{grid-template-columns:1fr 1fr}}@media(max-width:820px){.sidebar nav{grid-template-columns:repeat(7,minmax(90px,1fr))}.provider-toolbar{grid-template-columns:1fr}}
.analytics-toolbar{grid-template-columns:190px 1fr}.analytics-currency-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:24px}.analytics-currency h3{margin:0}.finance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}.finance-grid div{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--gh-soft)}.finance-grid small,.finance-grid strong{display:block}.finance-grid small{color:var(--muted);margin-bottom:6px}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.compact-stack{max-height:560px;overflow:auto;padding-right:4px}.compact-item{padding:12px}.audit-toolbar{grid-template-columns:1.4fr 1fr 1fr}.audit-details{white-space:pre-wrap;word-break:break-word;margin:10px 0 0;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--gh-soft);color:var(--muted);font-size:12px;max-width:900px;max-height:220px;overflow:auto}@media(max-width:980px){.analytics-grid,.analytics-currency-grid{grid-template-columns:1fr}.finance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:820px){.sidebar nav{grid-template-columns:repeat(9,minmax(90px,1fr))}.analytics-toolbar,.audit-toolbar,.finance-grid{grid-template-columns:1fr}}
.audit-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.wizard-dialog{width:min(760px,calc(100vw - 24px))}.wizard-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.wizard-steps span{padding:9px 10px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:12px;font-weight:800;text-align:center}.wizard-steps span.active{border-color:var(--accent);color:var(--text);background:color-mix(in srgb,var(--accent) 14%,transparent)}.template-preview,.brand-preview{border:1px solid var(--line);border-radius:14px;background:var(--gh-soft);padding:15px}.template-preview strong,.template-preview span{display:block}.template-preview span{color:var(--muted);margin-top:6px}.module-picker{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:13px 0}.module-picker legend{color:var(--muted);font-size:12px;font-weight:800;padding:0 5px}.module-picker .check{display:inline-flex;margin-right:18px}.brand-preview{display:flex;align-items:center;gap:12px;margin-top:16px}.brand-preview-mark{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-weight:900;background:var(--accent);background-position:center;background-size:cover}.brand-preview strong,.brand-preview span{display:block}.brand-preview span{color:var(--muted);margin-top:4px;font-size:12px}.wizard-spacer{flex:1}@media(max-width:820px){.wizard-steps{grid-template-columns:1fr}.module-picker .check{display:flex;margin-right:0}}

.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px}.choice-card{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--border,var(--gh-line));border-radius:12px;padding:11px;background:rgba(255,255,255,.02)}.choice-card input{width:auto;margin-top:3px}.choice-card small{display:block;margin-top:3px}.wizard-steps{grid-template-columns:repeat(5,minmax(0,1fr))}@media(max-width:820px){.wizard-steps{grid-template-columns:1fr 1fr}}

.login-card{width:min(560px,calc(100% - 32px));margin:clamp(24px,8vh,80px) auto;padding:28px}.login-card .brand-mark{margin-bottom:20px}.login-card h1{margin-bottom:16px}.login-card p{line-height:1.6}.login-card form{padding:0}.login-card a{color:var(--gh-brand);text-underline-offset:3px}.login-card button{width:100%;min-height:44px}.login-card input{min-height:44px}.login-card :focus-visible{outline:3px solid var(--gh-brand);outline-offset:3px}.sidebar-foot button{margin-top:12px}
.chip-accent{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.chip-ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,transparent);background:color-mix(in srgb,var(--ok) 12%,transparent)}
.chip-warn{color:#f59e0b;border-color:rgba(245,158,11,0.4);background:rgba(245,158,11,0.12)}
.chip-danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 40%,transparent);background:color-mix(in srgb,var(--danger) 12%,transparent)}
.chip-muted{color:var(--muted);border-color:var(--line);background:var(--panel2)}
.header-actions{display:flex;align-items:center;gap:8px}

.template-step-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.help-btn {
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  transition: background 0.15s ease, border-color 0.15s ease;
}

.help-btn:hover {
  background: color-mix(in srgb, var(--accent) 24%, transparent);
  border-color: var(--accent);
}

.help-drawer {
  width: min(980px, calc(100vw - 28px));
  max-height: min(90vh, 960px);
  overflow-y: auto;
  padding: 24px;
}

.guidance-toolbar {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 16px 0 20px;
}

.guidance-filters {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.guidance-filters .chip {
  cursor: pointer;
  background: var(--panel2);
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 999px;
  transition: all 0.15s ease;
}

.guidance-filters .chip.active,
.guidance-filters .chip:hover {
  color: var(--text);
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 16%, transparent);
}

.guidance-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.guidance-card {
  background: var(--gh-soft);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: border-color 0.2s ease, transform 0.15s ease;
}

.guidance-card:hover {
  border-color: color-mix(in srgb, var(--accent) 50%, var(--line));
}

.guidance-card.current {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}

.guidance-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.guidance-card-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
}

.guidance-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 12px;
}

.badge-source {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--gh-soft);
  color: var(--gh-brand);
  border: 1px solid var(--gh-line);
}

.badge-complexity {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
}

.badge-complexity.low {
  background: rgba(85, 211, 159, 0.12);
  color: var(--ok);
  border: 1px solid rgba(85, 211, 159, 0.3);
}

.badge-complexity.medium {
  background: rgba(245, 158, 11, 0.12);
  color: #f59e0b;
  border: 1px solid rgba(245, 158, 11, 0.3);
}

.badge-complexity.high {
  background: rgba(255, 109, 124, 0.12);
  color: var(--danger);
  border: 1px solid rgba(255, 109, 124, 0.3);
}

.guidance-detail {
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
  margin-bottom: 8px;
}

.guidance-detail strong {
  color: var(--text);
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 8px;
  margin-bottom: 2px;
}

.guidance-detail ul {
  margin: 4px 0 8px 18px;
  padding: 0;
}

.guidance-detail li {
  margin-bottom: 3px;
}

.guidance-card-actions {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--gh-soft);
}

.guidance-card-actions button {
  width: 100%;
}

@media (max-width: 820px) {
  .help-drawer {
    width: calc(100vw - 16px) !important;
    padding: 16px !important;
    max-height: 94vh !important;
  }
  .guidance-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile Top Bar & Navigation Elements - Hidden on Desktop */
.mobile-topbar,
.mobile-quicknav,
.mobile-drawer-backdrop {
  display: none;
}

/* Mobile Responsive Enhancements */
@media (max-width: 820px) {
  .hidden,
  #app.hidden,
  #app.hidden *,
  .shell.hidden,
  .shell.hidden * {
    display: none !important;
  }

  .shell:not(.hidden) {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Mobile Top Bar */
  .mobile-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: env(safe-area-inset-top, 0) 14px 0 14px !important;
    background: rgba(14, 20, 36, 0.94) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid var(--line) !important;
    z-index: 1000 !important;
    box-sizing: border-box !important;
  }

  .mobile-topbar-left {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    flex: 1 !important;
  }

  .mobile-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    background: var(--panel2) !important;
    border: 1px solid var(--line) !important;
    border-radius: 10px !important;
    color: var(--text) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
  }
  .mobile-menu-toggle:active {
    background: var(--line) !important;
    transform: scale(0.96) !important;
  }

  .mobile-brand {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
  }

  .mobile-brand .brand-mark {
    width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }

  .mobile-titles {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
  }

  .mobile-titles strong {
    font-size: 14px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: var(--text) !important;
    line-height: 1.2 !important;
  }

  .mobile-page-badge {
    font-size: 11px !important;
    color: var(--accent) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
  }

  .mobile-topbar-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
  }

  .mobile-topbar-actions .icon-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 9px !important;
    background: var(--panel2) !important;
    border: 1px solid var(--line) !important;
    color: var(--text) !important;
    cursor: pointer !important;
  }
  .mobile-topbar-actions .icon-btn:active {
    transform: scale(0.96) !important;
  }

  .mobile-exit-btn {
    min-height: 38px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    border-radius: 9px !important;
    background: rgba(255, 109, 124, 0.1) !important;
    border: 1px solid rgba(255, 109, 124, 0.3) !important;
    color: var(--danger) !important;
    cursor: pointer !important;
  }

  /* Quick-Nav Scroll Strip */
  .mobile-quicknav {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    position: sticky !important;
    top: 56px !important;
    left: 0 !important;
    right: 0 !important;
    padding: 8px 12px !important;
    background: rgba(12, 17, 32, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid var(--line) !important;
    z-index: 990 !important;
    box-sizing: border-box !important;
  }
  .mobile-quicknav::-webkit-scrollbar {
    display: none !important;
  }

  .quicknav-pill {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 999px !important;
    background: var(--panel2) !important;
    border: 1px solid var(--line) !important;
    color: var(--muted) !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
  }
  .quicknav-pill.active {
    background: var(--accent) !important;
    color: #ffffff !important;
    border-color: var(--accent) !important;
    box-shadow: 0 2px 8px color-mix(in srgb, var(--accent) 40%, transparent) !important;
  }
  .quicknav-more {
    color: var(--accent) !important;
    border-color: color-mix(in srgb, var(--accent) 35%, transparent) !important;
    background: color-mix(in srgb, var(--accent) 8%, transparent) !important;
  }

  /* Drawer Backdrop */
  .mobile-drawer-backdrop {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(4, 6, 14, 0.7) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    z-index: 1050 !important;
    transition: opacity 0.25s ease !important;
  }
  .mobile-drawer-backdrop.hidden {
    display: none !important;
  }

  /* Off-Canvas Drawer Sidebar on Mobile */
  .sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: min(320px, 86vw) !important;
    height: 100vh !important;
    height: 100dvh !important;
    background: var(--panel) !important;
    border-right: 1px solid var(--line) !important;
    border-bottom: 0 !important;
    padding: 20px 16px !important;
    z-index: 1100 !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    box-shadow: 8px 0 32px rgba(0, 0, 0, 0.5) !important;
    transform: translateX(-100%) !important;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
  }

  .sidebar.mobile-open {
    transform: translateX(0) !important;
  }

  .sidebar .brand {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid var(--line) !important;
  }

  .sidebar nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    flex: 1 !important;
    overflow-y: auto !important;
    width: 100% !important;
  }

  .sidebar nav .nav-heading {
    display: block !important;
    padding: 12px 10px 4px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .sidebar .nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--text) !important;
    width: 100% !important;
  }
  .sidebar .nav:active {
    background: var(--panel2) !important;
  }
  .sidebar .nav.active {
    background: color-mix(in srgb, var(--accent) 15%, transparent) !important;
    border-color: color-mix(in srgb, var(--accent) 40%, transparent) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
  }

  .sidebar-foot {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding-top: 14px !important;
    border-top: 1px solid var(--line) !important;
  }

  /* Clean main content header on mobile */
  main header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 14px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid var(--line) !important;
  }
  main header .eyebrow {
    display: none !important;
  }
  main header h1 {
    font-size: 20px !important;
    margin: 0 !important;
  }
  main header .header-actions {
    display: none !important;
  }

  main {
    display: block !important;
    padding: 14px 12px 28px !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Toolbars stack vertically on mobile */
  .toolbar,
  .provider-toolbar,
  .analytics-toolbar,
  .audit-toolbar {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-bottom: 14px !important;
  }

  .toolbar input,
  .toolbar select,
  .toolbar button,
  .provider-toolbar input,
  .provider-toolbar select,
  .provider-toolbar button,
  .analytics-toolbar input,
  .analytics-toolbar select,
  .analytics-toolbar button,
  .audit-toolbar input,
  .audit-toolbar select,
  .audit-toolbar button {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Metrics and financial grids */
  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
  }

  .metric {
    padding: 12px 10px !important;
    border-radius: 12px !important;
  }

  .metric strong {
    font-size: 20px !important;
    margin-top: 4px !important;
    word-break: break-word !important;
  }

  .metric span {
    font-size: 12px !important;
  }

  .provider-grid,
  .analytics-grid,
  .analytics-currency-grid,
  .finance-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Panels and items */
  .panel {
    padding: 14px 12px !important;
    border-radius: 14px !important;
  }

  .item {
    padding: 12px 10px !important;
    border-radius: 12px !important;
  }

  .panel-head,
  .item-head {
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: flex-start !important;
  }

  .item-row {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .item-meta {
    gap: 6px 10px !important;
    font-size: 12px !important;
    word-break: break-word !important;
  }

  .ops-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
    justify-content: flex-start !important;
  }

  .ops-actions button {
    flex: 1 1 auto !important;
    text-align: center !important;
    justify-content: center !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
  }

  /* Modals / Dialogs */
  dialog {
    width: min(94vw, 560px) !important;
    max-height: 90vh !important;
    border-radius: 16px !important;
    margin: auto !important;
  }

  form {
    padding: 16px 14px !important;
  }

  .grid2,
  .grid3 {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .dialog-actions {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .dialog-actions button {
    width: 100% !important;
  }

  /* Inputs & iOS Safari 16px zoom prevention */
  input,
  select,
  textarea {
    font-size: 16px !important;
    min-height: 42px !important;
  }

  /* Login card */
  .login-card {
    width: min(560px, calc(100% - 24px)) !important;
    margin: 24px auto !important;
    padding: 20px 16px !important;
  }

  .audit-details {
    max-width: 100% !important;
    font-size: 11px !important;
    padding: 8px !important;
  }
}


/* Task-oriented navigation and setup layout. */
.sidebar { overflow-y:auto; }
.nav-heading { color:var(--muted); padding:12px 14px 4px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.nav-more summary { padding:14px; color:var(--muted); cursor:pointer; }
.nav-more .nav { display:block; width:100%; }
.home-actions { justify-content:flex-start; }
.wizard-dialog form { padding:24px; }
.wizard-step { min-height:180px; }
.wizard-step h3 { margin:20px 0 8px; }
.wizard-actions { position:static; background:var(--panel); padding:16px 0 0; border-top:1px solid var(--line); flex-wrap:wrap; }
.wizard-dialog label { line-height:1.5; }
.wizard-dialog button,.wizard-dialog select,.wizard-dialog input:not([type=checkbox]) { min-height:44px; }
.wizard-dialog a { color:var(--gh-brand); }
.wizard-dialog fieldset { border:1px solid var(--line); border-radius:12px; margin:16px 0; }
.wizard-dialog .setup-details .template-preview { border:0; padding:0; background:none; }
#homePreviewDialog { width:min(640px,calc(100vw - 24px)); padding:24px; }
@media(max-width:820px) {
  .wizard-dialog form { padding:16px; }
  .wizard-actions { gap:8px; }
  .wizard-actions button { width:auto!important; flex:1 1 auto; }
  .wizard-actions .wizard-spacer { display:none; }
  main { min-width:0; }
}

.tenant-theme-preview { background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:24px; padding:24px; margin:12px 0 24px; }
.tenant-theme-preview p,.tenant-theme-preview small { color:var(--muted); }
.theme-preview-top,.theme-preview-action { display:flex; justify-content:space-between; gap:12px; }
.theme-preview-top span { color:var(--accent); }
.theme-preview-products { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0; }
.theme-preview-products article { background:var(--surface); border-radius:16px; padding:16px; display:grid; gap:8px; }
.theme-preview-products article div { background:var(--surface-2); color:var(--accent); border-radius:12px; padding:20px; font-size:30px; text-align:center; }
.theme-preview-action { background:var(--accent); color:var(--accent-text); border-radius:14px; padding:14px; margin-bottom:14px; font-weight:700; }

.maintenance-body { white-space:pre-wrap; overflow-wrap:anywhere; }
.maintenance-reference { overflow-wrap:anywhere; font:12px monospace; }

.settings-layout { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr); gap:24px; align-items:start; }
.settings-layout .panel { margin-bottom:18px; }
.settings-link { display:flex; width:100%; justify-content:space-between; gap:16px; text-align:start; padding:14px 0; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); font:inherit; cursor:pointer; }
.settings-link:hover { color:var(--accent); }
.settings-faq { border-top:1px solid var(--line); padding:14px 0; }
.settings-save { position:sticky; bottom:12px; background:var(--surface); border:1px solid var(--line); padding:14px; border-radius:16px; display:flex; gap:14px; align-items:center; z-index:2; }
.delivery-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px; margin-top:20px; }
.delivery-card { text-align:start; border:1px solid var(--line); background:var(--surface); padding:24px; border-radius:20px; color:var(--ink); cursor:pointer; transition:transform .2s ease; }
.delivery-card:hover { transform:translateY(-3px); border-color:var(--accent); }
.delivery-card strong { display:block; margin-top:24px; color:var(--accent); }
.delivery-fieldset { border:0; padding:0; margin:0; min-width:0; }
.delivery-checks { list-style:none; padding:0; display:grid; gap:12px; }
.delivery-checks li { display:flex; gap:10px; }
.delivery-checks span { color:var(--accent); }
.delivery-scope { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; }
progress { width:100%; accent-color:var(--accent); }
@media(max-width:900px){.settings-layout{grid-template-columns:1fr;}.settings-save{position:static;}}
@media(prefers-reduced-motion:reduce){.delivery-card{transition:none;}}