/* Distinct theme palettes */
body.chrome{--bg:#080b10!important;--panel:#151b23!important;--panel2:#0e131a!important;--text:#f7fbff!important;--muted:#a7b4c2!important;--line:#506174!important;--accent:#e2e8f0!important;--accent2:#67d7ff!important;--accent-soft:rgba(103,215,255,.13)!important;background:radial-gradient(circle at 50% -10%,#526170 0,#151b23 25%,#080b10 58%,#020304 100%)!important}
body.chrome .card,body.chrome .settingsSection,body.chrome .inventoryPanel{box-shadow:inset 0 1px rgba(255,255,255,.16),0 18px 45px rgba(0,0,0,.48)}
body.copper{--bg:#100805!important;--panel:#24130e!important;--panel2:#170c08!important;--text:#fff3e8!important;--muted:#c9a68f!important;--line:#72472f!important;--accent:#d08a5b!important;--accent2:#ffd0a3!important;--accent-soft:rgba(208,138,91,.16)!important;background:radial-gradient(circle at 18% 0,#663d28 0,#25140e 25%,#100805 58%,#050201 100%)!important}
body.copper-light{--bg:#f7eee7!important;--panel:#fffaf6!important;--panel2:#ead6c7!important;--text:#2d1710!important;--muted:#765a48!important;--line:#c79a7c!important;--accent:#9d5632!important;--accent2:#6f351f!important;--accent-soft:rgba(157,86,50,.13)!important;background:radial-gradient(circle at top,#fffdfb 0,#f0dfd2 50%,#dfc4b0 100%)!important}
body.orange{--accent:#ff6a00;--accent2:#ffae36;--line:#7d3a13;--accent-soft:rgba(255,106,0,.16);background:radial-gradient(circle at top,#512007 0,var(--bg) 48%,#070301 100%)!important}

/* Wide inventory metric details overlay the other cards without lengthening the page. */
.inventoryPageMetrics{position:relative!important;isolation:isolate;min-height:92px}
.inventoryPageMetrics .inventoryMetric{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important}
.inventoryPageMetrics .inventoryMetric.metricWideExpanded{position:absolute!important;inset:auto!important;top:0!important;width:52%!important;min-height:112px!important;z-index:40!important;transform:none!important;overflow:hidden!important;box-shadow:0 20px 46px rgba(0,0,0,.35)!important;background:linear-gradient(135deg,var(--panel),color-mix(in srgb,var(--panel2) 85%,var(--accent) 15%))!important}
.inventoryPageMetrics .inventoryMetric.metricWideExpanded:nth-child(1){left:0!important}
.inventoryPageMetrics .inventoryMetric.metricWideExpanded:nth-child(2){left:16%!important}
.inventoryPageMetrics .inventoryMetric.metricWideExpanded:nth-child(3){left:32%!important}
.inventoryPageMetrics .inventoryMetric.metricWideExpanded:nth-child(4){right:0!important}
.inventoryPageMetrics .metricWideExpanded .inventoryMetricDetails{max-height:92px!important;opacity:1!important;transform:none!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:6px 14px;padding-top:8px!important;overflow:auto!important;font-size:.73rem!important;line-height:1.3!important}
.inventoryPageMetrics .metricWideExpanded .inventoryLowDetailItem{min-width:0;overflow-wrap:anywhere}

/* Filament rows: larger themed legend, availability, validation, and compact collapse. */
.filamentEntry{padding-top:38px!important;position:relative!important}
.filamentEntry::after{display:none!important}
.filamentLegendButton{position:absolute;left:14px;top:-16px;z-index:4;display:inline-flex;align-items:center;gap:9px;min-height:33px;padding:6px 13px;border:2px solid var(--accent);border-radius:999px;background:var(--panel);color:var(--accent2);font:500 .94rem/1 var(--app-font,inherit);box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 22%,transparent);cursor:pointer}
.filamentLegendChevron{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s ease}
.filamentEntry.filamentCollapsed .filamentLegendChevron{transform:rotate(-45deg)}
.filamentAvailability{grid-column:1/-1;display:flex;gap:7px;align-items:center;margin:-2px 0 2px;color:var(--accent2);font-weight:800;font-size:.86rem}
.filamentAvailability.untracked{color:var(--muted);font-weight:700}
.filamentPresetWarning{grid-column:1/-1;display:none;margin:0;padding:9px 12px;border:1px solid var(--bad);border-radius:10px;background:color-mix(in srgb,var(--bad) 10%,transparent);color:var(--bad);font-size:.88rem;font-weight:400;line-height:1.25}
.filamentPresetWarning.show{display:block}
.filamentCollapsedSummary{display:none;grid-column:1/-1;color:var(--text);font-size:.9rem;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:2px 4px}
.filamentCollapsedSummary .filamentSummaryDot{display:inline-block;width:11px;height:11px;margin-right:7px;border-radius:50%;background:var(--summary-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--summary-color) 25%,transparent)}
.filamentEntry.filamentCollapsed{padding:27px 14px 13px!important;min-height:56px!important}
.filamentEntry.filamentCollapsed>*:not(.filamentLegendButton):not(.filamentCollapsedSummary){display:none!important}
.filamentEntry.filamentCollapsed .filamentCollapsedSummary{display:block!important}

/* Notification inventory digest detail. */
.notificationDigestPreference{display:flex;align-items:center;gap:7px;margin-left:auto;color:var(--muted);font-size:.72rem;font-weight:800;white-space:nowrap}
.notificationDigestPreference select{width:116px;min-height:34px;padding:6px 32px 6px 10px;font-size:.76rem}
.notificationDigestDetail{position:fixed;inset:0;z-index:10020;display:grid;place-items:center;padding:18px;background:rgba(2,6,12,.72);backdrop-filter:blur(8px)}
.notificationDigestCard{width:min(720px,100%);max-height:min(82vh,760px);overflow:auto;border:1px solid var(--accent);border-radius:22px;background:var(--panel);color:var(--text);box-shadow:0 28px 80px rgba(0,0,0,.5)}
.notificationDigestHeader{display:flex;justify-content:space-between;gap:20px;padding:22px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,var(--panel2),var(--accent-soft))}
.notificationDigestHeader h3{margin:4px 0 0;font-size:1.35rem}.notificationDigestHeader small{color:var(--accent2);text-transform:uppercase;letter-spacing:.12em;font-weight:900}
.notificationDigestClose{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:var(--bg);color:var(--text);font-size:1.5rem}
.notificationDigestBody{padding:18px 22px 24px}.notificationDigestGroup+ .notificationDigestGroup{margin-top:20px}.notificationDigestGroup h4{margin:0 0 9px;color:var(--accent2)}
.notificationDigestRow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
.notificationDigestRow:hover{transform:translateY(-2px) scale(1.008);border-color:var(--accent);background:color-mix(in srgb,var(--panel2) 90%,var(--accent) 10%);box-shadow:0 10px 24px rgba(0,0,0,.15)}
.notificationDigestRow+.notificationDigestRow{margin-top:8px}.notificationDigestDot{width:14px;height:14px;border-radius:50%;background:var(--digest-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--digest-color) 18%,transparent)}
.notificationDigestCopy strong,.notificationDigestCopy span{display:block}.notificationDigestCopy span{color:var(--muted);font-size:.8rem;margin-top:3px}
.notificationDigestUpdate{border:0;border-radius:9px;padding:8px 10px;background:transparent;color:var(--accent2);font-weight:900;white-space:nowrap;transition:transform .16s ease,background .16s ease}
.notificationDigestUpdate:hover{transform:translateX(2px);background:var(--accent-soft)}
.notificationItem.digest{cursor:pointer}.notificationItem.digest:not(.unread){cursor:default}.notificationItemAction.digest{color:var(--accent2)}
@media(max-width:760px){.inventoryPageMetrics .inventoryMetric.metricWideExpanded{position:relative!important;inset:auto!important;width:100%!important;min-height:112px!important}.inventoryPageMetrics .metricWideExpanded .inventoryMetricDetails{grid-template-columns:1fr!important;max-height:118px!important}}
@media(max-width:760px){.notificationDigestPreference{margin-left:0}.notificationBulkActions{margin-left:auto}}
@media(max-width:620px){.notificationDigestPreference{width:100%;justify-content:space-between}.notificationDigestRow{grid-template-columns:auto minmax(0,1fr)}.notificationDigestUpdate{grid-column:2;text-align:left;padding:6px 0}.filamentCollapsedSummary{font-size:.8rem}.filamentLegendButton{font-size:.88rem}}
@media(prefers-reduced-motion:reduce){.notificationDigestRow,.notificationDigestUpdate{transition:none}.notificationDigestRow:hover,.notificationDigestUpdate:hover{transform:none}}

