:root {
  --ink:#142735;
  --muted:#7d8991;
  --line:#e9edf0;
  --bg:#f6f8f8;
  --white:#fff;
  --green:#188b6d;
  --mint:#e4f6ef;
  --orange:#e78952;
  --peach:#fff0e7;
  --blue:#5366a9;
  --shadow:0 14px 45px rgba(23,43,54,.055)
}

* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'DM Sans',sans-serif;
  font-size:14px;
  -webkit-font-smoothing:antialiased
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2,h3,.brand {
  font-family:'Plus Jakarta Sans',sans-serif
}
a {
  text-decoration:none;
  color:inherit
}
button,input,textarea {
  font:inherit
}
button {
  cursor:pointer
}
svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex:none
}
.icon-library {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden
}
.app-shell {
  min-height:100vh;
  display:flex
}
.sidebar {
  width:248px;
  background:#fff;
  border-right:1px solid var(--line);
  padding:32px 18px;
  display:flex;
  flex-direction:column;
  flex:none;
  position:sticky;
  top:0;
  height:100vh
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:23px;
  font-weight:800;
  letter-spacing:-1.2px;
  padding:0 13px
}
.brand-mark {
  width:37px;
  height:37px;
  border-radius:11px;
  background:#e88c63;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 7px 16px rgba(232,140,99,.25);
  flex:none
}
.brand-mark svg {
  width:22px;
  height:22px;
  stroke-width:1.8
}
.brand-mark.brand-image {
  width:42px;
  height:42px;
  overflow:hidden;
  border-radius:11px;
  background:transparent;
  box-shadow:none
}
.brand-image img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain
}
.brand .brand-name {
  font-size:17px;
  letter-spacing:-.7px;
  white-space:nowrap
}
.brand-dot {
  color:#e88c63
}
.brand small {
  display:block;
  color:#a6afb4;
  font:700 8px 'DM Sans',sans-serif;
  letter-spacing:1.7px;
  margin-top:-1px
}
.side-caption {
  font-size:10px;
  letter-spacing:1.8px;
  color:#aab3b8;
  font-weight:800;
  margin:55px 15px 15px
}
.side-nav {
  display:grid;
  gap:5px
}
.side-nav a {
  display:flex;
  align-items:center;
  gap:13px;
  padding:13px 15px;
  border-radius:11px;
  color:#7a878d;
  font-weight:700;
  transition:.2s
}
.side-nav a svg {
  width:19px;
  height:19px
}
.side-nav a:hover,.side-nav a.active {
  background:#eaf5f0;
  color:#188b6d
}
.sidebar-bottom {
  margin-top:auto;
  padding:17px 15px;
  border-radius:13px;
  background:#f4f8f6;
  font-weight:700;
  font-size:12px
}
.sidebar-bottom small {
  display:block;
  color:#9aa6a8;
  font-weight:500;
  margin:6px 0 0 18px
}
.online-dot {
  display:inline-block;
  width:7px;
  height:7px;
  background:#40c89a;
  border-radius:50%;
  margin-right:8px;
  box-shadow:0 0 0 3px rgba(64,200,154,.16)
}
.main-content {
  min-width:0;
  flex:1
}
.topbar {
  height:78px;
  background:#fff;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:0 clamp(24px,4vw,66px)
}
.topbar-label {
  font-size:10px;
  color:#a9b3b8;
  letter-spacing:2px;
  font-weight:800;
  margin-right:24px
}
.topbar-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#e7f1ec;
  color:var(--green);
  font-size:11px;
  font-weight:800
}
.mobile-brand,.bottom-nav {
  display:none
}
.page-content {
  max-width:1260px;
  margin:auto;
  padding:40px clamp(24px,4vw,66px) 90px
}
.page-heading,.detail-heading,.section-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px
}
.eyebrow {
  font-size:10px;
  font-weight:800;
  letter-spacing:2.2px;
  color:var(--green);
  margin:0 0 11px
}
.page-heading h1,.detail-heading h1,.form-intro h1 {
  font-size:clamp(26px,2.6vw,36px);
  letter-spacing:-1.3px;
  line-height:1.2;
  margin-bottom:9px
}
.page-heading p:last-child,.detail-heading p:last-child,.section-heading p:last-child,.form-intro p:last-child {
  color:var(--muted);
  margin:0
}
.btn {
  min-height:44px;
  padding:0 17px;
  border-radius:10px;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:800;
  white-space:nowrap;
  transition:.2s
}
.btn svg {
  width:17px;
  height:17px
}
.btn:hover {
  transform:translateY(-2px)
}
.btn-dark {
  background:var(--ink);
  color:#fff
}
.btn-primary {
  background:var(--green);
  color:#fff;
  box-shadow:0 7px 16px rgba(24,139,109,.17)
}
.btn-outline {
  background:#fff;
  border-color:#dfe6e8;
  color:#52626a
}
.hero-card {
  margin-top:29px;
  min-height:260px;
  background:#102c39;
  border-radius:22px;
  position:relative;
  overflow:hidden;
  color:#fff;
  display:flex;
  box-shadow:var(--shadow)
}
.hero-content {
  position:relative;
  z-index:2;
  padding:34px 42px
}
.hero-label {
  display:inline-block;
  color:#b7d8ce;
  font-size:10px;
  font-weight:800;
  letter-spacing:1.8px;
  margin-bottom:15px
}
.hero-card h2 {
  font-size:clamp(27px,2.7vw,37px);
  line-height:1.22;
  letter-spacing:-1.4px;
  margin:0 0 11px
}
.hero-card em {
  color:#b5decf;
  font-style:normal
}
.hero-card p {
  color:#b0c0c7;
  margin:0 0 20px;
  max-width:440px
}
.hero-link {
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-weight:800;
  border-bottom:1px solid rgba(255,255,255,.65);
  padding-bottom:4px
}
.hero-link svg {
  width:16px;
  height:16px
}
.hero-glow {
  position:absolute;
  width:490px;
  height:490px;
  right:-70px;
  top:-160px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(62,156,132,.3),transparent 64%)
}
.hero-art {
  position:absolute;
  right:7%;
  top:0;
  width:310px;
  height:100%
}
.art-circle {
  position:absolute;
  border:1px solid rgba(158,210,191,.13);
  border-radius:50%
}
.art-circle-one {
  width:300px;
  height:300px;
  top:-25px;
  right:0
}
.art-circle-two {
  width:210px;
  height:210px;
  top:20px;
  right:44px
}
.art-box {
  position:absolute;
  border-radius:19px;
  transform:rotate(-13deg);
  box-shadow:0 24px 40px rgba(0,0,0,.18)
}
.art-box-back {
  width:133px;
  height:118px;
  background:#337a70;
  top:72px;
  right:88px;
  transform:rotate(14deg)
}
.art-box-front {
  width:145px;
  height:130px;
  background:#ed9a6a;
  top:96px;
  right:105px;
  display:grid;
  place-items:center
}
.art-box-front svg {
  width:72px;
  height:72px;
  color:rgba(255,255,255,.9);
  stroke-width:1.25
}
.art-spark {
  position:absolute;
  color:#d8b885;
  font-size:31px;
  right:38px;
  top:63px
}
.stat-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:17px;
  margin:20px 0 54px
}
.stat-card {
  background:#fff;
  border:1px solid var(--line);
  border-radius:17px;
  padding:22px 24px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.stat-icon {
  width:39px;
  height:39px;
  border-radius:11px;
  display:grid;
  place-items:center;
  margin-bottom:17px
}
.stat-icon svg {
  width:20px;
  height:20px
}
.stat-icon.indigo {
  background:#eaecfa;
  color:#6c79b7
}
.stat-icon.mint {
  background:#e4f7ed;
  color:#2ba27a
}
.stat-icon.orange {
  background:#fff0e7;
  color:#eb9868
}
.stat-card>span {
  font-size:12px;
  color:#839199;
  font-weight:700
}
.stat-card strong {
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:29px;
  letter-spacing:-1px;
  margin-top:3px
}
.stat-card small {
  font-size:11px;
  color:#aab5ba;
  margin-top:4px
}
.section-heading {
  margin-bottom:22px
}
.section-heading h2 {
  font-size:22px;
  letter-spacing:-.7px;
  margin:0 0 7px
}
.section-heading p:last-child {
  font-size:13px
}
.search-panel {
  display:flex;
  gap:10px;
  margin-bottom:18px
}
.search-box {
  background:#fff;
  border:1px solid #e3e9eb;
  border-radius:11px;
  height:48px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 15px;
  flex:1;
  box-shadow:var(--shadow)
}
.search-box svg {
  color:#9ca9af;
  width:19px;
  height:19px
}
.search-box input {
  border:0;
  outline:0;
  background:transparent;
  min-width:0;
  width:100%;
  color:var(--ink)
}
.search-box input::placeholder {
  color:#a6b1b5
}
.filter-row {
  display:flex;
  gap:9px;
  margin-bottom:18px;
  overflow:auto;
  scrollbar-width:none
}
.filter-chip {
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 15px;
  border:1px solid #e3e9eb;
  border-radius:100px;
  color:#7c8b92;
  background:#fff;
  font-size:12px;
  font-weight:800;
  transition:.2s
}
.filter-chip:hover,.filter-chip.active {
  background:#ddf1e8;
  color:var(--green);
  border-color:#ddf1e8
}
.filter-chip span {
  background:#fff;
  border-radius:20px;
  padding:1px 6px;
  font-size:10px
}
.items-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:15px
}
.item-card {
  min-width:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:17px;
  padding:20px;
  box-shadow:var(--shadow);
  transition:.2s
}
.item-card:hover {
  transform:translateY(-4px);
  box-shadow:0 20px 40px rgba(23,43,54,.1);
  border-color:#cbe8dc
}
.item-card-top {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  margin-bottom:19px
}
.item-icon {
  width:41px;
  height:41px;
  border-radius:12px;
  background:#f5eee8;
  color:#cc8d69;
  display:grid;
  place-items:center;
  flex:none
}
.item-icon svg {
  width:21px;
  height:21px
}
.status-badge {
  font-size:10px;
  font-weight:800;
  border-radius:100px;
  padding:7px 9px;
  white-space:nowrap
}
.status-badge span,.balance-status span {
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  margin-right:5px;
  vertical-align:1px
}
.status-ok {
  background:#e8f6ee;
  color:#27926f
}
.status-low {
  background:#fff1e9;
  color:#e58a56
}
.item-sku {
  font-size:10px;
  letter-spacing:1.2px;
  font-weight:800;
  color:#a7b1b8
}
.item-card h3 {
  font-size:16px;
  margin:7px 0 10px;
  letter-spacing:-.35px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.item-location {
  color:#92a0a6;
  font-size:12px;
  display:flex;
  align-items:center;
  gap:5px
}
.item-location svg {
  width:15px;
  height:15px
}
.item-card-footer {
  border-top:1px solid var(--line);
  margin-top:19px;
  padding-top:15px;
  display:flex;
  justify-content:space-between;
  align-items:center
}
.item-card-footer strong {
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:22px;
  letter-spacing:-.7px
}
.item-card-footer span:not(.item-card-arrow) {
  color:#9aa7ac;
  font-size:11px;
  margin-left:6px
}
.item-card-arrow {
  height:30px;
  width:30px;
  border-radius:50%;
  background:#eaf5ef;
  color:var(--green);
  display:grid;
  place-items:center
}
.item-card-arrow svg {
  width:16px;
  height:16px
}
.empty-state {
  grid-column:1/-1;
  text-align:center;
  background:#fff;
  border:1px dashed #dce5e6;
  border-radius:17px;
  padding:42px 20px
}
.empty-icon {
  width:55px;
  height:55px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#eaf5ef;
  color:var(--green);
  margin:0 auto 15px
}
.empty-state h3 {
  font-size:17px;
  margin:0 0 7px
}
.empty-state p {
  color:var(--muted);
  margin:0 auto 18px;
  max-width:350px
}
.pagination-wrap {
  margin-top:22px
}
.pagination-wrap nav {
  display:flex;
  justify-content:center
}
.pagination-wrap svg {
  width:15px;
  height:15px
}
.pagination-wrap p {
  font-size:12px;
  color:var(--muted)
}
.pagination-wrap a,.pagination-wrap span {
  font-size:12px
}
.back-link {
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#8b999f;
  font-weight:700;
  margin-bottom:29px
}
.back-link:hover {
  color:var(--green)
}
.back-link svg {
  width:17px;
  height:17px
}
.detail-heading {
  margin-bottom:26px
}
.detail-heading strong {
  color:#516770
}
.stock-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);
  gap:18px
}
.stock-balance {
  border-radius:20px;
  background:#133b43;
  color:#fff;
  padding:25px 29px;
  min-height:237px;
  position:relative;
  overflow:hidden
}
.balance-icon {
  height:40px;
  width:40px;
  border-radius:12px;
  background:rgba(255,255,255,.14);
  display:grid;
  place-items:center;
  margin-bottom:20px
}
.stock-balance p {
  font-size:10px;
  font-weight:800;
  letter-spacing:1.8px;
  color:#a9c9c4;
  margin:0 0 7px
}
.balance-number {
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:47px;
  font-weight:800;
  letter-spacing:-2px;
  line-height:1.1;
  position:relative;
  z-index:1
}
.balance-number span {
  font-size:18px;
  font-weight:600;
  letter-spacing:0;
  color:#a9c9c4
}
.balance-status {
  display:inline-block;
  color:#9de0bd;
  background:rgba(100,207,150,.14);
  padding:8px 11px;
  border-radius:100px;
  font-size:11px;
  font-weight:800;
  margin-top:18px;
  position:relative;
  z-index:1
}
.balance-status.is-low {
  color:#ffd3ac;
  background:rgba(232,148,86,.17)
}
.balance-decoration {
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  border:47px solid rgba(142,206,182,.08);
  right:-50px;
  bottom:-160px
}
.stock-facts {
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  padding:17px 20px;
  gap:5px;
  box-shadow:var(--shadow)
}
.fact {
  display:flex;
  gap:11px;
  align-items:center;
  padding:13px
}
.fact-icon {
  height:37px;
  width:37px;
  border-radius:10px;
  background:#f2f7f6;
  color:#58a48d;
  display:grid;
  place-items:center;
  flex:none
}
.fact-icon svg {
  width:18px;
  height:18px
}
.fact small {
  display:block;
  color:#9aa7ad;
  font-size:11px;
  margin-bottom:5px
}
.fact strong {
  font-size:13px
}
.transaction-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
  margin:18px 0 51px
}
.action-card {
  border:1px solid var(--line);
  background:#fff;
  border-radius:16px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  gap:13px;
  box-shadow:var(--shadow);
  transition:.2s
}
.action-card:hover {
  transform:translateY(-3px)
}
.action-card>span:first-child {
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:none
}
.action-card.action-in>span:first-child {
  background:#e5f5eb;
  color:#269b71
}
.action-card.action-out>span:first-child {
  background:#fff0e7;
  color:#e18c5f
}
.action-card strong,.action-card small {
  display:block
}
.action-card strong {
  font-size:13px;
  margin-bottom:4px
}
.action-card small {
  color:#9ca8ae;
  font-size:11px
}
.action-chevron {
  margin-left:auto;
  color:#a3b2b4;
  width:17px;
  height:17px
}
.history-stats {
  display:flex;
  gap:15px;
  margin-bottom:19px
}
.history-stats>div {
  background:#fff;
  border:1px solid var(--line);
  border-radius:13px;
  padding:13px 19px;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:180px;
  color:#96a3aa;
  font-size:11px;
  font-weight:700
}
.history-stat-icon {
  width:32px;
  height:32px;
  border-radius:9px;
  display:grid;
  place-items:center
}
.history-stat-icon svg {
  width:17px;
  height:17px
}
.history-stat-icon.in {
  background:#e5f5eb;
  color:#269b71
}
.history-stat-icon.out {
  background:#fff0e7;
  color:#e18c5f
}
.history-stats strong {
  display:block;
  color:var(--ink);
  font:800 17px 'Plus Jakarta Sans',sans-serif;
  margin-top:2px
}
.history-card {
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden
}
.history-table-wrap {
  overflow-x:auto
}
.history-table {
  width:100%;
  border-collapse:collapse;
  text-align:left;
  min-width:590px
}
.history-table th {
  background:#f9f4ef;
  color:#7c8b91;
  font-size:10px;
  letter-spacing:1.15px;
  text-transform:uppercase;
  padding:17px 20px;
  white-space:nowrap
}
.history-table td {
  border-top:1px solid #eef1f1;
  padding:17px 20px;
  font-size:13px
}
.history-table th:nth-child(n+3),.history-table td:nth-child(n+3) {
  text-align:right
}
.history-table td strong,.history-table td small {
  display:block
}
.history-table td small {
  color:#9da9ae;
  font-size:11px;
  margin-top:4px
}
.row-number,.dash {
  color:#a2afb4
}
.balance-cell {
  font-weight:800;
  font-family:'Plus Jakarta Sans',sans-serif
}
.number-in,.number-out {
  font-weight:800;
  border-radius:7px;
  padding:5px 8px
}
.number-in {
  color:#228e68;
  background:#e7f6ed
}
.number-out {
  color:#db8052;
  background:#fff0e7
}
.empty-state.compact {
  border:0;
  box-shadow:none;
  padding:25px
}
.form-page {
  max-width:760px;
  margin:auto
}
.form-intro {
  margin-bottom:25px
}
.form-intro p:last-child {
  line-height:1.5
}
.form-card {
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:30px;
  box-shadow:var(--shadow)
}
.form-card-heading {
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--line);
  padding-bottom:23px;
  margin-bottom:23px
}
.form-heading-icon {
  width:41px;
  height:41px;
  border-radius:11px;
  background:#e7f5ed;
  color:var(--green);
  display:grid;
  place-items:center
}
.form-card-heading h2 {
  font-size:16px;
  margin:0 0 4px
}
.form-card-heading p {
  color:#a0adb2;
  font-size:11px;
  margin:0
}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.field {
  min-width:0
}
.field.full {
  grid-column:1/-1
}
.field label {
  display:block;
  font-size:12px;
  font-weight:800;
  margin-bottom:9px
}
.field label span:not(.optional) {
  color:#e48b60
}
.field label .optional {
  color:#a8b3b8;
  font-weight:500
}
.field input,.field textarea {
  display:block;
  width:100%;
  border:1px solid #dfe7e8;
  background:#fff;
  border-radius:10px;
  outline:0;
  color:var(--ink);
  padding:0 14px;
  min-height:44px;
  transition:.2s
}
.field textarea {
  padding:12px 14px;
  resize:vertical
}
.field input:focus,.field textarea:focus {
  border-color:#65b69a;
  box-shadow:0 0 0 3px rgba(48,157,113,.1)
}
.field input::placeholder,.field textarea::placeholder {
  color:#adb8bc
}
.field-help {
  display:block;
  color:#9ba8ad;
  margin-top:7px;
  font-size:11px
}
.field-error {
  display:block;
  color:#d25e50;
  margin-top:7px;
  font-size:11px
}
.form-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  border-top:1px solid var(--line);
  margin-top:27px;
  padding-top:22px
}
.current-stock-strip {
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:14px;
  background:#edf7f1;
  border:1px solid #dcefe4;
  margin-bottom:16px
}
.current-stock-strip small,.current-stock-strip strong {
  display:block
}
.current-stock-strip small {
  color:#849e90;
  font-size:11px;
  margin-bottom:2px
}
.current-stock-strip strong {
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:17px
}
.strip-sku {
  margin-left:auto;
  color:#92aa9b;
  font-size:11px;
  font-weight:800
}
.type-options {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}
.type-option {
  position:relative;
  cursor:pointer
}
.type-option input {
  position:absolute;
  opacity:0;
  width:1px;
  height:1px
}
.type-option>span {
  display:grid;
  grid-template-columns:36px 1fr;
  column-gap:10px;
  align-items:center;
  border:1px solid #dfe7e8;
  border-radius:12px;
  padding:13px;
  min-height:68px;
  transition:.2s
}
.type-option svg {
  grid-row:1/3;
  width:34px;
  height:34px;
  padding:8px;
  border-radius:9px;
  background:#e6f5eb;
  color:#299b73
}
.type-option:nth-child(2) svg {
  background:#fff0e7;
  color:#e18c5f
}
.type-option strong {
  font-size:12px
}
.type-option small {
  font-size:10px;
  color:#a1adb1;
  margin-top:-6px
}
.type-option input:checked+span {
  border-color:#43ab82;
  background:#f5fbf7;
  box-shadow:0 0 0 2px rgba(44,161,112,.1)
}
.type-option:nth-child(2) input:checked+span {
  border-color:#e39a70;
  background:#fffaf6;
  box-shadow:0 0 0 2px rgba(227,154,112,.1)
}
.type-option input:focus-visible+span {
  outline:2px solid var(--green);
  outline-offset:2px
}
.movement-fields {
  margin-top:22px
}
.input-suffix {
  position:relative
}
.input-suffix input {
  padding-right:70px
}
.input-suffix span {
  position:absolute;
  right:13px;
  top:50%;
  transform:translateY(-50%);
  color:#9ba9ae;
  font-size:12px;
  font-weight:700
}
.flash {
  background:#e6f5ec;
  color:#228a67;
  padding:12px 15px;
  display:flex;
  align-items:center;
  gap:9px;
  border-radius:10px;
  font-weight:800;
  margin-bottom:22px
}
.flash-icon {
  width:23px;
  height:23px;
  border-radius:50%;
  background:#fff;
  display:grid;
  place-items:center
}
.flash-icon svg {
  width:14px;
  height:14px
}

