:root{
  --brand:#005082;
  --brand-2:#0b6fb3;
  --brand-3:#0ea5b7;
  --accent:#f6c343;
  --danger:#dc2626;
  --success:#0f766e;
  --bg:#eef4f8;
  --bg-2:#f8fbfd;
  --surface:#ffffff;
  --surface-2:#f4f8fb;
  --surface-3:#eaf2f7;
  --text:#102434;
  --muted:#64748b;
  --border:#d8e3eb;
  --border-strong:#b8c9d6;
  --shadow:0 14px 36px rgba(0,42,74,.10);
  --shadow-soft:0 8px 22px rgba(0,42,74,.07);
  --radius:12px;
  --radius-sm:8px;
  --ring:0 0 0 3px rgba(14,165,183,.22);
}

/* ===== v6.34 audit, movement history and mobile navigation ===== */
.audit-filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:end;
}
.audit-filters label{
  display:grid;
  gap:5px;
  min-width:210px;
  font-weight:800;
}
.audit-details{
  max-width:560px;
  white-space:normal;
  overflow-wrap:anywhere;
}
.audit-details details summary{
  color:var(--brand-2);
  cursor:pointer;
  font-weight:800;
}
.audit-details details[open] summary{ margin-bottom:8px; }
.audit-details details code{
  display:block;
  max-height:140px;
  overflow:auto;
}
.user-admin-form{
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:12px;
  align-items:end;
  margin-top:14px;
}
.user-admin-field{ min-width:0; }
.user-admin-username,
.user-admin-password,
.user-admin-role,
.user-admin-active{ grid-column:span 1; }
.user-admin-display-name,
.user-admin-email{ grid-column:span 2; }
.user-admin-linked{ grid-column:span 3; }
.user-role-help{
  grid-column:1/-1;
  color:var(--muted);
  min-height:18px;
}
.user-admin-actions{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
}
@media (max-width: 760px){
  .user-admin-form{
    grid-template-columns:1fr;
    gap:14px;
  }
  .user-admin-form > *,
  .user-admin-username,
  .user-admin-password,
  .user-admin-role,
  .user-admin-active,
  .user-admin-display-name,
  .user-admin-email,
  .user-admin-linked,
  .user-role-help,
  .user-admin-actions{
    grid-column:1 !important;
  }
  .user-admin-actions .btn-primary{ width:100%; }
}
.audit-table code{
  color:var(--text);
  background:var(--surface-2);
  border:1px solid var(--border);
  border-radius:6px;
  padding:3px 6px;
}
.movement-kind{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:800;
}
.movement-kind svg{ width:15px; height:15px; }
.movement-kind-move{ color:#1d4ed8; }
.movement-kind-sale{ color:#0f766e; }
.movement-kind-adjust{ color:#b42318; }

:root[data-theme="dark"]{
  --bg:#07131d;
  --bg-2:#0b1b28;
  --surface:#102333;
  --surface-2:#142d40;
  --surface-3:#1b3a50;
  --text:#e8f2f8;
  --muted:#a7bac8;
  --border:#25445a;
  --border-strong:#35627d;
  --shadow:0 18px 42px rgba(0,0,0,.34);
  --shadow-soft:0 10px 24px rgba(0,0,0,.24);
  --ring:0 0 0 3px rgba(14,165,183,.32);
}

*{ box-sizing:border-box; }
html{ color-scheme:light; }
html[data-theme="dark"]{ color-scheme:dark; }

body{
  margin:0;
  min-height:100vh;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 16% -12%, rgba(14,165,183,.16), transparent 34rem),
    radial-gradient(circle at 92% 4%, rgba(246,195,67,.12), transparent 26rem),
    linear-gradient(180deg, var(--bg-2), var(--bg));
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.20) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.16) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.36), transparent 52%);
  opacity:.35;
}

html[data-theme="dark"] body::before{ opacity:.13; }

a{ color:var(--brand-2); }
a:visited{ color:var(--brand-2); }

.app-header{
  position:sticky;
  top:0;
  z-index:40;
  padding:10px 16px;
  background:
    linear-gradient(135deg, rgba(0,80,130,.98), rgba(0,93,143,.96) 52%, rgba(10,119,154,.96));
  color:#fff;
  box-shadow:0 10px 30px rgba(0,42,74,.24);
}

.app-header-inner{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:1600px;
  margin:0 auto;
}

.brand-link{
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  text-decoration:none;
  min-width:190px;
}