/* Inventory overview: keep every card in place and reveal details within the grid. */
.inventoryPageMetrics .inventoryMetric,.inventoryPageMetrics .inventoryMetric.metricWideExpanded{
  position:relative!important;inset:auto!important;width:auto!important;min-height:92px!important;
  z-index:1!important;overflow:hidden!important;transform:none!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.inventoryPageMetrics .inventoryMetric:hover,.inventoryPageMetrics .inventoryMetric:focus-within{
  z-index:2!important;transform:translateY(-3px) scale(1.018)!important;border-color:var(--accent)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.18),0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent)!important;
  background:color-mix(in srgb,var(--panel2) 91%,var(--accent) 9%)!important;
}
.inventoryPageMetrics .inventoryMetricDetails,.inventoryPageMetrics .metricWideExpanded .inventoryMetricDetails{
  display:block!important;max-height:0!important;opacity:0!important;overflow:hidden!important;padding-top:0!important;
  font-size:.69rem!important;line-height:1.3!important;transform:translateY(-3px)!important;
  transition:max-height .2s ease,opacity .16s ease,transform .2s ease,padding .2s ease!important;
}
.inventoryPageMetrics .inventoryMetric:hover .inventoryMetricDetails,.inventoryPageMetrics .inventoryMetric:focus-within .inventoryMetricDetails{
  max-height:64px!important;opacity:1!important;overflow:auto!important;padding-top:7px!important;transform:none!important;
}
.inventoryPageMetrics .inventoryLowDetailItem{display:flex!important;min-width:0!important;gap:6px!important;margin-bottom:3px!important;overflow-wrap:anywhere}

