.dashboard-consumables { margin-top: 22px; margin-bottom: 22px; }
.consumable-form-wrap { padding: 0 24px 24px; }
.consumable-log-form { display: grid; grid-template-columns: 1.1fr 1.3fr 80px 1fr 1.4fr 1.35fr auto; gap: 10px; align-items: end; }
.consumable-log-form .btn { min-height: 45px; }
.consumable-last { min-height: 45px; display: flex !important; flex-direction: row !important; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid #e4a028; border-radius: 8px; background: rgba(217,134,20,.08); cursor: pointer; }
.consumable-last input { width: 18px; height: 18px; margin: 0; flex: 0 0 auto; accent-color: #d98614; }
.consumable-last span { display: grid; gap: 2px; }
.consumable-last strong { color: var(--ink); font-size: 12px; }
.consumable-last small { color: var(--muted); font-size: 10px; line-height: 1.25; }
.stock-alert { display: inline-block; padding: 4px 7px; border-radius: 999px; background: #fee7e4; color: #ad261d; font-size: 10px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }
.consumable-clock-card { margin-bottom: 22px; }
.consumable-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 22px; }
.consumable-stat { padding: 22px; }
.consumable-stat { display: block; transition: transform .15s, box-shadow .15s; }
.consumable-stat:hover { transform: translateY(-2px); box-shadow: 0 12px 35px rgba(18,38,42,.12); }
.consumable-stat h2 { margin: 6px 0 18px; font-size: 19px; }
.consumable-stat p { color: var(--muted); margin: 14px 0 0; font-size: 13px; }
.consumable-stat.early { border-color: #e4a028; box-shadow: 0 8px 30px rgba(217,134,20,.14); }
.early-flag { color: #9a5700 !important; font-weight: 700; }
.view-consumable { display: block; margin-top: 14px; color: var(--accent2); font-weight: 700; font-size: 12px; }
.stat-numbers { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.stat-numbers strong { display: block; font: 700 29px 'Space Grotesk'; }
.stat-numbers small { color: var(--muted); }
.usage-chart-card { margin-bottom: 22px; overflow: hidden; }
.usage-chart-wrap { overflow-x: auto; padding: 0 18px 16px; }
.usage-chart { min-width: 680px; width: 100%; height: 230px; }
.usage-chart rect { fill: var(--accent); }
.usage-chart text { fill: var(--ink); font: 700 10px 'DM Sans'; }
.usage-chart .axis-label { fill: var(--muted); font-weight: 500; font-size: 9px; }
.consumable-detail-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 22px; }
.consumable-detail-metrics .metric small { display: block; color: var(--muted); }
.consumable-detail-metrics .metric-word { font-size: 23px; margin-top: 10px; }
@media(max-width:1100px){.consumable-log-form{grid-template-columns:1fr 1fr 90px}.consumable-note,.consumable-last{grid-column:1/3}.consumable-stats{grid-template-columns:1fr 1fr}}
@media(max-width:1000px){.consumable-detail-metrics{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.consumable-log-form{grid-template-columns:1fr}.consumable-note,.consumable-last{grid-column:auto}.consumable-stats,.consumable-detail-metrics{grid-template-columns:1fr}}