:root{
  --font-sans:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --bg:#0b1220;
  --sidebar-width:200px;
  --sidebar-width-collapsed:76px;
  --sidebar:#5d705d;
  --sidebar2:#4A594A;
  --sidebarText:#eef2ff;
  --sidebarMuted:rgba(238,242,255,.72);
  --panel:#ffffff;
  --muted:#6b7280;
  --text:#0f172a;
  --border:rgba(2,6,23,.10);
  --brand:#5d705d;
  --brand2:#007634;
  --danger:#b91c1c;
  --ring:0 0 0 4px rgba(37,99,235,.16);
  --shadow-sm:0 6px 18px rgba(2,6,23,.08);
  --shadow-md:0 18px 45px rgba(2,6,23,.12);
  --radius:16px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--bg);
}

/* Auth pages */
.auth-page{
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:
    radial-gradient(1200px 700px at 20% -10%, rgba(245, 84, 38,.18), rgba(11,18,32,0) 60%),
    radial-gradient(900px 550px at 95% 10%, rgba(239,108,0,.22), rgba(11,18,32,0) 55%),
    var(--bg);
}
.auth-card{
  width:100%;
  max-width:420px;
}
.auth-brand{
  font-weight:950;
  font-size:18px;
  letter-spacing:-.02em;
  color:#0b1220;
}
.auth-sub{
  margin-top:6px;
  color:#64748b;
  font-size:13px;
}
.auth-form{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.auth-card .field input{min-width:auto;width:100%}

button, input, select, textarea {
  font-family:inherit;
  color:inherit;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%3E%3Cpath%20fill%3D%22%236b7280%22%20d%3D%22M6.70710678,7.70710678 C6.31658249,8.09763107 5.68341751,8.09763107 5.29289322,7.70710678 L0.292893219,2.70710678 C-0.0976310709,2.31658249 -0.0976310709,1.68341751 0.292893219,1.29289322 C0.68341751,0.902368933 1.31658249,0.902368933 1.70710678,1.29289322 L6,5.58578644 L10.2928932,1.29289322 C10.6834175,0.902368933 11.3165825,0.902368933 11.7071068,1.29289322 C12.0976311,1.68341751 12.0976311,2.31658249 11.7071068,2.70710678 L6.70710678,7.70710678 Z%22/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px 8px;
  padding:5px 12px;
  padding-right: 32px;
  height:36px;
  border:1px solid rgba(2,6,23,.12);
  border-radius:14px;
  font-size:14px;
  background-color:#fff;
}

.app{display:flex;min-height:100vh;min-width:0}

.hidden{display:none !important}

.sidebar{
  width:var(--sidebar-width);
  flex:0 0 var(--sidebar-width);
  min-width:var(--sidebar-width);
  max-width:var(--sidebar-width);
  padding:18px 14px;
  background:linear-gradient(180deg, var(--sidebar), var(--sidebar2));
  color:var(--sidebarText);
  border-right:1px solid rgba(255,255,255,.08);
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
  overflow:auto;
}

.sidebar-brand{font-weight:900;letter-spacing:.2px;font-size:15px;line-height:1.1;display:flex;align-items:center;gap:10px;min-width:0}
.sidebar-brand-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:10px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18)}
.sidebar-brand-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-toggle{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
  color:var(--sidebarText);
  width:38px;
  height:38px;
  border-radius:12px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.sidebar-toggle:hover{background:rgba(255,255,255,.12)}
.sidebar-toggle:focus{outline:none;box-shadow:0 0 0 4px rgba(255,255,255,.16)}
.sidebar-sub{margin-top:8px;color:rgba(238,242,255,.72);font-size:12px}
.sidebar-top{display:flex;justify-content: space-between;align-items:end;gap:10px;}

.nav{margin-top:16px;display:flex;flex-direction:column;gap:8px}

.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:32px}
.sidebar-footer a{color:var(--sidebarText);text-decoration:none;opacity:.85;font-size:13px}
.sidebar-footer a:hover{opacity:1;text-decoration:underline}

.main{
  flex:1;
  min-width:0;
  background:radial-gradient(1000px 500px at 90% -20%, rgba(245, 84, 38,.18), rgba(246,247,251,0) 62%),
    radial-gradient(1000px 500px at 10% 0%, rgba(245, 84, 38,.10), rgba(246,247,251,0) 55%),
    #f6f7fb;
  padding:22px;
}