@media(max-width:1100px) {
  .items-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.sidebar {
  width:220px
}
.hero-art {
  right:0
}
.hero-content {
  padding:30px
}
.stock-overview {
  grid-template-columns:1fr 1fr
}

}

@media(max-width:760px) {
  .sidebar {
  display:none
}
.topbar {
  height:63px;
  justify-content:space-between;
  padding:0 20px
}
.mobile-brand {
  display:flex;
  align-items:center;
  font:800 20px 'Plus Jakarta Sans',sans-serif;
  letter-spacing:-1px
}
.mobile-brand .brand-mark {
  width:31px;
  height:31px;
  margin-right:8px;
  border-radius:9px
}
.mobile-brand .brand-mark svg {
  width:19px;
  height:19px
}
.topbar-label {
  display:none
}
.topbar-avatar {
  width:31px;
  height:31px
}
.page-content {
  padding:25px 18px 105px
}
.page-heading h1,.detail-heading h1,.form-intro h1 {
  font-size:27px
}
.desktop-action {
  display:none
}
.hero-card {
  min-height:216px;
  margin-top:24px
}
.hero-content {
  padding:24px
}
.hero-card h2 {
  font-size:25px
}
.hero-card p {
  font-size:12px;
  max-width:260px;
  line-height:1.5
}
.hero-art {
  right:-90px;
  opacity:.65;
  transform:scale(.77);
  transform-origin:right center
}
.stat-grid {
  gap:9px;
  margin:13px 0 37px
}
.stat-card {
  padding:15px 12px;
  border-radius:13px
}
.stat-icon {
  width:31px;
  height:31px;
  margin-bottom:11px;
  border-radius:8px
}
.stat-icon svg {
  width:17px;
  height:17px
}
.stat-card>span {
  font-size:10px
}
.stat-card strong {
  font-size:22px
}
.stat-card small {
  font-size:9px;
  line-height:1.3
}
.section-heading h2 {
  font-size:20px
}
.section-heading p:last-child {
  font-size:11px
}
.items-grid {
  grid-template-columns:1fr 1fr;
  gap:11px
}
.item-card {
  padding:14px;
  border-radius:14px
}
.item-icon {
  width:33px;
  height:33px;
  border-radius:9px
}
.item-icon svg {
  width:18px;
  height:18px
}
.status-badge {
  font-size:9px;
  padding:5px 7px
}
.item-card-top {
  margin-bottom:15px
}
.item-card h3 {
  font-size:14px;
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  min-height:36px;
  line-height:1.3
}
.item-card-footer strong {
  font-size:18px
}
.item-card-footer span:not(.item-card-arrow) {
  font-size:9px;
  margin-left:3px
}
.item-card-arrow {
  height:25px;
  width:25px
}
.item-card-arrow svg {
  width:14px;
  height:14px
}
.bottom-nav {
  position:fixed;
  display:flex;
  z-index:20;
  bottom:0;
  left:0;
  right:0;
  justify-content:space-around;
  background:rgba(255,255,255,.98);
  border-top:1px solid var(--line);
  padding:9px 10px calc(8px + env(safe-area-inset-bottom));
  box-shadow:0 -8px 25px rgba(28,54,59,.07)
}
.bottom-nav a {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  min-width:72px;
  color:#9baaaf;
  font-size:10px;
  font-weight:800
}
.bottom-nav a svg {
  width:20px;
  height:20px
}
.bottom-nav a.active {
  color:var(--green)
}
.detail-heading {
  align-items:start
}
.stock-overview {
  grid-template-columns:1fr
}
.stock-balance {
  min-height:220px
}
.stock-facts {
  padding:10px
}
.transaction-actions {
  margin:15px 0 39px
}
.action-card {
  padding:12px;
  gap:8px
}
.action-card>span:first-child {
  width:34px;
  height:34px;
  border-radius:9px
}
.action-card>span:first-child svg {
  width:18px;
  height:18px
}
.action-card strong {
  font-size:11px
}
.action-card small {
  font-size:9px;
  line-height:1.2
}
.action-chevron {
  display:none
}
.form-card {
  padding:22px
}
.form-grid {
  gap:16px
}
.history-stats>div {
  min-width:0;
  flex:1;
  padding:10px
}
.history-card {
  border-radius:12px
}

}