.brand-link:visited{ color:#fff; }
.brand-mark{
  width:38px;
  height:38px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(255,255,255,.20), rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
.brand-mark img{ width:24px; height:24px; display:block; }
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-title{ font-weight:800; letter-spacing:.2px; }
.brand-caption{ font-size:11px; color:rgba(255,255,255,.76); margin-top:3px; }

.main-nav{
  display:flex;
  align-items:center;
  gap:4px;
  flex:1;
  min-width:0;
  overflow-x:auto;
  scrollbar-width:thin;
  padding:2px;
}

.main-nav a{
  color:rgba(255,255,255,.82);
  text-decoration:none;
  padding:9px 11px;
  border-radius:9px;
  white-space:nowrap;
  font-weight:700;
  font-size:14px;
  transition:background .16s ease, color .16s ease, transform .16s ease;
}
.main-nav a:visited{ color:rgba(255,255,255,.82); }
.main-nav a:hover{
  color:#fff;
  background:rgba(255,255,255,.12);
  transform:translateY(-1px);
}
.main-nav a.active{
  color:#08324d;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.16);
}

.header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}

.theme-toggle,
.power-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height:36px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.10);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  transition:background .16s ease, transform .16s ease, border-color .16s ease;
}
.theme-toggle:hover,
.power-btn:hover{ background:rgba(255,255,255,.18); transform:translateY(-1px); }
.theme-dot{
  width:14px;
  height:14px;
  border-radius:999px;
  background:linear-gradient(135deg, #fff, #f6c343);
  box-shadow:0 0 0 3px rgba(255,255,255,.16);
}
html[data-theme="dark"] .theme-dot{ background:linear-gradient(135deg, #9ad7ff, #0b1b28); }
.power-form{ margin:0; }
.power-btn-danger{
  background:rgba(220,38,38,.20);
  border-color:rgba(255,255,255,.24);
}
.power-btn-danger:hover{ background:rgba(220,38,38,.34); }

.app-main{
  width:min(100%, 1600px);
  margin:0 auto;
  padding:20px;
}

.card{
  background:color-mix(in srgb, var(--surface) 94%, transparent);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
  box-shadow:var(--shadow-soft);
  margin-bottom:16px;
  backdrop-filter:blur(10px);
}

.card:hover{ box-shadow:var(--shadow); }
.hero{
  background:
    linear-gradient(135deg, rgba(0,80,130,.12), rgba(14,165,183,.08)),
    var(--surface);
  border-color:color-mix(in srgb, var(--brand) 22%, var(--border));
}
.flash-message{ padding:12px 14px; animation:softPop .18s ease-out; }

.grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}

h1,h2,h3,h4{ color:var(--text); letter-spacing:0; }
h2{ font-size:24px; }
h3{ font-size:18px; }
.small{ font-size:12px; color:var(--muted); }

label{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:6px;
  font-weight:700;
}

input, select, textarea{
  width:100%;
  padding:10px 11px;
  border-radius:9px;
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
input:focus, select:focus, textarea:focus{
  border-color:var(--brand-3);
  box-shadow:var(--ring);
}
input::placeholder, textarea::placeholder{ color:color-mix(in srgb, var(--muted) 70%, transparent); }

button,
.btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid color-mix(in srgb, var(--brand) 70%, #fff);
  background:linear-gradient(135deg, var(--brand), var(--brand-2));
  color:#fff;
  cursor:pointer;
  font-weight:800;
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
  box-shadow:0 8px 18px rgba(0,80,130,.18);
  text-decoration:none;
}
button:hover,
.btn-primary:hover{ transform:translateY(-1px); filter:brightness(1.02); }
button:active,
.btn-primary:active{ transform:translateY(0); }

.btn-secondary,
a.btn-secondary{
  display:inline-block;
  padding:9px 11px;
  border-radius:10px;
  background:var(--surface-2);
  color:var(--text);
  border:1px solid var(--border);
  text-decoration:none;
  font-weight:800;
  box-shadow:none;
}
.btn-secondary:visited,
a.btn-secondary:visited{ color:var(--text); }
.btn-secondary:hover,
a.btn-secondary:hover{
  background:var(--surface-3);
  transform:translateY(-1px);
}

.btn-danger{
  background:color-mix(in srgb, var(--danger) 12%, var(--surface));
  border:1px solid color-mix(in srgb, var(--danger) 30%, var(--border));
  color:#991b1b;
  padding:7px 10px;
  border-radius:10px;
  cursor:pointer;
  font-weight:800;
}
html[data-theme="dark"] .btn-danger{ color:#fecaca; }
.btn-danger:hover{ background:color-mix(in srgb, var(--danger) 20%, var(--surface)); }

table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:var(--surface);
  border-radius:var(--radius);
  overflow:visible;
}
th, td{
  padding:9px 11px;
  border-bottom:1px solid var(--border);
  text-align:left;
  color:var(--text);
}
th{
  background:var(--surface-2);
  color:var(--muted);
  font-size:12px;
  text-transform:none;
  position:sticky;
  top:0;
  z-index:1;
}
tbody tr{ transition:background .12s ease; }
tbody tr:hover td{ background:color-mix(in srgb, var(--brand-3) 7%, transparent); }

table.dataTable thead th,
table.dataTable thead td{
  position:sticky !important;
  top:0;
  z-index:5;
  background:var(--surface-2) !important;
}
table.dataTable thead tr.filters th,
table.dataTable thead tr.filters td{
  top:var(--dt-head-h, 44px) !important;
  z-index:6;
  background:var(--surface-2) !important;
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate{ color:var(--muted) !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button{
  color:var(--text) !important;
  border-radius:8px !important;
  border:1px solid transparent !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{
  color:#fff !important;
  background:linear-gradient(135deg, var(--brand), var(--brand-2)) !important;
  border-color:transparent !important;
}
.dataTables_wrapper .dt-bottom{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px 16px;
  flex-wrap:wrap;
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid var(--border);
}
.dataTables_wrapper .dt-bottom .dataTables_length,
.dataTables_wrapper .dt-bottom .dataTables_info,
.dataTables_wrapper .dt-bottom .dataTables_paginate{
  float:none !important;
  margin:0 !important;
  padding:0 !important;
}
.dataTables_wrapper .dt-bottom .dataTables_info{
  margin-right:auto !important;
}
.dataTables_wrapper .dataTables_filter{
  display:none !important;
}
.dataTables_wrapper .dataTables_length label{
  display:flex;
  align-items:center;
  gap:6px;
}
.dataTables_wrapper .dataTables_length select{
  width:auto;
  min-width:76px;
  height:32px;
  padding:3px 8px;
}
.dt-stabilize{
  visibility:hidden;
}
.dt-stabilize.dt-ready{
  visibility:visible;
}

.date-range-picker{
  position:relative;
  min-width:260px;
}
.date-range-picker input[type="hidden"]{
  display:none;
}
.date-range-trigger{
  width:100%;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 12px;
  border:1px solid var(--border-strong);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  font-weight:760;
  cursor:pointer;
}
.date-range-trigger:hover{
  border-color:var(--brand-2);
}
.date-range-label{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.date-range-popover{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  z-index:9000;
  width:min(330px, calc(100vw - 32px));
  padding:12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  box-shadow:0 18px 42px rgba(0,0,0,.24);
}
.date-range-picker.open .date-range-popover{
  display:block;
}
.date-range-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
}
.date-range-month{
  font-weight:850;
  text-align:center;
}
.date-range-nav{
  width:32px;
  height:32px;
  display:inline-grid;
  place-items:center;
  padding:0;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--surface-2);
  color:var(--text);
  cursor:pointer;
}
.date-range-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:4px;
}
.date-range-weekday{
  color:var(--muted);
  font-size:11px;
  font-weight:850;
  text-align:center;
  padding:4px 0;
}
.date-range-day{
  height:34px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font-weight:760;
}
.date-range-day:hover{
  border-color:var(--brand-2);
}
.date-range-day.is-muted{
  opacity:.35;
}
.date-range-day.is-in-range{
  background:color-mix(in srgb, var(--brand-2) 12%, var(--surface));
}
.date-range-day.is-selected{
  background:var(--brand-2);
  border-color:var(--brand-2);
  color:#fff;
}
.date-range-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
}
.date-range-help{
  color:var(--muted);
  font-size:12px;
  min-height:16px;
}
.date-range-actions{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.date-range-actions button{
  min-height:30px;
  padding:5px 9px;
  border-radius:8px;
}
.date-range-trigger svg{
  width:18px !important;
  height:18px !important;
  flex:0 0 18px;
}

.period-filter{
  display:flex;
  align-items:flex-end;
  gap:8px;
  flex-wrap:wrap;
  position:relative;
  z-index:35;
}
.period-filter-field{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:0;
}
.period-filter-field select{
  height:38px;
  padding:7px 10px;
  border:1px solid var(--border-strong);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  box-sizing:border-box;
}
.period-filter-field[data-period-year-field] select{ width:96px; }
.period-filter-field[data-period-month-field] select{ width:144px; }
.period-filter-field[data-period-day-field] select{ width:98px; }
.period-filter-icon-btn{
  width:38px;
  height:38px;
  display:inline-grid;
  place-items:center;
  padding:0 !important;
  border:1px solid var(--border-strong);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  cursor:pointer;
}
.period-filter-icon-btn svg{
  width:18px !important;
  height:18px !important;
  display:block;
}
.period-filter-summary{
  min-width:178px;
  max-width:220px;
  min-height:38px;
  height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--surface-2);
  color:var(--muted);
  font-weight:780;
  box-sizing:border-box;
  cursor:pointer;
  line-height:1;
  text-align:left;
}
.period-filter-summary svg{
  width:16px !important;
  height:16px !important;
  flex:0 0 16px;
}
.period-filter-popover{
  display:none;
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:99990;
  width:min(360px, calc(100vw - 32px));
  padding:12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  box-shadow:0 20px 48px rgba(0,0,0,.28);
}
.period-filter.open .period-filter-popover{
  display:block;
}
.period-filter-popover-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.period-filter-popover label{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:0;
}
.period-filter-popover input[type="date"]{
  height:38px;
  padding:7px 9px;
  border:1px solid var(--border-strong);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
}
.period-filter-popover-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}
.period-filter-popover-actions button,
.period-filter-popover-actions .btn-secondary{
  min-height:34px;
  padding:7px 10px !important;
}
.no-spinner::-webkit-outer-spin-button,
.no-spinner::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}
.no-spinner{
  appearance:textfield;
  -moz-appearance:textfield;
}

.badge{
  display:inline-block;
  padding:3px 8px;
  border-radius:999px;
  background:var(--surface-3);
  color:var(--text);
  border:1px solid var(--border);
  font-weight:800;
}
.img-thumb{
  width:44px;
  height:44px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid var(--border);
  background:var(--surface-2);
}
.img-thumb-lg{ width:88px; height:88px; }
.photo-placeholder{
  width:44px;
  height:44px;
  flex:0 0 44px;
  display:inline-grid;
  place-items:center;
  box-sizing:border-box;
  border:1px dashed var(--border);
  border-radius:10px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--surface-2) 84%, transparent), var(--surface));
  color:var(--muted);
  user-select:none;
  overflow:hidden;
  position:relative;
}
.photo-placeholder::before{
  content:"";
  display:block;
  width:20px;
  height:16px;
  box-sizing:border-box;
  border:1.5px solid color-mix(in srgb, var(--muted) 50%, transparent);
  border-radius:4px;
  opacity:.78;
  background:
    radial-gradient(circle at 5px 5px, color-mix(in srgb, var(--muted) 58%, transparent) 0 2px, transparent 2.3px),
    linear-gradient(135deg, transparent 50%, color-mix(in srgb, var(--muted) 48%, transparent) 51% 57%, transparent 58%),
    linear-gradient(45deg, transparent 54%, color-mix(in srgb, var(--muted) 38%, transparent) 55% 61%, transparent 62%);
}
.photo-placeholder::after{ content:""; display:none; }
.photo-placeholder.photo-28{ width:28px; height:28px; flex-basis:28px; border-radius:7px; }
.photo-placeholder.photo-28::before{ width:15px; height:12px; border-radius:3px; }
.photo-placeholder.photo-32{ width:32px; height:32px; flex-basis:32px; border-radius:7px; }
.photo-placeholder.photo-32::before{ width:17px; height:13px; border-radius:3px; }
.photo-placeholder.photo-34{ width:34px; height:34px; flex-basis:34px; border-radius:7px; }
.photo-placeholder.photo-36{ width:36px; height:36px; flex-basis:36px; border-radius:7px; }
.photo-placeholder.photo-38{ width:38px; height:38px; flex-basis:38px; border-radius:8px; }
.photo-placeholder.photo-42{ width:42px; height:42px; flex-basis:42px; border-radius:8px; }
.photo-placeholder.photo-44{ width:44px; height:44px; flex-basis:44px; }
.photo-placeholder.photo-200{ width:200px; height:200px; flex-basis:200px; border-radius:12px; }
.photo-placeholder.photo-200::before{ width:58px; height:44px; border-radius:8px; border-width:2px; }
.photo-placeholder.has-image::before,
.photo-placeholder.has-image::after{ content:""; display:none; }