.header{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px}
.header-title{font-size:22px;font-weight:900;color:#0b1220;letter-spacing:-.02em;margin:0;}
.header-sub{color:#64748b;font-size:13px;margin-top:4px}
.header-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.demo-map{width:100%;height:70dvh;border-radius:var(--radius);overflow:hidden;z-index:1;}
.panel.pad{padding-left:14px;padding-right:14px;height:fit-content;}
.pad{padding-top:14px;padding-bottom:14px}

.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:12px;color:#334155;font-weight:650}
.field input:not([type="checkbox"]):not([type="radio"]),.field select,.field textarea{
  min-width:180px;
  padding-top:10px;
  padding-bottom: 10px;
  border:1px solid rgba(2,6,23,.12);
  border-radius:14px;
  font-size:14px;
  background-color:#fff;
}
.field input:not([type="checkbox"]):not([type="radio"]),.field select{height:41px}
.field input:not([type="checkbox"]):not([type="radio"]) {
  padding-left: 12px;
  padding-right: 12px;
}
.field textarea{width:100%;padding-left:12px;padding-right:12px;resize:vertical}
.flatpickr-input {
  width: 180px;
  background-color: #fff;
  text-overflow: ellipsis;
  background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%3E%3Cpath%20fill%3D%22%236b7280%22%20d%3D%22M6.70710678,7.70710678 C6.31658249,8.09763107 5.68341751,8.09763107 5.29289322,7.70710678 L0.292893219,2.70710678 C-0.0976310709,2.31658249 -0.0976310709,1.68341751 0.292893219,1.29289322 C0.68341751,0.902368933 1.31658249,0.902368933 1.70710678,1.29289322 L6,5.58578644 L10.2928932,1.29289322 C10.6834175,0.902368933 11.3165825,0.902368933 11.7071068,1.29289322 C12.0976311,1.68341751 12.0976311,2.31658249 11.7071068,2.70710678 L6.70710678,7.70710678 Z%22/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:12px 8px;
}

.controls .field.half {
  width: calc(50% - 5px);
}

.controls .field.third {
  width: calc(33.333% - 6.66px);
}

.controls .field input:not([type="checkbox"]):not([type="radio"]) {
  width: 100%;
}

.controls .field-flexbox {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

/* Flatpickr shortcuts (calendar footer) */
.fp-shortcuts{
  border-top:1px solid rgba(2,6,23,.10);
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.fp-shortcuts-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
.fp-shortcuts-saved, .fp-shortcuts-save {
  padding-top: 8px;
  border-top: 1px solid rgba(2,6,23,.10);
}
.fp-shortcuts-btn{
  border:1px solid rgba(2,6,23,.14);
  background:#fff;
  color:#0f172a;
  font-size:12px;
  font-weight:700;
  padding:6px 10px;
  border-radius:999px;
  cursor:pointer;
}
.fp-shortcuts-btn.is-active{
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  border-color:rgba(93,112,93,.35);
  color:#fff;
}
.fp-shortcuts-btn.is-active:hover{
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  filter:brightness(0.95);
}
.fp-shortcuts-btn:hover{background:rgba(2,6,23,.04)}
.fp-shortcuts-btn:focus{outline:none;box-shadow:var(--ring);border-color:rgba(37,99,235,.35)}
.fp-shortcuts-saved .fp-shortcuts-btn{font-weight:650;opacity:.92;width:calc(50% - 3px);flex:0 0 calc(50% - 3px)}

.fp-shortcuts-save .fp-shortcuts-btn-save{
  width:100%;
  flex:1 0 100%;
  border-radius:10px;
  padding:8px 10px;
  text-align:center;
  background:rgba(2,6,23,.03);
}
.fp-shortcuts-save .fp-shortcuts-btn-save:hover{background:rgba(2,6,23,.06)}

.field input:focus,.field select:focus{outline:none;box-shadow:var(--ring);border-color:rgba(37,99,235,.45)}
.field .multi-select{position:relative;min-width:180px}
.field .multi-select-btn{
  width:100%;
  min-width:180px;
  padding:10px 32px 10px 12px;
  border:1px solid rgba(2,6,23,.12);
  border-radius:14px;
  font-size:14px;
  background-color:#fff;
  height:41px;
  cursor:pointer;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%3E%3Cpath%20fill%3D%22%236b7280%22%20d%3D%22M6.70710678,7.70710678 C6.31658249,8.09763107 5.68341751,8.09763107 5.29289322,7.70710678 L0.292893219,2.70710678 C-0.0976310709,2.31658249 -0.0976310709,1.68341751 0.292893219,1.29289322 C0.68341751,0.902368933 1.31658249,0.902368933 1.70710678,1.29289322 L6,5.58578644 L10.2928932,1.29289322 C10.6834175,0.902368933 11.3165825,0.902368933 11.7071068,1.29289322 C12.0976311,1.68341751 12.0976311,2.31658249 11.7071068,2.70710678 L6.70710678,7.70710678 Z%22/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:12px 8px;
}
.field .multi-select-btn:focus{outline:none;box-shadow:var(--ring);border-color:rgba(37,99,235,.45)}
.field .multi-select-btn:disabled{opacity:.6;cursor:not-allowed}
.field .multi-select-menu{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  width:min(240px, calc(100vw - 40px));
  max-height:320px;
  overflow:auto;
  background:#fff;
  border:1px solid rgba(2,6,23,.12);
  border-radius:14px;
  box-shadow:var(--shadow-md);
  padding:8px;
  z-index:50;
}
.field .multi-select-menu .ms-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
  user-select:none;
}
.field .multi-select-menu .ms-row:hover{background:rgba(2,6,23,.04)}
.field .multi-select-menu input[type="checkbox"]{width:16px !important;height:16px !important;min-width:16px !important;}
.field .multi-select-menu .ms-title{font-weight:650;color:#0f172a}
.field .multi-select-menu .ms-sub{color:#64748b;font-size:12px}
.field .multi-select-menu .ms-divider{height:1px;background:rgba(2,6,23,.08);margin:6px 8px}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{
  padding:10px 14px;border:0;border-radius:12px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(37,99,235,.18);
  height:41px;
}
.btn.secondary{background:#0f172a;box-shadow:0 10px 22px rgba(2,6,23,.12)}
.btn.danger{background:linear-gradient(135deg,#dc2626,#b91c1c);box-shadow:0 10px 22px rgba(185,28,28,.18)}
.btn:hover{filter:brightness(1.02)}
.btn:disabled{opacity:.6;cursor:not-allowed}

.header-actions .btn {
    position:relative;
    overflow:hidden;
}

.header-actions .btn::after {
    content: '';
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(255,255,255,.2);
    transform: skewX(-20deg)
}

.header-actions .btn:hover::after {
    animation-name: flash;
    animation-duration: .7s
}

@keyframes flash {
    0% {
        width: 0;
        left: -50%;
        opacity: 0
    }

    50% {
        opacity: 1
    }

    70% {
        width: 100%
    }

    100% {
        left: 150%;
        width: 0;
        opacity: 0
    }
}

.meta{margin-top:10px;color:var(--muted);font-size:13px}
.meta:empty{display:none}
.banner{margin-top:10px;padding:10px 12px;border-radius:12px;font-size:13px}
.banner.error{background:#fef2f2;border:1px solid #fecaca;color:var(--danger)}
.banner.ok{background:#ecfeff;border:1px solid #a5f3fc;color:#0e7490}

.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{padding:14px;border-radius:var(--radius);border:1px solid var(--border);background:#fff;box-shadow:var(--shadow-sm)}
.card .k{color:var(--muted);font-size:12px}
.card .v{font-size:30px;font-weight:900;margin-top:6px;letter-spacing:-.02em}
.card .delta{font-size:13px;font-weight:800;margin-top:8px}
.card .delta.up{color:#16a34a}
.card .delta.down{color:#dc2626}
.card .delta.flat{color:#64748b}
.card .sub{color:var(--muted);font-size:12px;margin-top:4px}

.flex-auto-box {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.flex-auto-box > * {
  flex: auto;
}

.section{margin-top:18px}
.section h2{margin:0 0 10px 0;font-size:16px}

.table{width:100%;border-collapse:collapse}
.table th,.table td{border-top:1px solid var(--border);padding:10px;text-align:left;font-size:13px;vertical-align:top}
.table th{color:#475569;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.table tbody tr:hover{background:rgba(2,6,23,.02)}
td[data-currency] {white-space:nowrap}

/* GSC Top pages: keep header/columns stable while refetching */
.gsc-pages-table{table-layout:fixed}
.gsc-pages-table th,.gsc-pages-table td{overflow:hidden;text-overflow:ellipsis}
.gsc-pages-table td:first-child a{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gsc-pages-table[data-loading="1"] tbody{opacity:.55}

.table th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
.table th.sortable:hover{color:#0f172a}
.table th.sortable[data-sort-dir="asc"]::after{content:" ▲";font-size:11px;opacity:.9}
.table th.sortable[data-sort-dir="desc"]::after{content:" ▼";font-size:11px;opacity:.9}

.table-scroll{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.bartrack{height:20px;background:#eef2ff;border:1px solid #e0e7ff;border-radius:999px;overflow:hidden}
.bar{height:100%;background:linear-gradient(90deg,var(--brand),#22c55e);width:0%}

.hidden{display:none}

.filterbar{position:sticky;top:0;z-index:30;backdrop-filter:saturate(180%) blur(10px)}
.filterbar.panel{background:rgba(255,255,255,.88);border-color:rgba(2,6,23,.08);box-shadow:var(--shadow-md)}

@media (max-width:1306px) {
  .filterbar {position:static;box-shadow:none;border-color:rgba(2,6,23,.10)}
}

#openFilters{display:none}

#mobileStickyTableContext{display:none}

.mobile-nav-dock{display:none}

.iconbtn{
  border:1px solid rgba(2,6,23,.10);
  background:#fff;
  color:#0f172a;
  width:38px;
  height:38px;
  border-radius:12px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.iconbtn:hover{background:rgba(2,6,23,.04)}
.iconbtn:focus{outline:none;box-shadow:var(--ring)}

.filters-overlay{display:none}

.filterbar-head{
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(2,6,23,.08);
  margin-bottom:10px;
}
.filterbar-title{font-size:14px;font-weight:950;letter-spacing:-.01em;color:#0b1220}

.tab{
  text-align:left;
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:var(--sidebarText);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:850;
  letter-spacing:.01em;
  display:flex;
  align-items:center;
  gap:10px;
  position:relative;
}
.tab-icon{width:18px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.tab-label{min-width:0;flex:1 1 auto}
.tab-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  font-size:11px;
  font-weight:950;
  line-height:1;
  background:var(--danger);
  color:#fff;
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 10px 22px rgba(0,0,0,.22);
}
.tab:hover{background:rgba(255,255,255,.09)}
.tab.active{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.26);box-shadow:0 12px 24px rgba(0,0,0,.18)}

@media (min-width: 981px) {
  html.sidebar-collapsed{--sidebar-width:var(--sidebar-width-collapsed)}
  html.sidebar-collapsed .sidebar{padding:18px 10px}
  html.sidebar-collapsed .sidebar-brand-text{display:none}
  html.sidebar-collapsed .sidebar-sub{display:none}
  html.sidebar-collapsed .tab{justify-content:center;padding:10px 10px}
  html.sidebar-collapsed .tab-label{display:none}
  html.sidebar-collapsed .sidebar-footer{padding-top:0px}
  html.sidebar-collapsed .tab-badge{position:absolute;top:6px;right:6px;padding:0 5px;min-width:16px;height:16px;font-size:10px}
}

.tabpanels{margin-top:10px}
.tabpanel{
  margin-top:0;
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}

.tracking-grid{align-items:start}
.tracking-list{display:flex;flex-direction:column;gap:10px}
.tracking-list-item{
  width:100%;
  border:1px solid rgba(2,6,23,.10);
  background:#fff;
  border-radius:14px;
  padding:12px;
  text-align:left;
  cursor:pointer;
  box-shadow:var(--shadow-sm);
}
.tracking-list-item:hover{background:rgba(2,6,23,.02)}
.tracking-list-item.active{border-color:rgba(29,78,216,.35);box-shadow:0 0 0 3px rgba(29,78,216,.10)}
.tracking-list-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tracking-list-title{font-weight:800;color:#0f172a}
.tracking-list-meta{margin-top:4px;color:#64748b;font-size:12px}
.tracking-list-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  background:#ecfeff;
  color:#0f766e;
  border:1px solid rgba(15,118,110,.18);
}
.tracking-list-badge.is-warn{
  background:#fff7ed;
  color:#c2410c;
  border-color:rgba(194,65,12,.20);
}
.tracking-list-badge.is-muted{
  background:#f1f5f9;
  color:#475569;
  border-color:rgba(71,85,105,.18);
}
.tracking-card-value{font-size:22px !important}
.tracking-series-summary.is-expanded{background:rgba(239,246,255,.55)}
.tracking-series-sub{margin-top:3px;color:#64748b;font-size:12px}
.tracking-series-toggle{
  border:0;
  background:transparent;
  padding:0;
  color:#0f172a;
  font:inherit;
  font-weight:800;
  cursor:pointer;
  text-align:left;
}
.tracking-series-toggle:hover{color:#1d4ed8}
.tracking-series-toggle.is-expanded{color:#1d4ed8}
.tracking-series-detail-row td{padding:0;background:#f8fafc}
.tracking-series-detail{padding:10px 12px}
.tracking-series-detail-table th,
.tracking-series-detail-table td{font-size:12px}
.tracking-picker{position:relative}
.tracking-picker-box{position:relative}
.tracking-picker-results{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  background:#fff;
  border:1px solid rgba(2,6,23,.10);
  border-radius:14px;
  box-shadow:var(--shadow-md);
  max-height:260px;
  overflow:auto;
  z-index:60;
}
.tracking-option-row{
  width:100%;
  border:0;
  border-top:1px solid rgba(2,6,23,.06);
  background:#fff;
  text-align:left;
  padding:10px 12px;
  cursor:pointer;
}
.tracking-option-row:first-child{border-top:0}
.tracking-option-row:hover{background:rgba(2,6,23,.03)}
.tracking-option-row.is-selected{background:#eff6ff}
.tracking-option-title{font-weight:700;color:#0f172a}
.tracking-option-sub{margin-top:3px;color:#64748b;font-size:12px}
.tracking-option-empty{padding:12px;color:#64748b;font-size:13px}
.tracking-selected{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.tracking-selected-empty{color:#64748b;font-size:13px}
.tracking-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(2,6,23,.10);
  border-radius:999px;
  background:#fff;
  padding:6px 10px;
  max-width:100%;
}
.tracking-chip-label{font-size:12px;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tracking-chip-remove{
  border:0;
  background:transparent;
  color:#1d4ed8;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  padding:0;
}

#trackingProductSearch, #trackingCategorySearch {
  width:100%;
  padding:10px 12px;
  border:1px solid rgba(2,6,23,.12);
  border-radius:14px;
  font-size:14px;
  background-color:#fff;
}

/* Overview: column-based layout (masonry-style) */
.overview-columns{
  column-count:1;
  column-gap:14px;
}
.overview-columns > .section{
  display:inline-block;
  width:100%;
  break-inside:avoid;
  margin-top:0;
  margin-bottom:14px;
}
@media (min-width:1100px){
  .overview-columns{column-count:2}
}

.section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
  flex-wrap: wrap;
}
.section-head h2{margin:0}

.inline-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.inline-label{font-size:12px;color:#374151}

#stockProjControls{width:100%;align-items:flex-end;gap:14px}
#stockProjControls .ic-brand,
#stockProjControls .ic-period{display:flex;flex-direction:column;gap:6px}
#stockProjControls .ic-check{margin-left:auto}
#stockProjControls #stockBrand{min-width:220px}
#stockProjControls .ic-period-row{display:flex;align-items:center;gap:8px}
#stockProjControls .ic-period-row input{width:90px}
#stockProjControls #refreshStock{margin-left:10px}

.chart-wrap{position:relative;width:100%;height:280px}
.chart-wrap.chart-lg{height:300px}
.chart-wrap.chart-md{height:260px}
.chart-wrap canvas{display:block;width:100%;height:100% !important}

.global-loader{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(2,6,23,.45);
  z-index:10000;
}
.global-loader-card{
  background:rgba(15,23,42,.92);
  color:#eef2ff;
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  padding:18px 18px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
  display:flex;
  align-items:center;
  gap:12px;
  min-width:220px;
  justify-content:center;
}
.global-loader-text{font-size:13px;font-weight:800;letter-spacing:.01em;opacity:.95}
.spinner{
  width:26px;
  height:26px;
  border-radius:999px;
  border:3px solid rgba(255,255,255,.25);
  border-top-color:#ffffff;
  animation:spin 1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

@media (max-width:980px){
  .app{flex-direction:column}
  .sidebar{width:100%;min-width:0;max-width:none;flex:0 0 auto;height:auto;position:static}
  .sidebar-sub{display:none}

  /* Mobile/tablet nav: horizontal scroll instead of wrapping pills */
  .nav{
    flex-direction:row;
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    gap:10px;
    padding-bottom:8px;
    margin-bottom:8px;
    margin-top:12px;
  }
  .tab{width:auto;flex:0 0 auto;white-space:nowrap}

  /* Footer actions sit next to each other on small screens */
  .sidebar-footer{flex-direction:row;gap:10px;align-items:center;padding-top:0px}
  .sidebar-footer .tab{flex:0 0 auto}

  /* Filterbar: grid layout so fields line up nicely */
  .filterbar .controls{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    align-items:end;
  }
  .filterbar .controls .field{min-width:0}
  .filterbar .controls .field input,
  .filterbar .controls .field select{min-width:0;width:100%}
  .filterbar .controls .field .multi-select{min-width:0}
  .filterbar .controls .actions{grid-column:1 / -1;justify-content:flex-end}

  .main{padding:16px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.two{
    display: flex;
    flex-direction: column;
  }
  .grid.three{
    display: flex;
    flex-direction: column;
  }
  .sidebar-top{align-items:center;}
  .sidebar-toggle{display:none}
}
@media (max-width:560px){
  .field input:not([type="checkbox"]):not([type="radio"]),.field select{min-width:150px}

  /* Extra-small screens: icons-only nav to save space */
  .tab{
    padding:10px 10px;
    flex: 1;
    justify-content:center;
  }
  .tab-label{display:none}

  .filterbar .controls{grid-template-columns:1fr}
  .filterbar .controls .actions{justify-content:stretch}
  .filterbar .controls .actions .btn{width:100%}

  .header{flex-direction:column;align-items:stretch}
  .header-actions{justify-content:stretch;display:none;}
  .header-actions .btn{width:100%}

  .grid{grid-template-columns:1fr}

  /* Extra-small: simplify GSC tables */
  .gsc-pages-table th,.gsc-pages-table td{padding:9px 8px}
  .gsc-pages-table th:nth-child(2),
  .gsc-pages-table td:nth-child(2),
  .gsc-pages-table th:nth-child(3),
  .gsc-pages-table td:nth-child(3){white-space:nowrap}
}

@media (max-width:700px){
  /* Mobile: sticky section + table context (JS-driven, compatible with horizontal table scrolling) */
  html.mts-open #mobileStickyTableContext{display:block}
  html.filters-open #mobileStickyTableContext,
  html.filters-closing #mobileStickyTableContext{display:none !important}

  .field .multi-select-menu {
    max-height: 225px;
  }

  /* Mobile: don't force desktop GSC colgroup widths */
  .gsc-pages-table{table-layout:auto}
  .gsc-pages-table col{width:auto !important}
  .gsc-pages-table td:first-child a{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    word-break:break-word;
  }

  #mobileStickyTableContext{
    position:fixed;
    left:0;
    right:0;
    top:var(--fixed-top-offset, 0px);
    z-index:120;
    background:rgba(255,255,255,.94);
    backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid rgba(2,6,23,.10);
    box-shadow:0 14px 30px rgba(2,6,23,.08);
    padding-left: 30px;
    padding-right: 30px;
  }
  #mobileStickyTableContext .mts-title{
    padding:10px 10px 6px;
    font-size:11px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#334155;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #mobileStickyTableContext .mts-scroll{
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
  }
  #mobileStickyTableContext .mts-scroll::-webkit-scrollbar{display:none}
  #mobileStickyTableContext .mts-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0}
  #mobileStickyTableContext .mts-table th{
    border-top:0;
    padding:10px;
    background:transparent;
  }

  /* Mobile: filters are toggleable (modal), not always taking space */
  #openFilters{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 9050;
    width: calc(100% - 32px);
    transform: translateY(0);
    opacity: 1;
    transition: transform .22s cubic-bezier(.2,.8,.2,1), opacity .18s ease;
  }
  html.filters-open #openFilters{
    transform: translateY(calc(100% + 20px));
    opacity: 0;
    pointer-events: none;
  }

  .main{padding-bottom:96px}

  .filterbar{
    display:block;
    position:fixed;
    left:16px;
    right:16px;
    top:auto;
    bottom:16px;
    z-index:9200;
    overflow:auto;
    max-height: calc(100vh - 32px);
    background:rgba(255,255,255,.96);
    border-color:rgba(2,6,23,.10);
    box-shadow:0 30px 80px rgba(2,6,23,.25);
    backdrop-filter:saturate(180%) blur(10px);
    transform: translateY(calc(100% + 22px));
    opacity: 0;
    pointer-events:none;
    transition: transform .26s cubic-bezier(.2,.8,.2,1), opacity .20s ease;
  }
  html.filters-open .filterbar{
    transform: translateY(0);
    opacity: 1;
    pointer-events:auto;
  }
  .filterbar-head{display:flex}

  html.filters-open, html.filters-open body,
  html.filters-closing, html.filters-closing body{overflow:hidden}

  .filters-overlay{
    display:block;
    position:fixed;
    inset:0;
    background:rgba(2,6,23,.45);
    z-index:9100;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition: opacity .18s ease, visibility 0s linear .18s;
  }
  html.filters-open .filters-overlay{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition: opacity .18s ease;
  }

  @media (prefers-reduced-motion: reduce){
    #openFilters,
    .filterbar,
    .filters-overlay{transition:none !important}
  }
}

.linklike{
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font:inherit;
  color:var(--brand);
  font-weight:850;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
  text-align: left;
}
.linklike:hover{filter:brightness(.95)}
.linklike:focus{outline:none;box-shadow:var(--ring);border-radius:10px}

.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:3px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:850;
  border:1px solid rgba(2,6,23,.12);
  background:#fff;
}
.pill.pending{background:#f8fafc;color:#334155;border-color:rgba(51,65,85,.18)}
.pill.running{background:#eff6ff;color:#1d4ed8;border-color:rgba(29,78,216,.18)}
.pill.done{background:#ecfdf5;color:#047857;border-color:rgba(4,120,87,.18)}
.pill.failed{background:#fef2f2;color:#b91c1c;border-color:rgba(185,28,28,.18)}
.pill-dot{width:8px;height:8px;border-radius:999px;background:currentColor;opacity:.9}
.pill.running .pill-dot{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.35);opacity:1}}

.detail-overlay{
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.35);
  z-index:9000;
}

.detail-drawer{
  position:fixed;
  top:12px;
  right:12px;
  bottom:12px;
  width:min(760px, calc(100vw - 24px));
  background:rgba(255,255,255,.96);
  border:1px solid rgba(2,6,23,.12);
  border-radius:18px;
  box-shadow:0 30px 80px rgba(2,6,23,.25);
  z-index:9050;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  backdrop-filter:saturate(180%) blur(10px);
}

.detail-drawer.wide{
  left:12px;
  width:auto;
}

.detail-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px;
  border-bottom:1px solid rgba(2,6,23,.08);
}

.detail-head-actions{display:flex;gap:10px;align-items:flex-start}

.detail-head-text{min-width:0}
.detail-title{font-size:14px;font-weight:950;letter-spacing:-.01em;color:#0b1220}
.detail-sub{margin-top:4px;color:#64748b;font-size:12px;line-height:1.25}

.detail-close{padding:9px 12px;border-radius:12px;white-space:nowrap}

.detail-body{
  padding:12px 14px 14px;
  overflow:auto;
  flex:auto;
}

.detail-charts{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin:0 0 14px 0;
}

.detail-drawer.wide .detail-charts{
  grid-template-columns:1fr 1fr;
}

.detail-drawer.wide .detail-charts .detail-section {
  margin-top: 0px;
}

.detail-chart{
  position:relative;
  height:260px;
  overflow:hidden;
}

.detail-chart canvas{
  display:block;
  max-width:100%;
}

.detail-section {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 14px;
    height: fit-content;
}

.detail-meta-row{
  color:var(--muted);
  font-size:12px;
  margin-top:8px;
  word-break:break-word;
}

.detail-meta-row.controls{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.detail-meta-row a{
  color:#0b57d0;
  text-decoration:none;
}

.detail-meta-row a:hover{ text-decoration:underline }
.detail-sections.two {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.detail-sections.three {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.detail-sections{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.detail-sections:not(:first-child) {
  margin-top:14px;
}

.detail-split{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}

.detail-split-col{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.detail-drawer.wide .detail-split{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

@media (max-width:700px){
  .detail-drawer{top:0;right:0;bottom:0;left:0;width:auto;border-radius:0}
  .detail-charts{grid-template-columns:1fr}
  .detail-drawer.wide .detail-charts{
  grid-template-columns:1fr;
}
  .detail-drawer.wide .detail-split{grid-template-columns:1fr}
  .detail-sections.two,.detail-sections.three{grid-template-columns:1fr}
}

.detail-section{margin-top:14px}
.detail-section:first-child{margin-top:0}
@media (min-width:700px) {
  .detail-sections.two .detail-section:nth-child(-n+2),
  .detail-sections.three .detail-section:nth-child(-n+3) {
    margin-top:0;
  }
}
.detail-section h3{margin:0 0 10px 0;font-size:13px;color:#0b1220}
.detail-section-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:0 0 10px 0;
}
.detail-section-header h3{margin:0}
.detail-section-controls{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  white-space:nowrap;
}
.detail-hint{color:var(--muted);font-size:12px;margin-top:8px}

.results-wrap {
  margin-top: 14px;
}

/* Functions drawer */
.func-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
@media (max-width:700px){
  .func-grid{grid-template-columns:1fr}
}
.func-tile{
  border:1px solid rgba(2,6,23,.12);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow-sm);
  padding:14px;
  cursor:pointer;
  text-align:left;
}
.func-tile:hover{filter:brightness(0.99)}
.func-tile:focus{outline:none;box-shadow:var(--ring)}
.func-tile-title{font-weight:950;letter-spacing:-.01em;color:#0b1220}
.func-tile-sub{margin-top:6px;color:#64748b;font-size:12px;line-height:1.25}
.func-tile-meta{margin-top:10px;color:#334155;font-size:12px;font-weight:700;display:flex;gap:10px;flex-wrap:wrap}
.func-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;border:1px solid rgba(2,6,23,.10);background:rgba(2,6,23,.02)}

.func-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.35);
  z-index:9100;
}
.func-modal{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:min(860px, calc(100vw - 24px));
  height:min(720px, calc(100vh - 24px));
  overflow:visible;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(2,6,23,.12);
  border-radius:18px;
  box-shadow:0 30px 80px rgba(2,6,23,.25);
  z-index:9150;
  padding:14px;
  display:flex;
  flex-direction:column;
}
.func-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.func-modal-title{font-size:14px;font-weight:950;letter-spacing:-.01em;color:#0b1220}
.func-modal-sub{margin-top:4px;color:#64748b;font-size:12px;line-height:1.25}
.func-modal-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px;justify-content:flex-end}

.func-modal-body{flex:0 0 auto;overflow:visible}
.func-modal-results{flex:1 1 auto;min-height:0;overflow:auto;margin-top:10px;padding-top:10px;border-top:1px solid rgba(2,6,23,.08)}
.func-table-wrap{overflow:auto;max-width:100%}
.func-modal .table{min-width:860px}
.func-table-wrap .table{min-width:860px}

.job-run-form{display:flex;flex-direction:column;gap:14px}
.job-run-form .field > span{font-size:12px;color:#334155;font-weight:650}
.job-run-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.job-run-grid .field input,
.job-run-grid .field select{min-width:0;width:100%}
.job-run-grid-full{grid-column:1 / -1}
.job-run-help{color:#475569;font-size:13px;line-height:1.4;padding:10px 12px;border-radius:12px;background:rgba(15,23,42,.04);border:1px solid rgba(15,23,42,.08)}
.job-run-check{display:flex;align-items:center;gap:10px;color:#334155;font-size:13px;font-weight:650}
.job-run-check input{margin:0}
#jobRunMeta{margin:0}

@media (max-width:700px){
  .job-run-grid{grid-template-columns:1fr}
  .job-run-grid-full{grid-column:auto}
}

.func-view{animation:funcViewIn .18s ease-out}
@keyframes funcViewIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}

/* UX: avoid "drawer + modal" feeling. When modal is open, park the drawer. */
html.func-modal-open #functionsDrawer{
  opacity:0;
  pointer-events:none;
  transform:translateX(24px);
}
html.func-modal-open #functionsOverlay{
  opacity:0;
  pointer-events:none;
}

.th-help{cursor:help;text-decoration:underline dotted rgba(100,116,139,.7);text-underline-offset:3px}
.th-help:hover{background:rgba(2,6,23,.02)}

.func-cheatsheet{margin-top:10px}
.func-cheatsheet summary{cursor:pointer;font-weight:800;color:#0f172a}
.func-cheatsheet summary:hover{text-decoration:underline}
.func-cheatsheet .func-cheatsheet-body{margin-top:10px;color:#334155;font-size:13px;line-height:1.35}
.func-cheatsheet .func-cheatsheet-body ul{margin:8px 0 0 18px;padding:0}
.func-cheatsheet .func-cheatsheet-body li{margin:6px 0}


.inline-controls input {
  padding:8px 10px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(2,6,23,.12);
}

.inline-controls select {
  padding:8px 10px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(2,6,23,.12);
}

#reportsBody .banner {
  margin-bottom: 14px;
}

#reportsDrawer .drawer-body {
  padding-bottom: 32px;
}

#reportsDrawer .drawer-body > * + * {
  margin-top: 18px;
}

#reportsDrawer .drawer-body section,
#reportsDrawer .drawer-body .card,
#reportsDrawer .drawer-body .panel {
  margin-bottom: 0;
}

#reportsDrawer .drawer-body form.controls {
  display: grid;
  gap: 14px 16px;
  align-items: start;
}

#reportsDrawer .drawer-body form.controls > * {
  min-width: 0;
}

#reportsDrawer .drawer-body form.controls .grid.two {
  gap: 14px 16px;
}

#reportsDrawer .drawer-body .muted,
#reportsDrawer .drawer-body .hint,
#reportsDrawer .drawer-body small {
  display: block;
  line-height: 1.45;
}

#reportsDrawer .drawer-body table {
  margin-top: 8px;
}

.reports-template-form {
  display: grid;
  gap: 14px;
}

.reports-template-fields {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px 16px;
  align-items: start;
}

.reports-template-fields .field {
  grid-column: span 6;
  min-width: 0;
}

.reports-template-fields .field.span-full {
  grid-column: 1 / -1;
}

.reports-template-fields .field input,
.reports-template-fields .field textarea,
.reports-template-fields .field select {
  width: 100%;
  min-width: 0;
}

.reports-template-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.reports-code-pane {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

.reports-code-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.reports-code-head h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 850;
  color: #0b1220;
}

.reports-code-head p {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--muted);
}

.reports-code-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.reports-code-tool {
  border: 1px solid rgba(2, 6, 23, .12);
  background: rgba(255, 255, 255, .9);
  color: #0f172a;
  border-radius: 10px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.reports-code-tool:hover {
  background: rgba(248, 250, 252, .98);
}

.reports-code-tool:focus {
  outline: none;
  box-shadow: var(--ring);
  border-color: rgba(37, 99, 235, .35);
}

.reports-code-editor {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 420px;
  border: 1px solid rgba(2, 6, 23, .12);
  border-radius: 14px;
  overflow: hidden;
  background: #0f172a;
}

.reports-code-editor:focus-within {
  box-shadow: var(--ring);
  border-color: rgba(37, 99, 235, .35);
}

.reports-code-gutter {
  padding: 14px 10px 14px 12px;
  background: #0b1220;
  border-right: 1px solid rgba(255, 255, 255, .08);
  color: rgba(226, 232, 240, .56);
  font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  text-align: right;
  user-select: none;
  overflow: hidden;
}

.reports-code-gutter span {
  display: block;
}

.reports-code-textarea {
  width: 100%;
  min-width: 0;
  min-height: 420px;
  padding: 14px 16px;
  border: 0 !important;
  border-radius: 0 !important;
  background: #111827 !important;
  color: #e5eef9;
  font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  resize: none;
  outline: none;
  box-shadow: none !important;
  white-space: pre;
  overflow: auto;
  tab-size: 2;
}

.reports-code-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--muted);
}

.reports-template-guide-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.reports-template-guide-card {
  padding: 12px;
  border: 1px dashed rgba(2, 6, 23, .12);
  border-radius: 12px;
  background: rgba(248, 250, 252, .9);
}

.reports-template-guide-card strong {
  display: block;
  margin-bottom: 6px;
  color: #0b1220;
}

.reports-template-guide-card p {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
}

.reports-template-guide-card code {
  display: inline-block;
  margin: 2px 6px 2px 0;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .08);
  color: #0f172a;
  font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.reports-template-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.reports-subscription-form {
  display: grid;
  gap: 14px;
}

.reports-wizard-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.reports-wizard-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(2, 6, 23, .1);
  border-radius: 14px;
  background: rgba(255, 255, 255, .72);
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.reports-wizard-step.active {
  border-color: rgba(93, 112, 93, .35);
  background: rgba(93, 112, 93, .1);
  color: #0f172a;
}

.reports-wizard-step.completed {
  border-color: rgba(0, 118, 52, .24);
  background: rgba(0, 118, 52, .1);
  color: #14532d;
}

.reports-wizard-step-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .08);
  color: inherit;
  font-size: 12px;
  font-weight: 850;
  flex: 0 0 24px;
}

.reports-subscription-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.reports-subscription-card {
  min-width: 0;
}

.reports-subscription-card .section-head {
  margin-bottom: 14px;
}

.reports-subscription-card .section-head h2 {
  font-size: 16px;
  font-weight: 850;
  color: #0b1220;
}

.reports-subscription-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.reports-subscription-fields .field {
  min-width: 0;
}

.reports-subscription-fields .field.span-full {
  grid-column: 1 / -1;
}

.reports-subscription-fields .field input,
.reports-subscription-fields .field select,
.reports-subscription-fields .field textarea {
  width: 100%;
  min-width: 0;
}

.reports-subscription-intro {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.reports-subscription-intro p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}

.reports-subscription-schedule-note {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
}

.reports-subscription-options {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  align-items: end;
}

.reports-subscription-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
}

.reports-subscription-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #0f172a;
}

.reports-subscription-check input {
  width: 16px;
  height: 16px;
  min-width: 16px;
}

.reports-subscription-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.reports-subscription-warning {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: #b45309;
}

.reports-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.reports-review-card {
  padding: 12px;
  border: 1px solid rgba(2, 6, 23, .08);
  border-radius: 12px;
  background: rgba(248, 250, 252, .9);
}

.reports-review-card-wide {
  grid-column: 1 / -1;
}

.reports-review-card strong {
  display: block;
  margin-bottom: 6px;
  color: #0b1220;
}

.reports-review-card p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}

.reports-wizard-nav {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
}

.reports-wizard-status {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.reports-wizard-status strong {
  color: #0b1220;
  font-size: 14px;
}

.reports-wizard-status span {
  color: var(--muted);
  font-size: 12px;
}

.reports-wizard-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (max-width: 980px) {
  .reports-template-editor-grid,
  .reports-template-guide-grid {
    grid-template-columns: 1fr;
  }

  .reports-template-fields .field {
    grid-column: 1 / -1;
  }

  .reports-code-head {
    flex-direction: column;
  }

  .reports-code-tools {
    justify-content: flex-start;
  }

  .reports-wizard-steps,
  .reports-subscription-grid,
  .reports-subscription-fields,
  .reports-subscription-options,
  .reports-review-grid,
  .reports-wizard-nav {
    grid-template-columns: 1fr;
  }

  .reports-subscription-actions {
    justify-content: flex-start;
  }

  .reports-wizard-actions {
    justify-content: flex-start;
  }
}

#mobileBlur {
  display: none;
}

@media (max-width:700px){
  /* Mobile: stock projection controls are stacked and tappable */
  #stockProjControls{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    align-items:end;
  }
  #stockProjControls .ic-brand,
  #stockProjControls .ic-period,
  #stockProjControls .ic-check,

  #stockProjControls .ic-brand,
  #stockProjControls .ic-period{display:flex;flex-direction:column;gap:6px}

  #stockProjControls select,
  #stockProjControls input[type="number"]{
    width:100%;
    min-width:0 !important;
  }

  #stockProjControls .ic-period-row input{width:120px;max-width:100%}
  #stockProjControls .ic-check label{flex-wrap:wrap;line-height:1.2}

  #stockProjControls .ic-check {
    margin-left:0;
    grid-column: 1 / -1;
  }

  #stockProjControls #refreshStock{
    width:100%;
    grid-column:1 / -1;
    margin-left:0;
  }

  #mobileBlur{
    display:block;
    position:fixed;
    left:0;
    right: 0;
    bottom:0;
    height:73px;
    backdrop-filter:saturate(180%) blur(10px);
    z-index:9000;
  }

  html.filters-open #mobileBlur{
    display:none;
  }

}

@media (max-width:980px){
  /* Mobile: docked nav that appears once sidebar is out of view */
  .mobile-nav-dock{
    display:block;
    position:fixed;
    left:0;
    right:0;
    top:0;
    z-index:140;
    padding:10px 16px;
    padding-top:calc(10px + env(safe-area-inset-top, 0px));
    background:linear-gradient(180deg, var(--sidebar), var(--sidebar2));
    border-bottom:1px solid rgba(255,255,255,.10);
    box-shadow:0 16px 40px rgba(0,0,0,.22);
    transform:translateY(-12px);
    opacity:0;
    pointer-events:none;
    transition:transform .22s cubic-bezier(.2,.8,.2,1), opacity .18s ease, box-shadow .18s ease;
    backdrop-filter:saturate(180%) blur(10px);
  }
  html.mts-open .mobile-nav-dock {
    box-shadow:0 0 0 rgba(0,0,0,0);
  }
  html.nav-docked .mobile-nav-dock{
    transform:translateY(0);
    opacity:1;
    pointer-events:auto;
  }

  .mobile-nav-dock .nav{
    margin-top:0;
    padding-bottom:0;
  }

  html.nav-docked{--fixed-top-offset:var(--navDockH, 64px)}

  @media (prefers-reduced-motion: reduce){
    .mobile-nav-dock{transition:none !important}
  }
}

/* Settings: per-shop exclusions */
.settings-wrap{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.settings-shop{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--panel);box-shadow:var(--shadow-sm)}
.settings-shop-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--border)}
.settings-shop-title{font-weight:800;letter-spacing:-.01em}
.settings-shop-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.settings-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px 14px}
@media (max-width: 900px){
  .settings-columns{grid-template-columns:1fr}
}
.settings-box{border:1px solid var(--border);border-radius:14px;padding:12px;background:rgba(2,6,23,.02)}
.settings-box .k{font-weight:700}
.settings-search{width:100%;margin-top:8px}
.settings-search input{width:100%;padding:10px 12px;border:1px solid rgba(2,6,23,.12);border-radius:4px}
.settings-list{max-height:340px;overflow:auto;margin-top:10px;padding-top:6px;border-top:1px solid var(--border)}
.settings-item{display:flex;align-items:flex-start;gap:10px;padding:6px 0}
.settings-item input[type="checkbox"]{margin-top:2px}
.settings-item label{display:flex;gap:10px;cursor:pointer;user-select:none}
.settings-item .muted{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.settings-item .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}