/* hi-ux-consistency-v1: semantically consistent actions, notices, and restrained animated outlines. */
/* Detail actions: float thin SVGs, match the action language on the History page. */
.drawer-actions .drawer-action { --action-ink:#a7b6cc; min-width:0; }
.drawer-actions .drawer-action--income {--action-ink:#83d5a8;}
.drawer-actions .drawer-action--exhausted {--action-ink:#e89aa0;}
.drawer-actions .drawer-action--adjustment {--action-ink:#c2a5ed;}
.drawer-actions .drawer-action--started {--action-ink:#ead09a;}
.drawer-actions .drawer-action--purchase {--action-ink:#9ac7f3;}
.drawer-actions .drawer-action--income {background:linear-gradient(110deg,#23362e,#242529 77%)!important;border-color:#335544!important;}
.drawer-actions .drawer-action--exhausted {background:linear-gradient(110deg,#3b282c,#242529 77%)!important;border-color:#603b44!important;}
.drawer-actions .drawer-action--adjustment {background:linear-gradient(110deg,#31283b,#242529 77%)!important;border-color:#4f4261!important;}
.drawer-actions .drawer-action--started {background:linear-gradient(110deg,#393123,#242529 77%)!important;border-color:#625039!important;}
.drawer-actions .drawer-action--purchase {background:linear-gradient(110deg,#273447,#242529 77%)!important;border-color:#3b516b!important;}
.drawer-actions .drawer-action-glyph {display:inline-flex!important;align-items:center;justify-content:flex-start;background:none!important;box-shadow:none!important;border:0!important;color:var(--action-ink)!important;width:36px;min-height:34px;padding:0!important;}
.drawer-actions .drawer-action .drawer-action-glyph svg {width:32px!important;height:32px!important;stroke:currentColor!important;stroke-width:1.4!important;}
.drawer-actions .drawer-action:disabled .drawer-action-glyph {opacity:.65;}
.modal .modal-action-heading {display:flex;gap:12px;align-items:center;}
.modal .modal-action-glyph {display:inline-flex;color:#adb2bc;flex:none;}
.modal .modal-action-glyph svg {width:30px;height:30px;stroke-width:1.4;}
.modal[data-operation-tone="income"] .modal-action-glyph {color:#83d5a8;}
.modal[data-operation-tone="exhausted"] .modal-action-glyph {color:#e89aa0;}
.modal[data-operation-tone="adjustment"] .modal-action-glyph {color:#c2a5ed;}
.modal[data-operation-tone="started"] .modal-action-glyph {color:#ead09a;}
.modal[data-operation-tone="purchase"] .modal-action-glyph {color:#9ac7f3;}
/* The stock/using preview is a neutral charcoal gradient, never the original #f1f1f1. */
.modal .input-preview,
.modal #opPreview,
.modal #editPreview,
.modal #newItemPurchasePreview {
  background:radial-gradient(ellipse 85% 220% at 0 50%,rgba(130,138,156,.19),transparent 94%),linear-gradient(110deg,#32353c,#23252a 73%)!important;
  border:1px solid #424650!important;
  color:#d4d7dd!important;
  box-shadow:inset 0 1px 0 #ffffff08!important;
  line-height:1.55;
}
/* Notice badge: real alert red, with readable contrast. */
#noticeButton .notice-badge {
  background:#be3948!important;
  border:1px solid #df6873!important;
  color:#fff!important;
  box-shadow:0 0 0 2px #17181b,0 2px 9px #0009!important;
  font-weight:750!important;
}
/* Differentiate out-of-stock (urgent) from low stock (heads-up). */
.notifications-panel .notice-entry {
  position:relative;
  margin:9px 0;
  border:1px solid #393c44!important;
  border-radius:12px;
  padding:12px 13px!important;
  background:#22242a;
}
.notifications-panel .notice-entry--empty {
  border-color:#76414b!important;
  background:radial-gradient(ellipse 110% 150% at -10% 50%,#a038444a,transparent 95%),linear-gradient(110deg,#332127,#202126 80%);
  box-shadow:inset 3px 0 0 #e77984!important;
}
.notifications-panel .notice-entry--low {
  border-color:#675437!important;
  background:radial-gradient(ellipse 100% 170% at -10% 50%,#8c652b37,transparent 90%),linear-gradient(110deg,#2e291f,#202126 80%);
  box-shadow:inset 3px 0 0 #d7b370!important;
}
.notifications-panel .notice-entry--delivery {border-color:#465065!important;background:linear-gradient(100deg,#262c39,#202126 80%);}
.notifications-panel .notice-entry--forecast {border-color:#4c465e!important;background:linear-gradient(100deg,#2b2737,#202126 80%);}
.notifications-panel .notice-kind-pill {display:inline-flex;padding:3px 7px;margin-bottom:8px;border-radius:5px;font-size:9px;font-weight:750;letter-spacing:.08em;color:#c5c6ca;background:#34363c;}
.notifications-panel .notice-entry--empty .notice-kind-pill {color:#ffb6bf;background:#71323c;}
.notifications-panel .notice-entry--low .notice-kind-pill {color:#ebd19b;background:#59452b;}
.notifications-panel .notice-entry--delivery .notice-kind-pill {color:#b2c9e6;background:#35445c;}
.notifications-panel .notice-entry--forecast .notice-kind-pill {color:#d4bdea;background:#443550;}
.notifications-panel .notice-entry--empty > strong {color:#ffd7dc!important;}
.notifications-panel .notice-entry--low > strong {color:#f0dcb3!important;}
/* One search focus ring (around the outer wrapper only). */
body .search-wrap #globalSearch,
body .search-wrap #globalSearch:focus,
body .search-wrap #globalSearch:focus-visible {
  background:transparent!important;
  border:0!important;
  outline:none!important;
  outline-offset:0!important;
  box-shadow:none!important;
  -webkit-appearance:none;
}
body .search-wrap:focus-within {
  border:1px solid transparent!important;
  outline:0!important;
  box-shadow:0 0 0 1px #855aa32d!important;
  background:linear-gradient(#202125,#202125) padding-box,
    linear-gradient(115deg,#6b4595,#c48cf1,#7d62b6,#d1a5f5,#6b4595) border-box!important;
  background-size:100% 100%,240% 100%!important;
  animation:hiOutlineFlow 5s linear infinite!important;
}
/* Subtle movement only on active violet borders, with solid dark interior. */
.sidebar :is(.nav-link,.area-link).active,
.filter-row .chip.active {
  background-size:100% 100%,240% 100%!important;
  animation:hiOutlineFlow 6s linear infinite!important;
}
@keyframes hiOutlineFlow {
  0% {background-position:0 0,0% 50%;}
  100% {background-position:0 0,200% 50%;}
}
/* Preserve current size but render home-area SVG paths more delicately. */
.area-card--detail .area-emoji .room-icon {
  stroke-width:1.05!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
@media(prefers-reduced-motion:reduce){
  body .search-wrap:focus-within,
  .sidebar :is(.nav-link,.area-link).active,
  .filter-row .chip.active {animation:none!important;}
}


/* hi-visual-fix-v1: animated purple border without flashing the dark interior. */
@property --hi-border-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
/* A genuinely moving highlight, not a nearly static shift of two gradients. */
.sidebar :is(.nav-link,.area-link).active,
html[data-appearance="dark"] .sidebar :is(.nav-link,.area-link).active,
.filter-row .chip.active,
body .search-wrap:focus-within {
  position: relative !important;
  isolation: isolate;
  border: 1px solid #744e97 !important;
  animation: none !important;
}
.sidebar :is(.nav-link,.area-link).active::after,
.filter-row .chip.active::after,
body .search-wrap:focus-within::after {
  content: '';
  position: absolute;
  inset: -1px;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  padding: 1.5px;
  background: linear-gradient(105deg,#4d2b7b,#b96de7,#f2c9ff,#634098,#ad64e0,#4d2b7b);
  background-size: 330% 100%;
  animation: hiVioletSweep 2.8s linear infinite;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
}
@supports (background: conic-gradient(from 0deg,#fff,#000)) {
  .sidebar :is(.nav-link,.area-link).active::after,
  .filter-row .chip.active::after,
  body .search-wrap:focus-within::after {
    background: conic-gradient(from var(--hi-border-angle),#7645ad 0deg,#ecbaff 50deg,#804db8 112deg,#40245c 165deg,#a86bdb 238deg,#ffd4ff 280deg,#7645ad 360deg);
    animation: hiVioletOrbit 3.6s linear infinite;
  }
}
@keyframes hiVioletOrbit { to { --hi-border-angle: 360deg; } }
@keyframes hiVioletSweep { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
/* The previous rule re-styled the percentage text as a second progress bar.
   Only the direct child span is the actual progress bar. */
.cost-amount small .growth-percent {
  display: inline !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border-radius: 0 !important;
}
/* Lighter paths with unchanged icon sizes. */
.area-card--detail .area-emoji .room-icon,
.sidebar .area-link .room-icon {
  stroke-width: .8 !important;
}
@media (prefers-reduced-motion: reduce) {
  .sidebar :is(.nav-link,.area-link).active::after,
  .filter-row .chip.active::after,
  body .search-wrap:focus-within::after { animation: none !important; }
}