tr.month-sep td{
  background:var(--surface-2);
  font-weight:800;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.drop{
  border:2px dashed var(--border-strong);
  border-radius:var(--radius);
  padding:14px;
  text-align:center;
  background:var(--surface-2);
}
.drop.dragover{
  background:color-mix(in srgb, var(--brand-3) 14%, var(--surface));
  border-color:var(--brand-3);
}

.inline-form{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.inline-form input[type="number"],
.inline-form input[type="text"]{ max-width:170px; }
.inline-form button{ padding:8px 10px; border-radius:10px; }

.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(3,12,20,.62);
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:50;
  backdrop-filter:blur(4px);
}
.modal-backdrop.open{ display:flex; }
.modal-content{
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--text);
  border-radius:14px;
  padding:12px;
  max-width:92vw;
  max-height:92vh;
  box-shadow:0 24px 60px rgba(0,0,0,.36);
  animation:softPop .16s ease-out;
}
.modal-content img{
  max-width:90vw;
  max-height:88vh;
  display:block;
  border-radius:12px;
}

.suggest-wrap{ position:relative; }
.suggest-box,
.suggestions{
  background:var(--surface) !important;
  color:var(--text);
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  box-shadow:0 18px 36px rgba(0,42,74,.16) !important;
}
.suggest-box a{ color:var(--text); text-decoration:none; display:inline-block; padding:6px 8px; border-radius:9px; width:100%; }
.suggest-box a:hover{ background:var(--surface-2); }