@media(max-width:480px) {
  .section-add {
  font-size:0;
  width:40px;
  min-width:40px;
  padding:0;
  height:40px
}
.section-add svg {
  width:19px;
  height:19px
}
.search-submit {
  min-height:48px
}
.hero-art {
  right:-126px;
  opacity:.43
}
.hero-card p {
  max-width:220px
}
.stock-facts {
  grid-template-columns:1fr 1fr
}
.fact {
  padding:8px 4px;
  gap:7px
}
.fact-icon {
  width:30px;
  height:30px
}
.fact-icon svg {
  width:15px;
  height:15px
}
.fact strong {
  font-size:11px
}
.fact small {
  font-size:9px
}
.detail-heading .btn {
  font-size:0;
  width:42px;
  height:42px;
  padding:0
}
.detail-heading .btn svg {
  width:18px;
  height:18px
}
.history-stats>div {
  font-size:10px
}
.history-stats strong {
  font-size:14px
}
.form-grid {
  grid-template-columns:1fr
}
.field.full {
  grid-column:auto
}
.type-options {
  gap:8px
}
.type-option>span {
  padding:9px;
  column-gap:6px;
  grid-template-columns:30px 1fr
}
.type-option svg {
  width:29px;
  height:29px
}
.type-option strong {
  font-size:11px
}
.form-actions .btn {
  flex:1;
  padding:0 10px;
  font-size:12px
}

}