/* Inventory purchase links and material-type color previews. */
.inventoryPurchaseField{grid-column:1/-1}.inventoryPurchaseField small,.inventoryLocationField small,.inventoryDialogEditForm small{display:block;margin-top:5px;color:var(--muted);font-size:.76rem;line-height:1.35}
.inventoryRowActions{display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap}
.inventoryReorderButton,.notificationItemAction.reorder,.notificationDigestReorder{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:6px 11px;border:1px solid color-mix(in srgb,var(--accent) 68%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--accent-soft) 72%,var(--panel2));color:var(--accent);font-weight:500!important;text-decoration:none!important;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.inventoryAddReorderUrl{appearance:none;border:0;background:transparent;color:var(--accent);font:500 .76rem var(--app-font);padding:5px 2px;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent) 48%,transparent);text-underline-offset:3px;white-space:nowrap}
.inventoryReorderButton:hover,.notificationItemAction.reorder:hover,.notificationDigestReorder:hover{transform:translateY(-1px);border-color:var(--accent);background:color-mix(in srgb,var(--accent-soft) 88%,var(--panel2));box-shadow:0 6px 16px color-mix(in srgb,var(--accent) 18%,transparent)}
.inventoryAddReorderUrl:hover{color:var(--accent2);text-decoration-color:currentColor}
.notificationDigestReorder{margin-left:auto}.notificationDigestRow .notificationDigestUpdate{margin-left:0}.notificationItemAction.reorder{font-size:inherit}
.inventoryBreakdownChips.materialTypes{align-items:flex-start}.inventoryBreakdown>section:has(#inventoryTypeBreakdown){align-self:start;min-height:0}
.inventoryBreakdownChip.type{position:relative;overflow:visible;max-width:none;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
.inventoryBreakdownChip.type:hover,.inventoryBreakdownChip.type:focus-visible{transform:translateY(-2px);border-color:var(--accent);background:color-mix(in srgb,var(--panel2) 88%,var(--accent) 12%);box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 16%,transparent)}
.inventoryTypeColorPreview{position:absolute;z-index:30;top:calc(100% + 7px);left:0;display:grid;grid-template-columns:repeat(4,minmax(54px,auto));width:max-content;max-width:min(340px,82vw);gap:7px 10px;padding:9px 10px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:12px;background:var(--panel);box-shadow:0 14px 30px rgba(0,0,0,.28);opacity:0;visibility:hidden;transform:translateY(-4px);pointer-events:none;transition:opacity .17s ease,transform .17s ease,visibility .17s ease}
.inventoryBreakdownChip.type:hover .inventoryTypeColorPreview,.inventoryBreakdownChip.type:focus-visible .inventoryTypeColorPreview{opacity:1;visibility:visible;transform:translateY(0)}
.inventoryTypeColorPreview>span{display:inline-flex;align-items:center;min-width:0;gap:4px;color:var(--muted);font-size:.66rem;white-space:nowrap}.inventoryTypeColorPreview i{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:var(--type-color);box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 28%,transparent)}.inventoryTypeColorPreview small{font-size:inherit;color:inherit}
.inventoryDialogEditButtons .btn{min-width:150px;min-height:48px;padding:12px 20px;font-size:.88rem}.inventoryDialogColorPicker{margin:0;padding:9px 10px;border-radius:12px}.inventoryDialogColorPicker .unifiedColorHeader{margin:0}.inventoryDialogColorPicker .unifiedColorControls{display:none;margin-top:10px}.inventoryDialogColorPicker.open .unifiedColorControls{display:block}.inventoryDialogColorPicker .unifiedSwatches{grid-template-columns:repeat(7,minmax(25px,1fr));gap:7px}.inventoryDialogColorPicker .swatch{min-width:25px;height:31px;padding:0;border:1px solid color-mix(in srgb,var(--text) 28%,transparent);border-radius:9px}
@media(max-width:620px){.inventoryRowActions{align-items:stretch;flex-direction:column}.inventoryReorderButton{min-height:28px;padding:4px 8px}.inventoryTypeColorPreview{grid-template-columns:repeat(4,minmax(48px,auto));gap:6px 7px;max-width:88vw}.inventoryTypeColorPreview>span{font-size:.62rem}.notificationDigestReorder{margin-left:0}.inventoryDialogEditButtons .btn{min-width:0}.inventoryDialogColorPicker .unifiedSwatches{grid-template-columns:repeat(5,minmax(25px,1fr))}}