.form-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.form-row > div{ flex:1 1 260px; }
.form-row .rate{ flex:0 1 280px; }
.form-row .actions{ flex:0 0 auto; }

.form-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
  align-items:stretch;
}
.form-grid > div{ display:flex; flex-direction:column; justify-content:flex-start; }

.home-hero{
  display:grid;
  grid-template-columns:minmax(260px, 380px) 1fr;
  gap:28px;
  align-items:center;
  padding:28px;
  overflow:hidden;
}
.home-logo-panel{
  min-height:220px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)),
    linear-gradient(135deg, #005082, #0b6fb3);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 18px 36px rgba(0,80,130,.22);
}
.home-logo{
  max-width:250px;
  width:78%;
  height:auto;
  display:block;
  margin:0;
  filter:drop-shadow(0 12px 22px rgba(0,0,0,.20));
}
.home-logo-center{ margin-left:auto; margin-right:auto; }
.home-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--surface-2);
  color:var(--muted);
  font-weight:800;
  font-size:12px;
  border:1px solid var(--border);
}
.home-title{
  margin:14px 0 8px;
  font-size:34px;
  line-height:1.05;
}
.home-subtitle{
  max-width:700px;
  font-size:15px;
  line-height:1.55;
}
.home-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.module-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:170px;
  margin-bottom:0;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.module-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb, var(--brand-3) 35%, var(--border));
}
.module-kicker{ color:var(--brand-2); font-size:12px; font-weight:900; text-transform:uppercase; }
.module-card p{ flex:1; margin:0; line-height:1.45; }
.module-actions{ display:flex; gap:10px; margin-top:auto; flex-wrap:wrap; align-items:center; }