.stock-facts,.transaction-actions {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.fact>div,.action-card>span:nth-child(2),.detail-heading>div {
  min-width:0
}
.fact strong {
  overflow-wrap:anywhere
}

.value-hero {
  min-height:238px
}
.value-hero .hero-content {
  padding-top:37px
}
.value-hero h2 {
  font-size:clamp(30px,3.3vw,45px);
  white-space:nowrap
}
.value-hero p {
  max-width:470px
}
.overview-stats {
  grid-template-columns:repeat(4,minmax(0,1fr))
}
.overview-stats .stat-card {
  min-width:0
}
.overview-stats .stat-card strong {
  font-size:25px
}
.section-toolbar {
  display:flex;
  justify-content:flex-end;
  margin:-5px 0 14px
}
.text-action {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--green);
  font-size:12px;
  font-weight:800
}
.text-action svg {
  width:16px;
  height:16px
}
.stock-list {
  display:grid;
  gap:10px
}
.stock-list-row {
  display:grid;
  grid-template-columns:70px minmax(160px,1.5fr) minmax(85px,.7fr) minmax(110px,.9fr) minmax(125px,1fr) 30px;
  align-items:center;
  gap:17px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:15px;
  padding:13px 18px;
  box-shadow:var(--shadow);
  transition:.2s;
  min-width:0
}
.stock-list-row:hover {
  border-color:#b6ddce;
  transform:translateY(-2px);
  box-shadow:0 15px 30px rgba(23,43,54,.09)
}
.product-photo {
  display:grid;
  place-items:center;
  width:70px;
  height:70px;
  overflow:hidden;
  background:#f3f5f3;
  border-radius:11px;
  color:#bd9980;
  flex:none
}
.product-photo img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
.product-photo>svg {
  width:29px;
  height:29px
}
.product-main {
  min-width:0;
  display:flex;
  align-items:flex-start;
  flex-direction:column;
  gap:5px
}
.product-main>strong {
  font:800 14px 'Plus Jakarta Sans',sans-serif;
  line-height:1.3
}
.product-main .item-sku {
  font-size:10px;
  letter-spacing:.5px;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis
}
.product-main .status-badge {
  font-size:9px;
  padding:5px 8px
}
.list-metric {
  min-width:0
}
.list-metric small {
  display:block;
  color:#a4b0b4;
  font-size:9px;
  letter-spacing:1.2px;
  font-weight:800;
  margin-bottom:6px
}
.list-metric strong {
  font:800 13px 'Plus Jakarta Sans',sans-serif;
  white-space:nowrap
}
.list-metric em {
  font:600 11px 'DM Sans',sans-serif;
  color:#97a4aa;
  font-style:normal
}
.stock-list-row>.item-card-arrow {
  width:28px;
  height:28px
}
.detail-heading {
  justify-content:flex-start
}
.detail-heading .detail-photo {
  width:77px;
  height:77px;
  margin-right:2px
}
.detail-heading .detail-title {
  flex:1
}
.detail-heading .btn {
  margin-left:auto
}
.valuation-strip {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:15px;
  padding:17px 23px;
  margin-top:16px;
  box-shadow:var(--shadow)
}
.valuation-strip div {
  min-width:0
}
.valuation-strip small {
  display:block;
  color:#a0acb1;
  font-size:10px;
  letter-spacing:1.1px;
  font-weight:800;
  margin-bottom:7px
}
.valuation-strip strong {
  font:800 17px 'Plus Jakarta Sans',sans-serif
}
.valuation-strip>span {
  color:#a5b1b6;
  font-size:12px;
  font-weight:800;
  white-space:nowrap
}
.valuation-strip>div:last-child {
  text-align:right
}
.valuation-strip>div:last-child strong {
  color:var(--green)
}
.image-upload {
  display:flex;
  align-items:center;
  gap:16px;
  padding:12px;
  border:1px dashed #d9e3e3;
  border-radius:12px;
  background:#fbfcfc
}
.upload-preview {
  width:76px;
  height:76px
}
.image-upload>div {
  min-width:0;
  flex:1
}
.field input[type=file] {
  border:0;
  padding:9px 0;
  min-height:0;
  width:100%;
  font-size:12px
}
.field select {
  display:block;
  width:100%;
  border:1px solid #dfe7e8;
  background:#fff;
  border-radius:10px;
  outline:0;
  color:var(--ink);
  padding:0 14px;
  min-height:44px
}
.field select:focus {
  border-color:#65b69a;
  box-shadow:0 0 0 3px rgba(48,157,113,.1)
}
.input-prefix {
  position:relative
}
.input-prefix span {
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#819097;
  font-weight:800
}
.input-prefix input {
  padding-left:43px
}
.movement-type-field {
  margin-top:22px
}
.global-summary {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:15px;
  margin:29px 0 47px
}
.global-summary>div {
  background:#fff;
  border:1px solid var(--line);
  border-radius:17px;
  padding:21px;
  box-shadow:var(--shadow)
}
.global-summary .history-stat-icon {
  width:38px;
  height:38px;
  margin-bottom:16px
}
.history-stat-icon.value {
  background:#eaf0fc;
  color:#6376b5
}
.global-summary small {
  display:block;
  font-size:10px;
  color:#9eacb1;
  letter-spacing:1.2px;
  font-weight:800;
  margin-bottom:6px
}
.global-summary strong {
  font:800 23px 'Plus Jakarta Sans',sans-serif
}
.global-heading {
  margin-bottom:22px
}
.movement-list {
  display:grid;
  gap:9px
}
.movement-row {
  display:flex;
  align-items:center;
  gap:15px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:13px;
  padding:15px 18px;
  box-shadow:var(--shadow);
  transition:.2s
}
.movement-row:hover {
  transform:translateY(-2px);
  border-color:#cbe8dc
}
.movement-type-icon {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  flex:none
}
.movement-type-icon.in {
  background:#e5f5eb;
  color:#269b71
}
.movement-type-icon.out {
  background:#fff0e7;
  color:#e18c5f
}
.movement-info {
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
  flex:1
}
.movement-info strong {
  font:800 13px 'Plus Jakarta Sans',sans-serif
}
.movement-info small,.movement-info>span {
  font-size:11px;
  color:#9caaaf;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.movement-numbers {
  text-align:right;
  white-space:nowrap
}
.movement-numbers strong {
  display:block;
  font:800 13px 'Plus Jakarta Sans',sans-serif;
  background:none;
  padding:0
}
.movement-numbers small {
  display:block;
  color:#9ba8ad;
  font-size:10px;
  margin-top:5px
}
.row-chevron {
  width:16px;
  height:16px;
  color:#a4b2b7
}

@media(max-width:1200px) {
  .stock-list-row {
  grid-template-columns:64px minmax(135px,1.3fr) minmax(75px,.6fr) minmax(110px,1fr) 28px;
  gap:12px
}
.stock-list-row .price-metric {
  display:none
}
.stock-list-row .product-photo {
  width:64px;
  height:64px
}
.overview-stats .stat-card strong {
  font-size:21px
}

}