/* A compact but distinctive inventory subtraction sequence. */
.inventoryDeductionStage{perspective:700px}
.inventoryDeductionStage .inventoryMetric{animation-name:inventoryMetricLedgerFlip!important}
.inventoryDeductionStage .inventoryDeductionSummary{overflow:hidden}
.inventoryDeductionStage .inventoryDeductionSummary::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,color-mix(in srgb,#fff 48%,transparent) 48%,transparent 70%);transform:translateX(-130%);animation:inventoryReceiptGlint 1.05s .28s ease-out both;pointer-events:none}
.inventoryDeductionParticles{position:absolute;z-index:7;inset:0;overflow:hidden;border-radius:18px;pointer-events:none}
.inventoryDeductionParticles i{position:absolute;left:var(--spark-x);top:54%;width:5px;height:5px;border-radius:50%;background:var(--spark-color,var(--accent));box-shadow:0 0 9px var(--spark-color,var(--accent));opacity:0;animation:inventorySparkRoute 1.45s var(--spark-delay) cubic-bezier(.2,.72,.2,1) both}
.inventoryNumberRolling{transform-origin:50% 55%;animation-name:inventoryNumberTally!important}
@keyframes inventoryMetricLedgerFlip{0%{filter:brightness(.88);box-shadow:inset 0 0 0 0 transparent}22%{filter:brightness(1.2);box-shadow:inset 0 0 0 2px var(--accent)}48%{filter:brightness(.96);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 35%,transparent)}100%{filter:none;box-shadow:inset 0 0 0 0 transparent}}
@keyframes inventoryNumberTally{0%{opacity:.55;transform:rotateX(-72deg);filter:blur(1px)}22%{opacity:1;transform:rotateX(18deg);filter:none}42%{transform:rotateX(-9deg)}64%{transform:rotateX(4deg)}100%{transform:none;filter:none}}
@keyframes inventoryReceiptGlint{to{transform:translateX(130%)}}
@keyframes inventorySparkRoute{0%{opacity:0;left:var(--spark-x);transform:translateY(20px) scale(.4)}18%{opacity:1}58%{opacity:1;transform:translateY(-18px) scale(1)}100%{opacity:0;left:50%;transform:translateY(-44px) scale(.2)}}
@media(prefers-reduced-motion:reduce){.inventoryDeductionParticles i,.inventoryDeductionStage .inventoryDeductionSummary::after{animation:none!important}.inventoryDeductionStage .inventoryMetric,.inventoryNumberRolling{animation:none!important}}
.inventoryTypeColorPreview{max-width:min(340px,calc(100vw - 20px))}

/* In-stock items still get a Re-order link, just a quieter one so low/out stock
   stays the visually urgent case. */
.inventoryReorderButton.quiet{
  border-color:color-mix(in srgb,var(--line) 82%,transparent);
  background:transparent;
  color:var(--muted);
}
.inventoryReorderButton.quiet:hover{
  border-color:var(--accent);
  color:var(--accent2,var(--accent));
  background:color-mix(in srgb,var(--accent) 12%,transparent);
}

/* Re-order entry points on the inventory item dialog. */
.inventoryDialogActions{flex-wrap:wrap}
.inventoryDialogActions .inventoryDialogReorderBtn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.inventoryDialogReorder{color:var(--accent2,var(--accent));text-decoration:none;font-weight:700;white-space:nowrap}
.inventoryDialogReorder:hover{text-decoration:underline}