.neg{ color:#b91c1c; font-weight:800; }
html[data-theme="dark"] .neg{ color:#fca5a5; }
.locked,
.locked-display{
  background:var(--surface-2) !important;
  color:var(--text) !important;
}
.locked-display:focus{ outline:none; box-shadow:none; }

.qty-over{
  color:#b42318;
  border-color:#fda29b;
  background:#fffbfa;
  font-weight:800;
}
html[data-theme="dark"] .qty-over{
  color:#fecaca;
  background:rgba(127,29,29,.34);
}

.locked-meta{
  opacity:.85;
  margin-top:4px;
  user-select:none;
  pointer-events:none;
}

.money-wrap,
.pct-wrap{ position:relative; }
.money-wrap::before,
.pct-wrap::before{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-58%);
  color:var(--muted);
  opacity:.9;
  font-family:inherit;
  font-size:inherit;
  font-weight:500;
  line-height:1;
  pointer-events:none;
}
.money-wrap::before{ content:"R$"; }
.pct-wrap::before{ content:"%"; }
.money-wrap .money-input{ padding-left:38px; }
.pct-wrap .pct-input{ padding-left:28px; width:100%; max-width:100%; box-sizing:border-box; }

.product-cell{ position:relative; z-index:10; display:flex; align-items:center; gap:8px; }
.product-input-wrap{ overflow:visible; }
.product-input-wrap .suggestions{ z-index:99999 !important; }
.clearable-input{ position:relative; }
.clearable-input .product-name{ width:100%; box-sizing:border-box; padding-right:28px; }
.clearable-input .clear-btn{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
  padding:0;
  line-height:18px;
  font-size:16px;
  box-shadow:none;
}
.clearable-input .clear-btn:hover{ background:var(--surface-3); color:var(--text); }

.thumb-slot{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--surface-2);
  overflow:hidden;
  position:relative;
}
.thumb-slot .thumb-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  opacity:0;
  transition:opacity .12s ease;
}
.thumb-slot.thumb-empty::after{
  content:"x";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  font-size:15px;
  line-height:1;
  font-weight:800;
  opacity:.8;
  user-select:none;
  pointer-events:none;
}