@media(max-width:900px) {
  .overview-stats {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.stock-list-row {
  grid-template-columns:62px minmax(130px,1fr) minmax(75px,.6fr) minmax(115px,.8fr) 28px
}

}

@media(max-width:760px) {
  .value-hero {
  min-height:205px
}
.value-hero .hero-content {
  padding:28px 24px
}
.value-hero h2 {
  font-size:30px
}
.overview-stats {
  gap:9px;
  margin:13px 0 35px
}
.overview-stats .stat-card strong {
  font-size:22px
}
.section-toolbar {
  justify-content:flex-start;
  margin:0 0 16px
}
.stock-list-row {
  grid-template-columns:62px minmax(0,1fr) auto;
  gap:11px;
  padding:12px
}
.stock-list-row .product-photo {
  width:62px;
  height:62px
}
.stock-list-row .list-metric {
  display:none
}
.stock-list-row .value-metric {
  display:block;
  grid-column:2;
  grid-row:2
}
.stock-list-row .value-metric small {
  display:none
}
.stock-list-row .value-metric strong {
  font-size:12px;
  color:var(--green)
}
.stock-list-row .item-card-arrow {
  grid-column:3;
  grid-row:1/3
}
.product-main .status-badge {
  display:none
}
.product-main>strong {
  font-size:13px
}
.detail-heading .detail-photo {
  width:60px;
  height:60px
}
.detail-heading h1 {
  font-size:23px
}
.valuation-strip strong {
  font-size:14px
}
.global-summary {
  gap:9px;
  margin:21px 0 36px
}
.global-summary>div {
  padding:14px
}
.global-summary strong {
  font-size:15px
}
.global-summary small {
  font-size:9px;
  line-height:1.3
}
.movement-row {
  padding:12px;
  gap:10px
}
.movement-numbers strong {
  font-size:12px
}

}

@media(max-width:480px) {
  .value-hero h2 {
  font-size:26px;
  white-space:normal
}
.value-hero p {
  max-width:270px
}
.overview-stats .stat-card strong {
  font-size:20px
}
.stock-list-row .product-photo {
  width:58px;
  height:58px
}
.stock-list-row {
  grid-template-columns:58px minmax(0,1fr) 25px
}
.detail-heading .detail-photo {
  width:50px;
  height:50px
}
.detail-heading h1 {
  font-size:19px
}
.detail-heading .eyebrow {
  font-size:8px;
  margin-bottom:5px
}
.detail-heading p:last-child {
  font-size:11px
}
.valuation-strip {
  gap:8px;
  padding:14px
}
.valuation-strip small {
  font-size:8px
}
.valuation-strip strong {
  font-size:12px
}
.valuation-strip>span {
  font-size:10px
}
.global-summary {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.global-summary>div:last-child {
  grid-column:1/-1
}
.global-summary strong {
  font-size:18px
}
.movement-info>span {
  display:none
}
.movement-numbers small {
  font-size:9px
}
.row-chevron {
  display:none
}
.history-section .section-heading .text-action {
  font-size:0
}
.history-section .section-heading .text-action svg {
  width:18px;
  height:18px
}
.image-upload {
  gap:10px
}
.upload-preview {
  width:60px;
  height:60px
}

}

.mobile-product-metrics {
  display:none
}

@media(max-width:760px) {
  .stock-list-row {
  grid-template-columns:62px minmax(0,1fr) 28px
}
.stock-list-row .value-metric {
  display:none
}
.mobile-product-metrics {
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  font-size:10px;
  font-weight:800;
  margin-top:2px
}
.mobile-product-metrics>span {
  color:#526c74;
  background:#edf2f2;
  border-radius:5px;
  padding:3px 6px
}
.mobile-product-metrics>span.low {
  color:#cc794d;
  background:#fff0e7
}
.mobile-product-metrics b {
  color:var(--green);
  font-size:11px
}
.stock-list-row .item-card-arrow {
  grid-row:1;
  grid-column:3
}

}

/* Shared layout and controls */
body { line-height: 1.5; }
button, input, select, textarea { font-family: inherit; }
svg { display: inline-block; vertical-align: middle; }
:focus-visible { outline: 3px solid #63bda2; outline-offset: 4px; }
.page-content { width: 100%; }
.page-heading > div, .section-heading > div { min-width: 0; }
h1, h2, h3, .fact strong { overflow-wrap: anywhere; }
.eyebrow { line-height: 1.4; }
.page-heading p:last-child, .form-intro p:last-child { line-height: 1.65; }
.field label { font-size: 13px; }
.field input, .field select { min-height: 48px; }
.field input, .field select, .field textarea { line-height: 1.5; }
.field-help, .field-error { font-size: 12px; line-height: 1.5; }
.field input::placeholder, .field textarea::placeholder { color: #8e9ba3; }
.field .type-option > span { color: var(--ink); }
.type-option small { margin-top: 0; line-height: 1.5; }
.type-option { margin: 0; }
.type-options { min-width: 0; }
.form-card { padding: 30px; }
.form-card-heading p { font-size: 12px; }
.form-heading-icon { flex-shrink: 0; }
.image-upload { padding: 16px; }
.image-upload input::file-selector-button {
    border: 1px solid #dce6e3;
    border-radius: 8px;
    background: white;
    color: var(--green);
    padding: 9px 12px;
    font: 700 12px 'DM Sans', sans-serif;
    margin-right: 8px;
    cursor: pointer;
}
.type-option input:checked + span { background: #ecf8f1; }
.stat-card small, .list-metric small { color: #78898f; }
.stock-list-row { grid-template-columns: 68px minmax(0,1.5fr) minmax(70px,.65fr) minmax(100px,.9fr) minmax(120px,1fr) 28px; }
.stock-list-row .product-photo { width: 68px; height: 68px; }
.product-main > strong { font-size: 15px; }
.product-main .item-sku { color: #83939a; }
.list-metric strong { white-space: normal; overflow-wrap: anywhere; }
.value-hero .hero-content { max-width: 75%; }
.value-hero h2 { white-space: normal; overflow-wrap: anywhere; }
.pagination { display:flex; align-items:center; gap:12px; justify-content:center; }
.page-button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:0 14px; background:#fff; border:1px solid var(--line); border-radius:9px; font-weight:700; color:var(--green); }
.page-button.disabled { color:#9faeb2; background:#f0f3f3; }
.page-position { color:#73868e; white-space:nowrap; }
@media (max-width: 1100px) and (min-width: 761px) {
    .stock-list-row { grid-template-columns:60px minmax(0,1fr) 100px 115px; gap:12px; }
    .stock-list-row .price-metric, .stock-list-row > .item-card-arrow { display:none; }
    .stock-list-row .product-photo { width:60px; height:60px; }
    .global-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .global-summary > div:last-child { grid-column:1/-1; }
    .stock-overview { grid-template-columns:1fr; }
    .detail-heading { flex-wrap:wrap; }
}
@media (max-width: 760px) {
    .topbar { position:sticky; top:0; z-index:30; height:64px; background:rgba(255,255,255,.97); }
    .page-content { padding:24px 18px calc(100px + env(safe-area-inset-bottom)); }
    .bottom-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:center; padding:8px 8px calc(8px + env(safe-area-inset-bottom)); }
    .bottom-nav a { min-width:0; min-height:48px; justify-content:center; font-size:11px; gap:4px; border-radius:10px; }
    .bottom-nav a.active { background:#edf7f2; }
    .bottom-nav a svg { display:block; width:21px; height:21px; }
    .page-heading h1, .form-intro h1 { font-size:27px; letter-spacing:-.9px; }
    .page-heading p:last-child, .form-intro p:last-child { font-size:13px; }
    .back-link { margin-bottom:20px; min-height:32px; font-size:12px; }
    .form-card { padding:22px; border-radius:18px; }
    .form-grid { grid-template-columns:minmax(0,1fr); gap:19px; }
    .field.full { grid-column:auto; }
    .field input, .field select, .field textarea { font-size:16px; min-width:0; max-width:100%; }
    .field input[type=file] { font-size:12px; }
    .field-help, .field-error { font-size:11px; }
    .image-upload { padding:12px; gap:12px; align-items:center; }
    .upload-preview { width:66px; height:66px; }
    .form-actions .btn { min-height:46px; font-size:12px; }
    .form-actions { display:grid; grid-template-columns:.7fr 1.3fr; }
    .form-card-heading { padding-bottom:18px; margin-bottom:22px; }
    .type-option > span { grid-template-columns:30px minmax(0,1fr); column-gap:8px; padding:12px 10px; }
    .type-option strong { font-size:12px; }
    .type-option small { font-size:10px; }
    .type-option svg { width:30px; height:30px; }
    .value-hero { min-height:190px; margin-top:23px; }
    .value-hero .hero-content { max-width:100%; width:100%; padding:25px; }
    .value-hero p { max-width:82%; line-height:1.6; font-size:12px; }
    .value-hero .hero-art { opacity:.18; right:-100px; }
    .value-hero h2 { font-size:29px; }
    .hero-label { font-size:9px; letter-spacing:1.5px; }
    .overview-stats .stat-card { padding:14px 16px; position:relative; }
    .overview-stats .stat-icon { position:absolute; top:14px; right:14px; width:28px; height:28px; }
    .overview-stats .stat-card > span { margin-top:3px; font-size:11px; }
    .overview-stats .stat-card strong { margin-top:10px; font-size:24px; }
    .overview-stats .stat-card small { font-size:10px; }
    .section-heading { align-items:center; gap:12px; }
    .section-heading p:last-child { font-size:12px; }
    .section-add { width:44px; height:44px; min-width:44px; padding:0; font-size:0; }
    .stock-list-row { grid-template-columns:64px minmax(0,1fr) 25px; padding:13px; gap:12px; }
    .stock-list-row .product-photo { width:64px; height:64px; }
    .stock-list-row .list-metric { display:none; }
    .product-main > strong { font-size:14px; line-height:1.4; }
    .product-main .item-sku { font-size:10px; letter-spacing:.1px; }
    .mobile-product-metrics { gap:6px; }
    .mobile-product-metrics b { font-size:11px; }
    .mobile-product-metrics > span { font-size:11px; }
    .detail-heading { gap:12px; align-items:center; }
    .detail-heading h1 { font-size:23px; }
    .detail-heading .detail-photo { width:58px; height:58px; }
    .detail-heading .btn { min-width:42px; width:42px; padding:0; font-size:0; }
    .detail-heading .eyebrow { font-size:8px; letter-spacing:1.4px; margin-bottom:5px; }
    .detail-heading p:last-child { font-size:11px; }
    .stock-balance { padding:23px; min-height:210px; }
    .stock-facts { padding:12px; gap:10px; }
    .fact { padding:6px 2px; }
    .fact small { font-size:10px; }
    .fact strong { font-size:12px; }
    .valuation-strip { flex-wrap:wrap; padding:16px; }
    .valuation-strip small { font-size:9px; }
    .valuation-strip strong { font-size:15px; }
    .valuation-strip > span { display:none; }
    .action-card { min-height:76px; }
    .action-card strong { font-size:12px; }
    .action-card small { font-size:10px; }
    .global-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .global-summary > div:last-child { grid-column:1/-1; display:grid; grid-template-columns:38px 1fr; column-gap:12px; }
    .global-summary > div:last-child .history-stat-icon { grid-row:1/3; margin:0; }
    .global-summary > div:last-child small { margin:0; }
    .global-summary > div:last-child strong { font-size:22px; }
    .movement-row { padding:14px 12px; }
    .movement-info strong { font-size:13px; }
    .movement-numbers strong { font-size:12px; }
    .movement-numbers small { font-size:10px; }
}
@media (max-width: 480px) {
    .page-content { padding-inline:16px; }
    .form-card { padding:19px 16px; }
    .form-intro { margin-bottom:20px; }
    .image-upload { flex-wrap:wrap; }
    .image-upload > div { flex-basis:160px; }
    .detail-heading h1 { font-size:20px; }
    .valuation-strip strong { font-size:13px; }
    .history-table { min-width:0; table-layout:fixed; }
    .history-table th, .history-table td { padding:14px 7px; font-size:11px; }
    .history-table th { font-size:9px; letter-spacing:.25px; }
    .history-table th:first-child, .history-table td.row-number { display:none; }
    .history-table th:nth-child(2) { width:45%; }
    .history-table td strong, .history-table td small { overflow-wrap:anywhere; }
    .history-table td small { font-size:10px; }
    .history-table .number-in, .history-table .number-out { padding:4px; }
    .history-table .empty-state { padding:20px 8px; }
    .movement-type-icon { width:32px; height:32px; }
    .row-chevron { display:none; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { transition:none !important; }
}

/* Transactions overview */
.movements-page { max-width:1050px; margin:0 auto; }
.movements-page svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.movements-heading { margin-bottom:0; }
.movements-page .global-summary { gap:12px; margin:20px 0 34px; }
.movements-page .movement-summary-card { display:flex; align-items:center; gap:14px; min-width:0; min-height:104px; padding:17px 18px; }
.movements-page .movement-summary-card .history-stat-icon { flex:0 0 38px; margin:0; }
.movement-summary-card>span:last-child { min-width:0; }
.movements-page .movement-summary-card small { margin-bottom:5px; letter-spacing:1px; text-transform:uppercase; }
.movements-page .movement-summary-card strong { display:block; overflow-wrap:anywhere; font-size:21px; line-height:1.2; }
.movement-history-heading { align-items:flex-end; margin-bottom:16px; }
.movement-history-heading h2 { margin-bottom:5px; }
.movements-page .section-add { flex:none; }
.movement-search-panel { margin-bottom:11px; }
.movement-filter-row { margin-bottom:15px; }

@media(max-width:760px) {
  .movements-heading h1 { margin-bottom:5px; }
  .movements-page .global-summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:15px 0 27px; }
  .movements-page .movement-summary-card,.movements-page .global-summary>div:last-child { display:flex; grid-column:auto; grid-template-columns:none; min-height:82px; gap:9px; padding:12px; border-radius:13px; }
  .movements-page .movement-summary-card.is-value { grid-column:1/-1; min-height:70px; }
  .movements-page .movement-summary-card .history-stat-icon,.movements-page .global-summary>div:last-child .history-stat-icon { flex:0 0 34px; width:34px; height:34px; margin:0; }
  .movements-page .movement-summary-card small,.movements-page .global-summary>div:last-child small { margin-bottom:4px; font-size:8px; letter-spacing:.8px; }
  .movements-page .movement-summary-card strong,.movements-page .global-summary>div:last-child strong { font-size:17px; line-height:1.18; }
  .movements-page .movement-summary-card.is-value strong { font-size:20px; }
  .movement-history-heading { align-items:center; gap:10px; margin-bottom:13px; }
  .movement-history-heading h2 { margin-bottom:4px; font-size:21px; }
  .movement-history-heading p:last-child { max-width:360px; font-size:10px; line-height:1.45; }
  .movements-page .section-add { display:grid; place-items:center; width:42px; min-width:42px; height:42px; padding:0; font-size:0; }
  .movements-page .section-add span { display:none; }
  .movements-page .section-add svg { width:18px; height:18px; }
  .movement-search-panel { display:grid; grid-template-columns:minmax(0,1fr) 72px; gap:7px; margin-bottom:10px; }
  .movement-search-panel .search-box { min-width:0; height:43px; padding:0 12px; gap:9px; border-radius:10px; }
  .movement-search-panel .search-box svg { flex:0 0 17px; width:17px; height:17px; }
  .movement-search-panel .search-box input { font-size:12px; }
  .movement-search-panel .search-submit { min-height:43px; padding:0 12px; }
  .movement-filter-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-bottom:15px; overflow:visible; }
  .movement-filter-row .filter-chip { justify-content:center; min-width:0; padding:9px 5px; font-size:10px; }
  .movements-page .movement-list { gap:7px; }
  .movements-page .movement-row { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:9px; padding:11px; border-radius:11px; }
  .movements-page .movement-info strong { font-size:11px; line-height:1.35; }
  .movements-page .movement-info small { font-size:9px; }
  .movements-page .movement-info>span { display:none; }
  .movements-page .movement-numbers strong { font-size:10px; }
  .movements-page .movement-numbers small { margin-top:3px; font-size:8px; }
  .movements-page .row-chevron { display:none; }
}

.stock-card-actions {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:22px;
}
.stock-card-actions h1 {
    margin:6px 0 0;
    font-size:30px;
}
.stock-card-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.stock-card {
    overflow:hidden;
    background:#fff;
    border:1px solid #d6dde3;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(16,38,53,.05);
}
.stock-card h2 {
    margin:0;
    padding:20px 24px;
    text-align:center;
    font-size:20px;
}
.stock-card-details {
    display:grid;
    gap:5px;
    margin:0;
    padding:0 24px 24px;
}
.stock-card-details div {
    display:grid;
    grid-template-columns:125px minmax(0,1fr);
    gap:10px;
}
.stock-card-details dt {
    font-weight:700;
}
.stock-card-details dt::after {
    content:':';
    float:right;
}
.stock-card-details dd {
    margin:0;
    overflow-wrap:anywhere;
}
.stock-card-table-wrap {
    overflow-x:auto;
}
.stock-card-table {
    width:100%;
    border-collapse:collapse;
    color:#192631;
    font-variant-numeric:tabular-nums;
}
.stock-card-table th,
.stock-card-table td {
    border:1px solid #7b8389;
    padding:10px 12px;
    text-align:center;
}
.stock-card-table th:first-child,
.stock-card-table td:first-child {
    border-left:0;
    width:60px;
}
.stock-card-table th:last-child,
.stock-card-table td:last-child {
    border-right:0;
}
.stock-card-table thead th {
    background:#ffebe2;
    font-weight:700;
}
.stock-card-table td:nth-child(2) {
    text-align:left;
}
.stock-card-table .stock-card-empty {
    padding:30px 12px;
    text-align:center;
    color:#657581;
}
.stock-card-balance {
    margin:0;
    padding:16px 24px;
    text-align:right;
}
@media (max-width:760px) {
    .stock-card-actions {
        display:block;
    }
    .stock-card-actions h1 {
        font-size:24px;
    }
    .stock-card-buttons {
        margin-top:16px;
    }
    .stock-card-buttons .btn {
        flex:1 1 auto;
        min-height:42px;
        padding:8px 10px;
        font-size:12px;
    }
    .stock-card h2 {
        padding:16px;
    }
    .stock-card-details {
        padding:0 14px 20px;
        font-size:13px;
    }
    .stock-card-details div {
        grid-template-columns:100px minmax(0,1fr);
    }
    .stock-card-table th,
    .stock-card-table td {
        padding:9px 6px;
        font-size:11px;
    }
    .stock-card-table th:first-child,
    .stock-card-table td:first-child {
        width:34px;
    }
    .stock-card-balance {
        padding:14px;
        font-size:13px;
    }
}

/* Stock item detail */
.stock-detail-page .back-link { margin-bottom:24px; }
.stock-detail-hero { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:28px 30px; border:1px solid #e0e8e7; border-radius:20px; background:linear-gradient(120deg,#fff 0%,#fff 62%,#eef8f3 100%); box-shadow:0 12px 38px rgba(22,48,56,.055); }
.stock-detail-identity { display:flex; align-items:center; min-width:0; gap:18px; }
.stock-detail-photo { display:grid; place-items:center; flex:0 0 76px; width:76px; height:76px; overflow:hidden; border-radius:17px; background:#edf7f2; color:var(--green); }
.stock-detail-photo img { width:100%; height:100%; object-fit:cover; }
.stock-detail-photo svg { width:30px; height:30px; }
.stock-detail-identity h1 { margin:0 0 10px; font-size:clamp(25px,2.7vw,36px); line-height:1.2; letter-spacing:-1.2px; overflow-wrap:anywhere; }
.stock-detail-identity .eyebrow { margin-bottom:8px; }
.stock-detail-meta { display:flex; flex-wrap:wrap; gap:7px; }
.stock-detail-meta span { padding:5px 9px; border:1px solid #e1e9e7; border-radius:7px; background:#fff; color:#6f7f85; font-size:10px; font-weight:700; }
.stock-detail-balance { display:flex; align-items:center; flex:0 0 auto; min-width:250px; gap:14px; padding:17px 19px; border:1px solid #d5ebe2; border-radius:16px; background:rgba(255,255,255,.88); }
.stock-balance-icon,.section-heading-icon { display:grid; place-items:center; flex:0 0 auto; width:40px; height:40px; border-radius:11px; background:#e5f5ed; color:var(--green); }
.stock-detail-balance small { display:block; margin-bottom:2px; color:#81928e; font-size:9px; font-weight:800; letter-spacing:1.3px; }
.stock-detail-balance strong { display:block; color:#123b32; font:800 25px 'Plus Jakarta Sans',sans-serif; }
.stock-detail-balance strong span { font-size:13px; }
.stock-detail-balance p { margin:2px 0 0; color:#8a9996; font-size:10px; }
.stock-detail-page .stock-card-buttons { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0 26px; }
.stock-action { display:grid; grid-template-columns:40px minmax(0,1fr); column-gap:12px; align-items:center; min-width:0; min-height:76px; padding:14px; border:1px solid #e0e7e7; border-radius:14px; background:#fff; transition:.2s; }
.stock-action:hover { border-color:#9fc5b7; transform:translateY(-2px); box-shadow:0 10px 24px rgba(20,48,56,.07); }
.stock-action>span { display:grid; place-items:center; grid-row:1/3; width:40px; height:40px; border-radius:11px; }
.stock-action strong,.stock-action small { min-width:0; overflow-wrap:anywhere; }
.stock-action strong { align-self:end; font-size:13px; }
.stock-action small { align-self:start; margin-top:2px; color:#8a989e; font-size:10px; }
.stock-action-in>span { background:#e0f4eb; color:#14825f; }
.stock-action-out>span { background:#e8eef2; color:#173140; }
.stock-action-secondary>span { background:#fff0e8; color:#d67a50; }
.stock-detail-content { display:grid; grid-template-columns:minmax(240px,300px) minmax(0,1fr); align-items:start; gap:18px; }
.stock-info-card,.stock-detail-page .stock-card { overflow:hidden; border:1px solid #e0e7e8; border-radius:18px; background:#fff; box-shadow:0 10px 30px rgba(16,38,53,.04); }
.stock-section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:20px 22px; border-bottom:1px solid #edf0f1; }
.stock-section-heading>div { display:flex; align-items:center; min-width:0; gap:12px; }
.section-heading-icon { width:38px; height:38px; }
.section-heading-icon svg { width:18px; height:18px; }
.stock-section-heading h2 { margin:0 0 3px; padding:0; font-size:15px; text-align:left; }
.stock-section-heading p { margin:0; color:#8c9a9f; font-size:10px; }
.stock-detail-page .stock-card-details { display:grid; gap:0; margin:0; padding:8px 22px 13px; }
.stock-detail-page .stock-card-details div { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px 0; border-bottom:1px solid #f0f2f3; }
.stock-detail-page .stock-card-details div:last-child { border-bottom:0; }
.stock-detail-page .stock-card-details dt { color:#859399; font-size:11px; font-weight:600; }
.stock-detail-page .stock-card-details dt::after { content:none; }
.stock-detail-page .stock-card-details dd { color:#263b46; font-size:12px; font-weight:700; text-align:right; }
.stock-detail-page .stock-card-table { border-collapse:separate; border-spacing:0; }
.stock-detail-page .stock-card-table th,.stock-detail-page .stock-card-table td { padding:13px 14px; border:0; border-bottom:1px solid #edf0f1; font-size:12px; }
.stock-detail-page .stock-card-table thead th { background:#f7f9f9; color:#839198; font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.stock-detail-page .stock-card-table tbody tr:hover { background:#fbfdfc; }
.stock-detail-page .stock-card-table td:nth-child(2) strong,.stock-detail-page .stock-card-table td:nth-child(2) small { display:block; }
.stock-detail-page .stock-card-table td:nth-child(2) small { max-width:230px; margin-top:3px; overflow:hidden; color:#98a3a8; font-size:9px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; }
.stock-number { display:inline-block; min-width:44px; padding:5px 7px; border-radius:7px; font-weight:800; }
.stock-number-in { background:#e7f6ef; color:#14825f; }
.stock-number-out { background:#fff0e9; color:#cf7047; }
.stock-number-empty { color:#bbc4c7; }
.stock-detail-page .stock-card-balance { display:flex; align-items:center; justify-content:flex-end; gap:12px; padding:15px 22px; background:#fbfcfc; color:#829096; font-size:11px; }
.stock-detail-page .stock-card-balance strong { color:#173740; font:800 14px 'Plus Jakarta Sans',sans-serif; }
@media(max-width:1000px) {
  .stock-detail-page .stock-card-buttons { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stock-detail-content { grid-template-columns:1fr; }
  .stock-detail-page .stock-card-details { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:30px; }
}
@media(max-width:760px) {
  .stock-detail-page .back-link { margin-bottom:16px; }
  .stock-detail-hero { display:block; padding:20px; border-radius:18px; background:linear-gradient(145deg,#fff 0%,#f1f9f5 100%); }
  .stock-detail-identity { align-items:flex-start; gap:13px; }
  .stock-detail-photo { flex-basis:58px; width:58px; height:58px; border-radius:14px; }
  .stock-detail-photo svg { width:25px; height:25px; }
  .stock-detail-identity h1 { margin-bottom:8px; font-size:22px; letter-spacing:-.7px; }
  .stock-detail-identity .eyebrow { margin-bottom:5px; font-size:8px; letter-spacing:1.5px; }
  .stock-detail-meta span { padding:4px 7px; font-size:9px; }
  .stock-detail-balance { width:100%; min-width:0; margin-top:18px; padding:14px 15px; border:0; background:#e6f5ee; }
  .stock-detail-balance strong { font-size:22px; }
  .stock-detail-page .stock-card-buttons { gap:9px; margin:12px 0 22px; }
  .stock-action { grid-template-columns:35px minmax(0,1fr); min-height:68px; padding:11px; column-gap:9px; border-radius:13px; }
  .stock-action>span { width:35px; height:35px; border-radius:9px; }
  .stock-action>span svg { width:17px; height:17px; }
  .stock-action strong { font-size:11px; }
  .stock-action small { font-size:8px; }
  .stock-info-card,.stock-detail-page .stock-card { border-radius:16px; }
  .stock-section-heading { padding:16px; }
  .stock-detail-page .stock-card-details { grid-template-columns:1fr; padding:5px 16px 10px; }
  .stock-detail-page .stock-card-details div { padding:11px 0; }
  .stock-history-card { margin-top:0; }
  .stock-detail-page .stock-card-table th,.stock-detail-page .stock-card-table td { padding:12px 7px; font-size:10px; }
  .stock-detail-page .stock-card-table th:first-child,.stock-detail-page .stock-card-table td:first-child { display:none; }
  .stock-detail-page .stock-card-table th:nth-child(2) { width:42%; }
  .stock-detail-page .stock-card-table td:nth-child(2) small { max-width:125px; font-size:8px; }
  .stock-number { min-width:35px; padding:4px; font-size:9px; }
  .stock-detail-page .stock-card-balance { padding:14px 16px; }
}
@media(max-width:380px) {
  .stock-detail-hero { padding:16px; }
  .stock-detail-photo { flex-basis:48px; width:48px; height:48px; }
  .stock-detail-identity h1 { font-size:19px; }
  .stock-action small { display:none; }
  .stock-action { min-height:58px; }
}

/* Simple stock card detail */
.stock-detail-simple .back-link { margin-bottom:25px; }
.stock-detail-simple .stock-card-actions { align-items:flex-end; margin-bottom:24px; }
.stock-detail-simple .stock-card-actions h1 { margin:5px 0 6px; font-size:clamp(26px,3vw,34px); letter-spacing:-1.2px; line-height:1.2; }
.stock-card-subtitle { margin:0; color:#87959b; font-size:12px; font-weight:600; }
.stock-detail-simple .stock-card-buttons { justify-content:flex-end; }
.stock-detail-simple .stock-card-buttons .btn { min-height:46px; border-radius:11px; }
.stock-detail-simple .stock-card-buttons .btn svg { width:16px; height:16px; }
.stock-detail-simple .stock-card { border-color:#dfe6e8; border-radius:18px; box-shadow:0 12px 35px rgba(16,38,53,.055); }
.stock-card-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 26px; border-bottom:1px solid #e8edef; }
.stock-card-heading h2 { padding:0; margin:0 0 4px; text-align:left; font-size:19px; }
.stock-card-heading p { margin:0; color:#8c999f; font-size:11px; }
.stock-card-heading>span { min-width:150px; padding:11px 14px; border-radius:11px; background:#e9f6f0; text-align:right; }
.stock-card-heading small,.stock-card-heading strong { display:block; }
.stock-card-heading small { margin-bottom:3px; color:#789087; font-size:8px; font-weight:800; letter-spacing:1px; }
.stock-card-heading strong { color:#176c56; font:800 16px 'Plus Jakarta Sans',sans-serif; }
.stock-detail-simple .stock-card-details { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 42px; padding:21px 26px; }
.stock-detail-simple .stock-card-details div { grid-template-columns:110px minmax(0,1fr); gap:12px; padding:7px 0; }
.stock-detail-simple .stock-card-details dt { color:#53666f; font-size:12px; }
.stock-detail-simple .stock-card-details dd { color:#172d39; font-size:12px; }
.stock-detail-simple .stock-card-table { border-collapse:separate; border-spacing:0; }
.stock-detail-simple .stock-card-table th,.stock-detail-simple .stock-card-table td { padding:12px 14px; border:0; border-top:1px solid #e1e7e9; border-right:1px solid #e1e7e9; font-size:12px; }
.stock-detail-simple .stock-card-table th:last-child,.stock-detail-simple .stock-card-table td:last-child { border-right:0; }
.stock-detail-simple .stock-card-table thead th { background:#fff3ed; color:#5d4c45; font-size:10px; letter-spacing:.35px; }
.stock-detail-simple .stock-card-table tbody tr:hover { background:#fbfdfc; }
.stock-detail-simple .stock-card-table .stock-in:not(:empty) { color:#16815f; font-weight:800; }
.stock-detail-simple .stock-card-table .stock-out:not(:empty) { color:#ce704a; font-weight:800; }
.stock-detail-simple .stock-card-balance { padding:16px 24px; border-top:0; background:#fbfcfc; color:#64767e; }
.stock-detail-simple .stock-card-balance strong { margin-left:4px; color:#142f3c; }
@media(max-width:900px) {
  .stock-detail-simple .stock-card-actions { display:block; }
  .stock-detail-simple .stock-card-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:18px; }
  .stock-detail-simple .stock-card-buttons .btn { width:100%; }
}
@media(max-width:760px) {
  .stock-detail-simple .back-link { margin-bottom:18px; }
  .stock-detail-simple .stock-card-actions { margin-bottom:22px; }
  .stock-detail-simple .stock-card-actions h1 { margin-top:5px; font-size:25px; }
  .stock-detail-simple .stock-card-buttons { gap:9px; margin-top:17px; }
  .stock-detail-simple .stock-card-buttons .btn { min-height:48px; margin:0; padding:8px 9px; font-size:11px; }
  .stock-card-heading { padding:17px 16px; }
  .stock-card-heading h2 { font-size:17px; }
  .stock-card-heading>span { min-width:125px; padding:9px 11px; }
  .stock-card-heading strong { font-size:13px; }
  .stock-detail-simple .stock-card-details { grid-template-columns:1fr; padding:15px 16px 18px; }
  .stock-detail-simple .stock-card-details div { grid-template-columns:96px minmax(0,1fr); padding:6px 0; }
  .stock-detail-simple .stock-card-table th,.stock-detail-simple .stock-card-table td { padding:10px 6px; font-size:10px; }
  .stock-detail-simple .stock-card-table th:first-child,.stock-detail-simple .stock-card-table td:first-child { width:32px; }
  .stock-detail-simple .stock-card-table th:nth-child(2) { width:43%; }
  .stock-detail-simple .stock-card-balance { padding:14px 16px; font-size:12px; }
}
@media(max-width:390px) {
  .stock-card-heading>div p { display:none; }
  .stock-detail-simple .stock-card-buttons .btn svg { display:none; }
  .stock-detail-simple .stock-card-table th,.stock-detail-simple .stock-card-table td { padding-inline:4px; font-size:9px; }
}

/* Item create and edit form */
.item-form-page { max-width:820px; }
.item-form-page>.back-link { margin-bottom:22px; }
.item-form-page .form-intro { margin-bottom:24px; }
.item-form-page .form-intro .eyebrow { margin-bottom:8px; }
.item-form-page .form-intro h1 { margin-bottom:8px; }
.item-form-card { overflow:hidden; padding:0; }
.item-form-card>.catalog-notice { margin:24px 28px 0; }
.item-form-section { padding:27px 30px 30px; border-bottom:1px solid #edf0f1; }
.item-form-section-heading { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.item-form-section-heading>span { display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; border-radius:11px; background:#e8f5ef; color:var(--green); }
.item-form-section-heading>span svg { width:19px; height:19px; }
.item-form-section-heading h2 { margin:0 0 3px; font-size:15px; }
.item-form-section-heading p { margin:0; color:#8e9ba0; font-size:11px; }
.item-form-card .form-grid { gap:21px 18px; }
.item-form-card .field label { margin-bottom:8px; color:#263a45; }
.item-form-card .field input:not([type=file]) { min-height:50px; border-radius:11px; background:#fcfdfd; }
.item-form-card .field input:not([type=file]):hover { border-color:#c4d2d1; }
.item-image-upload { min-height:104px; padding:14px; border-color:#cfdedb; background:#fafcfb; }
.item-image-upload .upload-preview { display:grid; place-items:center; flex:0 0 74px; width:74px; height:74px; overflow:hidden; border-radius:11px; background:#e9f4ef; color:#268a6c; }
.item-image-upload .upload-preview img { width:100%; height:100%; object-fit:cover; }
.item-image-upload .upload-preview svg { width:25px; height:25px; }
.item-image-upload input[type=file] { color:#78888e; }
.item-image-upload input::file-selector-button { min-height:38px; border-color:#d2dfdc; box-shadow:0 2px 7px rgba(21,49,57,.04); }
.item-image-upload .field-help { margin-top:4px; }
.item-review-field { padding:14px 16px; border:1px solid #e2e9e8; border-radius:11px; background:#f8faf9; }
.item-review-field label { margin:0!important; font-weight:600; }
.item-form-card>.form-actions { margin:0; padding:20px 30px; border:0; background:#fafbfb; }
.item-form-card>.form-actions .btn { min-width:130px; min-height:46px; }
@media(max-width:760px) {
  .item-form-page>.back-link { margin-bottom:14px; }
  .item-form-page .form-intro { margin-bottom:19px; }
  .item-form-page .form-intro .eyebrow { font-size:8px; margin-bottom:6px; }
  .item-form-page .form-intro h1 { margin-bottom:6px; font-size:26px; line-height:1.2; }
  .item-form-page .form-intro p:last-child { max-width:330px; font-size:12px; line-height:1.55; }
  .item-form-card { border-radius:17px; }
  .item-form-card>.catalog-notice { margin:18px 18px 0; }
  .item-form-section { padding:21px 18px 23px; }
  .item-form-section-heading { margin-bottom:19px; }
  .item-form-section-heading>span { flex-basis:36px; width:36px; height:36px; border-radius:10px; }
  .item-form-section-heading h2 { font-size:14px; }
  .item-form-section-heading p { font-size:10px; }
  .item-form-card .form-grid { gap:18px; }
  .item-form-card .field input:not([type=file]) { min-height:49px; }
  .item-image-upload { min-height:92px; padding:12px; }
  .item-image-upload .upload-preview { flex-basis:64px; width:64px; height:64px; }
  .item-image-upload input::file-selector-button { display:block; margin:0 0 6px; }
  .item-form-card>.form-actions { grid-template-columns:.75fr 1.25fr; gap:9px; padding:16px 18px 18px; }
  .item-form-card>.form-actions .btn { min-width:0; min-height:48px; }
}
@media(max-width:390px) {
  .item-form-section { padding-inline:15px; }
  .item-image-upload { align-items:center; gap:10px; }
  .item-image-upload .upload-preview { flex-basis:56px; width:56px; height:56px; }
  .item-image-upload input[type=file] { font-size:10px; }
  .item-form-card>.form-actions { padding-inline:15px; }
}

/* Compact mobile-first sizing */
@media(max-width:760px) {
  body { font-size:13px; }
  .topbar { height:56px; padding:0 14px; }
  .mobile-brand { font-size:18px; }
  .mobile-brand .brand-mark { width:29px; height:29px; margin-right:7px; border-radius:8px; }
  .mobile-brand .brand-mark svg { width:17px; height:17px; }
  .topbar-avatar { width:29px; height:29px; font-size:9px; }
  .page-content { padding:16px 14px calc(78px + env(safe-area-inset-bottom)); }
  .back-link { min-height:28px; margin-bottom:13px; font-size:11px; }
  .back-link svg { width:14px; height:14px; }
  .page-heading h1,.detail-heading h1,.form-intro h1 { font-size:23px; letter-spacing:-.7px; }
  .page-heading p:last-child,.detail-heading p:last-child,.form-intro p:last-child { font-size:11px; }
  .eyebrow { margin-bottom:6px; font-size:8px; letter-spacing:1.6px; }
  .btn { min-height:42px; border-radius:9px; font-size:11px; }
  .bottom-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:5px 7px calc(5px + env(safe-area-inset-bottom)); }
  .bottom-nav a { min-width:0; min-height:45px; justify-content:center; gap:2px; border-radius:9px; font-size:9px; }
  .bottom-nav a svg { width:18px; height:18px; }
  .bottom-nav a.active { background:#edf7f2; }

  .item-form-page>.back-link { margin-bottom:10px; }
  .item-form-page .form-intro { margin-bottom:15px; }
  .item-form-page .form-intro h1 { margin-bottom:4px; font-size:23px; }
  .item-form-page .form-intro p:last-child { max-width:300px; font-size:11px; }
  .item-form-card { border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
  .item-form-card>.catalog-notice { margin:0 0 10px; }
  .item-form-section { margin-bottom:10px; padding:15px; border:1px solid #e4e9ea; border-radius:14px; background:#fff; box-shadow:0 6px 18px rgba(20,44,52,.035); }
  .item-form-section-heading { gap:9px; margin-bottom:14px; }
  .item-form-section-heading>span { flex-basis:30px; width:30px; height:30px; border-radius:8px; }
  .item-form-section-heading>span svg { width:15px; height:15px; }
  .item-form-section-heading h2 { margin:0; font-size:13px; }
  .item-form-section-heading p { display:none; }
  .item-form-card .form-grid { gap:14px; }
  .item-form-card .field label { margin-bottom:6px; font-size:11px; }
  .item-form-card .field input:not([type=file]) { min-height:43px; padding-inline:12px; border-radius:9px; font-size:14px; }
  .item-form-card .input-prefix input { padding-left:39px!important; }
  .item-form-card .input-prefix span { left:12px; font-size:11px; }
  .item-form-card .field-help,.item-form-card .field-error { margin-top:5px; font-size:9px; line-height:1.4; }
  .item-image-upload { min-height:70px; padding:9px; gap:10px; border-radius:10px; }
  .item-image-upload .upload-preview { flex-basis:48px; width:48px; height:48px; border-radius:9px; }
  .item-image-upload .upload-preview svg { width:20px; height:20px; }
  .item-image-upload input[type=file] { padding:0; font-size:10px; }
  .item-image-upload input::file-selector-button { display:inline-block; min-height:32px; margin:0 5px 3px 0; padding:6px 9px; border-radius:7px; font-size:10px; }
  .item-image-upload .field-help { display:block; margin-top:2px; }
  .item-review-field { padding:11px 12px; }
  .item-form-card>.form-actions { position:static; grid-template-columns:.7fr 1.3fr; margin:0; padding:4px 0 0; background:transparent; }
  .item-form-card>.form-actions .btn { min-height:43px; font-size:11px; }
}
@media(max-width:380px) {
  .page-content { padding-inline:11px; }
  .item-form-section { padding:13px; }
  .item-image-upload .upload-preview { flex-basis:43px; width:43px; height:43px; }
  .bottom-nav a { font-size:8px; }
}
.mobile-brand .brand-mark.brand-image { width:34px; height:34px; margin-right:6px; }
@media(max-width:760px) {
  .mobile-brand { font-size:16px; letter-spacing:-.5px; }
}