#itemsTable td,
#itemsTable th{ vertical-align:top; }
.field label{ height:18px; display:flex; align-items:center; }

.balance-form{ display:flex; flex-direction:column; gap:10px; }
.balance-actions{ display:flex; justify-content:flex-end; }
.money-input{ width:160px; max-width:100%; }
.profit-row{ display:flex; align-items:center; gap:12px; justify-content:flex-start; }
.profit-row > button{ white-space:nowrap; }
.seed-table th:first-child,
.seed-table td:first-child{ width:35%; }
.seed-table th:last-child,
.seed-table td:last-child{ width:65%; }
.seed-table input[type="number"]{ max-width:220px; }

.move-grid,
.adjust-grid{
  display:grid;
  gap:12px;
  align-items:end;
  max-width:950px;
  margin-right:auto;
}
.move-grid{
  grid-template-columns:minmax(360px, 1fr) 130px 220px 220px;
}
.move-grid .move-comment{ grid-column:1 / span 2; }
.move-grid .move-btn{ grid-column:3; justify-self:start; }
.adjust-grid{
  grid-template-columns:minmax(360px, 1fr) 220px 160px 170px;
}
.adjust-grid .adjust-comment{ grid-column:1 / span 2; }
.adjust-grid .adjust-btn{ grid-column:3; justify-self:start; }

html[data-theme="dark"] [style*="background: #f8fafc"],
html[data-theme="dark"] [style*="background:#f8fafc"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"]{
  background:var(--surface-2) !important;
}
html[data-theme="dark"] [style*="color:#334155"],
html[data-theme="dark"] [style*="color: #334155"],
html[data-theme="dark"] [style*="color:#64748b"],
html[data-theme="dark"] [style*="color: #64748b"]{
  color:var(--muted) !important;
}
html[data-theme="dark"] [style*="border:1px solid #e2e8f0"],
html[data-theme="dark"] [style*="border: 1px solid #e2e8f0"]{
  border-color:var(--border) !important;
}

@keyframes softPop{
  from{ opacity:0; transform:translateY(4px) scale(.99); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

@media (max-width:1100px){
  .app-header-inner{ flex-wrap:wrap; }
  .main-nav{ order:3; flex-basis:100%; }
  .home-hero{ grid-template-columns:1fr; }
  .move-grid,
  .adjust-grid{ grid-template-columns:1fr 1fr; }
  .move-grid .move-comment,
  .adjust-grid .adjust-comment{ grid-column:1 / span 2; }
  .move-grid .move-btn,
  .adjust-grid .adjust-btn{ grid-column:1; }
  .form-grid{ grid-template-columns:repeat(2, minmax(220px, 1fr)); }
}

@media (max-width:650px){
  .app-main{ padding:14px; }
  .app-header{ padding:10px 12px; }
  .brand-link{ min-width:0; }
  .brand-caption{ display:none; }
  .header-actions{ width:100%; justify-content:flex-end; }
  .home-title{ font-size:27px; }
  .home-hero{ padding:18px; }
  .home-logo-panel{ min-height:170px; }
  .form-grid,
  .move-grid,
  .adjust-grid{ grid-template-columns:1fr; }
  .move-grid .move-comment,
  .adjust-grid .adjust-comment,
  .move-grid .move-btn,
  .adjust-grid .adjust-btn{ grid-column:auto; }
}