/* =========================================================
   TREEHOUSE — CIGAR DOSSIER
   COMPLETE CONSOLIDATED PRESENTATION — 2026-09-15

   Visual authority:
   - accepted Cigar Dossier family
   - accepted Notes surface
   - accepted Aging v2 surface
   - Mobile / Tablet / Desktop-Laptop experience model

   Behavioral authority:
   - existing index.html / app.js
   - existing Humidor, StorageArea, Inventory, Aging, Notes,
     Photos, History, archive/delete, auth and sync lifecycles

   This file is the single Dossier presentation authority.
   Production structure/behavior remains owned by index.html / app.js.

   Layout contract:
   - Flexbox is the default relationship primitive.
   - Meaningful containers own direction, wrap, order, and alignment.
   - Direct children grow/shrink from percentage-based proportions.
   - Breakpoints/orientation change parent relationships, not child hacks.
   ========================================================= */

#manageCigarOverlay,
#manageCigarOverlay *,
#manageCigarOverlay *::before,
#manageCigarOverlay *::after {
  box-sizing: border-box;
}

/* The Dossier supplies theme colors only; Quiet Ledger geometry lives in app.css. */
#manageCigarOverlay .collection-history-detail.archived-dossier {
  border-color: var(--dossier-border-soft);
  background: rgba(255, 252, 245, 0.72);
}

#manageCigarOverlay .archive-ledger-overview .collection-history-overview-item {
  border-left-color: var(--dossier-border-soft);
}

#manageCigarOverlay .archive-ledger-overview .collection-history-overview-item:first-child {
  border-left: 0;
}

@media (max-width: 640px) {
  #manageCigarOverlay .archive-ledger-overview .collection-history-overview-item:nth-child(odd) {
    border-left: 0;
  }
}

#manageCigarOverlay {
  --dossier-bg: #0b0a08;
  --dossier-shell: #15120f;
  --dossier-surface: #191612;
  --dossier-raised: #201b15;
  --dossier-soft: #282219;
  --dossier-border: #3a3024;
  --dossier-border-soft: #2d2822;
  --dossier-text: #eee7d8;
  --dossier-muted: #9d9283;
  --dossier-dim: #746b60;
  --dossier-gold: #d6a756;
  --dossier-gold-bright: #efc66f;
  --dossier-green: #8eae84;
  --dossier-green-dark: #182018;
  --dossier-danger: #d3a098;
  --dossier-danger-border: #65433e;
  --dossier-radius: 16px;
  --dossier-radius-sm: 11px;
  --dossier-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
  --dossier-font-display: Georgia, "Times New Roman", serif;

  /* Responsive boundary contract */
  --dossier-boundary-card: 42rem;
  --dossier-boundary-panel: 34rem;
  --dossier-boundary-form: 46rem;
  --dossier-boundary-detail: 69rem;
  --dossier-gap-mobile: 10px;
  --dossier-gap-tablet: 12px;
  --dossier-gap-desktop: 14px;
}

#manageCigarOverlay[hidden],
#manageCigarOverlay .manage-dossier-header[hidden],
#manageCigarOverlay .manage-tabs[hidden],
#manageCigarOverlay [hidden] {
  display: none !important;
}

/* =========================================================
   DOSSIER — CONTENT FLOW CONTRACT

   Start alignment is the default. Layout containers own gaps
   and padding. Flex children may grow/shrink inside their
   percentage relationship without forcing text outside the
   container. Pills/buttons remain content-sized unless their
   parent relationship explicitly promotes them to full width.
   ========================================================= */
#manageCigarOverlay {
  text-align: start;
}

#manageCigarOverlay :where(
  section,
  article,
  header,
  nav,
  form,
  ul,
  li,
  div
) {
  min-width: 0;
}

#manageCigarOverlay :where(
  h2,
  h3,
  h4,
  h5,
  p,
  label,
  strong,
  span
) {
  max-width: 100%;
}

#manageCigarOverlay :where(h2, h3, h4, h5, p, label) {
  overflow-wrap: anywhere;
}

#manageCigarOverlay :where(button, input, textarea, select) {
  min-width: 0;
  max-width: 100%;
}

/* =========================================================
   DOSSIER — OVERLAY / WORKSPACE
   ========================================================= */

#manageCigarOverlay.cigar-detail-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100dvh;
  padding: 24px;
  overflow: hidden;
  background: rgba(7, 6, 5, 0.9);
}

#manageCigarOverlay .manage-cigar {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(94vw, 72rem);
  height: min(48rem, calc(100dvh - 48px));
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--dossier-border);
  border-radius: 20px;
  background:
    radial-gradient(
      circle at 75% -15%,
      rgba(91, 62, 31, 0.34),
      transparent 36%
    ),
    linear-gradient(180deg, #191612 0%, #11100e 100%);
  box-shadow: var(--dossier-shadow);
  color: var(--dossier-text);
}

#manageCigarOverlay .cigar-detail-close {
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: #bdb3a4;
  font-size: 25px;
  line-height: 1;
}

#manageCigarOverlay .cigar-detail-close:hover,
#manageCigarOverlay .cigar-detail-close:focus-visible {
  border-color: var(--dossier-border);
  background: var(--dossier-soft);
  color: var(--dossier-gold-bright);
}

/* =========================================================
   DOSSIER — PERSISTENT CIGAR IDENTITY
   ========================================================= */

#manageCigarOverlay .manage-dossier-header {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 22px;
  width: 100%;
  padding: 18px 62px 16px 20px;
  border-bottom: 1px solid var(--dossier-border);
}

#manageCigarOverlay .manage-dossier-identity {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 16px;
}

#manageCigarOverlay .manage-dossier-photo {
  flex: 0 0 76px;
  width: 76px;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid #4b3927;
  border-radius: 14px;
  background: linear-gradient(145deg, #654525, #2f2115);
  color: var(--dossier-gold-bright);
  font-family: var(--dossier-font-display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  padding-bottom: 0.1em;
}

#manageCigarOverlay .manage-dossier-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#manageCigarOverlay .manage-dossier-copy {
  min-width: 0;
}

#manageCigarOverlay .manage-dossier-copy .eyebrow {
  margin: 0 0 4px;
  color: var(--dossier-gold);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#manageCigarOverlay .manage-dossier-copy h2 {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--dossier-text);
  font-family: var(--dossier-font-display);
  font-size: clamp(22px, 2.3vw, 30px);
  font-weight: 700;
  line-height: 1.08;
}

#manageCigarOverlay .manage-dossier-series,
#manageCigarOverlay .manage-dossier-meta {
  margin: 4px 0 0;
  color: var(--dossier-muted);
  font-size: 12px;
  line-height: 1.35;
}

#manageCigarOverlay .manage-dossier-quick {
  flex: 0 0 auto;
  width: auto;
  display: flex;
  align-items: stretch;
  gap: 7px;
}

#manageCigarOverlay .manage-dossier-quick-item {
  min-width: 82px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 9px 10px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 11px;
  background: rgba(29, 25, 19, 0.72);
}

#manageCigarOverlay .manage-dossier-quick-item strong {
  color: var(--dossier-text);
  font-family: var(--dossier-font-display);
  font-size: 18px;
  line-height: 1.05;
}

#manageCigarOverlay .manage-dossier-quick-item span {
  margin-top: 3px;
  color: var(--dossier-muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-align: center;
  text-transform: uppercase;
}

/* =========================================================
   DOSSIER — LIFECYCLE NAVIGATION
   Overview → Cigar → Aging → Storage → Notes → Photos → Inventory
   Existing production buttons keep their DOM order; styling
   treats the rail as one coherent lifecycle control.
   ========================================================= */

#manageCigarOverlay .manage-tabs {
  flex: 0 0 auto;
  min-width: 0;
  width: 100%;
  display: flex;
  align-items: stretch;
  gap: 2px;
  padding: 0 16px;
  overflow-x: auto;
  overflow-y: hidden;
  border-bottom: 1px solid var(--dossier-border);
  scrollbar-width: none;
}

#manageCigarOverlay .manage-tabs::-webkit-scrollbar {
  display: none;
}

#manageCigarOverlay .manage-tab {
  flex: 1 0 64px;
  min-height: 52px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 7px 10px 6px;
  border: 0;
  border-radius: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  box-shadow: none;
  color: var(--dossier-muted);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

#manageCigarOverlay .manage-tab .action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
}

#manageCigarOverlay .manage-tab:hover,
#manageCigarOverlay .manage-tab:focus-visible {
  color: var(--dossier-text);
}

#manageCigarOverlay .manage-tab.is-active {
  border-bottom-color: var(--dossier-green);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  color: var(--dossier-green);
}

/* =========================================================
   DOSSIER — ACTIVE WORKSPACE / SCROLL OWNER
   ========================================================= */

#manageCigarOverlay .manage-content {
  flex: 1 1 auto;
  height: 0;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 20px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  scrollbar-gutter: stable;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

#manageCigarOverlay .manage-content > * {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

#manageCigarOverlay .manage-content section,
#manageCigarOverlay .manage-content form {
  min-width: 0;
  min-height: 0;
  max-width: 100%;
}

#manageCigarOverlay .manage-inventory,
#manageCigarOverlay .inventory-dashboard,
#manageCigarOverlay .inventory-dashboard-grid,
#manageCigarOverlay .inventory-adjustment-form {
  min-height: 0;
}

/* =========================================================
   DOSSIER — SHARED TYPE / SURFACES / ACTIONS
   ========================================================= */

#manageCigarOverlay h3,
#manageCigarOverlay h4,
#manageCigarOverlay h5 {
  color: var(--dossier-text);
  font-family: var(--dossier-font-display);
}

#manageCigarOverlay .manage-overview-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: var(--dossier-surface);
}

#manageCigarOverlay .manage-overview-card > h3,
#manageCigarOverlay .manage-overview-card > h4 {
  margin: 0 0 12px;
  font-size: 18px;
  line-height: 1.15;
}

#manageCigarOverlay .manage-overview-primary {
  margin: 0;
  color: var(--dossier-text);
  font-weight: 700;
}

#manageCigarOverlay .manage-overview-meta,
#manageCigarOverlay .form-help {
  margin: 5px 0 0;
  color: var(--dossier-muted);
  font-size: 12px;
  line-height: 1.45;
}

#manageCigarOverlay .primary-action,
#manageCigarOverlay .secondary-action {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
  border-radius: 10px;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
}

#manageCigarOverlay .primary-action {
  border: 1px solid #d0a052;
  background: var(--dossier-gold);
  color: #17120b;
}

#manageCigarOverlay .primary-action:hover,
#manageCigarOverlay .primary-action:focus-visible {
  background: var(--dossier-gold-bright);
}

#manageCigarOverlay .secondary-action {
  border: 1px solid var(--dossier-border);
  background: var(--dossier-soft);
  color: var(--dossier-text);
}

#manageCigarOverlay .secondary-action:hover,
#manageCigarOverlay .secondary-action:focus-visible {
  border-color: #65513a;
  background: #322a20;
  color: var(--dossier-gold-bright);
}

#manageCigarOverlay .ui-icon,
#manageCigarOverlay .action-icon svg,
#manageCigarOverlay button svg {
  flex: 0 0 auto;
}

/* =========================================================
   DOSSIER — SHARED FORMS
   ========================================================= */

#manageCigarOverlay .manage-edit-form,
#manageCigarOverlay .aging-form,
#manageCigarOverlay .inventory-adjustment-form,
#manageCigarOverlay .storage-reading-form,
#manageCigarOverlay .storage-preferences-form,
#manageCigarOverlay .storage-assignment-form,
#manageCigarOverlay .notes-form,
#manageCigarOverlay .storage-area-form,
#manageCigarOverlay .storage-area-reading-form,
#manageCigarOverlay .storage-area-preferences-form {
  width: min(100%, 46rem);
  margin: 0 auto;
  padding: 20px;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: var(--dossier-raised);
}

#manageCigarOverlay .form-field {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 14px;
}

#manageCigarOverlay .form-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

#manageCigarOverlay .form-row > .form-field {
  flex: 1 1 0;
}

#manageCigarOverlay .form-field label,
#manageCigarOverlay fieldset legend {
  color: #cfc5b6;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#manageCigarOverlay input,
#manageCigarOverlay select,
#manageCigarOverlay textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #4a3d2e;
  border-radius: 9px;
  background: #100e0c;
  color: var(--dossier-text);
}

#manageCigarOverlay input,
#manageCigarOverlay select {
  min-height: 42px;
  padding: 0 11px;
}

#manageCigarOverlay textarea {
  min-height: 104px;
  padding: 11px;
  resize: vertical;
}

#manageCigarOverlay input:focus,
#manageCigarOverlay select:focus,
#manageCigarOverlay textarea:focus {
  border-color: var(--dossier-gold);
  outline: 1px solid var(--dossier-gold);
  outline-offset: 0;
}

#manageCigarOverlay .aging-form-actions,
#manageCigarOverlay .inventory-form-actions,
#manageCigarOverlay .storage-form-actions,
#manageCigarOverlay .notes-form-actions,
#manageCigarOverlay .cigar-detail-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

/* =========================================================
   DOSSIER — OVERVIEW
   Current state orientation + operation discovery.
   ========================================================= */

#manageCigarOverlay .dossier-overview {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#manageCigarOverlay .dossier-section {
  display: flex;
  flex-direction: column;
}

#manageCigarOverlay .dossier-section-label {
  margin: 14px 0 8px;
  color: var(--dossier-dim);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#manageCigarOverlay .dossier-current-state {
  overflow: hidden;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: var(--dossier-surface);
}

#manageCigarOverlay .dossier-state-row {
  width: 100%;
  min-height: 64px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border: 0;
  border-bottom: 1px solid var(--dossier-border-soft);
  background: transparent;
  color: inherit;
  text-align: left;
}

#manageCigarOverlay .dossier-state-row:last-child {
  border-bottom: 0;
}

#manageCigarOverlay .dossier-state-row:hover,
#manageCigarOverlay .dossier-state-row:focus-visible {
  background: #201c16;
}

#manageCigarOverlay .dossier-state-icon {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #493a29;
  border-radius: 10px;
  background: #211a13;
  color: var(--dossier-gold);
}

#manageCigarOverlay .dossier-state-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

#manageCigarOverlay .dossier-state-title {
  color: var(--dossier-text);
  font-size: 13px;
}

#manageCigarOverlay .dossier-state-meta {
  overflow: hidden;
  color: var(--dossier-muted);
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#manageCigarOverlay .dossier-state-value {
  flex: 0 0 auto;
  color: #cfc5b6;
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

#manageCigarOverlay .dossier-state-chevron {
  flex: 0 0 auto;
  color: var(--dossier-dim);
  font-size: 22px;
}

#manageCigarOverlay .dossier-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#manageCigarOverlay .dossier-action {
  flex: 1 1 calc(25% - 8px);
  min-width: 112px;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 0 13px;
  border: 1px solid var(--dossier-border);
  border-radius: 11px;
  background: var(--dossier-raised);
  color: var(--dossier-text);
  font-weight: 750;
}

#manageCigarOverlay .dossier-action:hover,
#manageCigarOverlay .dossier-action:focus-visible {
  border-color: #6b5436;
  background: #2a2219;
  color: var(--dossier-gold-bright);
}

#manageCigarOverlay .dossier-action-icon {
  display: inline-flex;
  color: var(--dossier-gold);
}

#manageCigarOverlay .dossier-cigar-actions {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 8px;
}

#manageCigarOverlay .dossier-cigar-actions .secondary-action:last-child {
  color: var(--dossier-danger);
  border-color: var(--dossier-danger-border);
  background: transparent;
}

/* =========================================================
   DOSSIER — INVENTORY
   Owned quantity + fast mutation + bounded activity.
   ========================================================= */

#manageCigarOverlay .manage-inventory,
#manageCigarOverlay .inventory-dashboard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#manageCigarOverlay .inventory-dashboard-grid {
  display: flex;
  align-items: stretch;
  gap: 16px;
}

#manageCigarOverlay .inventory-quantity-card {
  flex: 0 1 38%;
}

#manageCigarOverlay .inventory-history-card {
  flex: 1 1 62%;
  min-width: 0;
}

#manageCigarOverlay .inventory-current-quantity {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 10px 0 16px;
}

#manageCigarOverlay .inventory-current-quantity strong {
  color: var(--dossier-gold-bright);
  font-family: var(--dossier-font-display);
  font-size: 46px;
  line-height: 0.95;
}

#manageCigarOverlay .inventory-current-quantity > span:last-child {
  color: var(--dossier-muted);
  font-size: 13px;
}

#manageCigarOverlay .inventory-cigar-icon {
  display: inline-flex;
  align-self: center;
  color: var(--dossier-gold);
}

#manageCigarOverlay .inventory-quick-controls {
  display: flex;
  gap: 8px;
}

#manageCigarOverlay .quantity-button,
#manageCigarOverlay .inventory-quantity-button {
  flex: 1 1 0;
  min-height: 42px;
  border: 1px solid var(--dossier-border);
  border-radius: 10px;
  background: var(--dossier-soft);
  color: var(--dossier-text);
  font-size: 22px;
}

#manageCigarOverlay .quantity-button:hover,
#manageCigarOverlay .quantity-button:focus-visible {
  border-color: var(--dossier-gold);
  color: var(--dossier-gold-bright);
}

#manageCigarOverlay .inventory-actions,
#manageCigarOverlay .inventory-history-actions {
  display: flex;
  margin-top: 12px;
}

#manageCigarOverlay .inventory-history-list {
  max-height: 19rem;
  margin-top: 12px;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  border-top: 1px solid var(--dossier-border-soft);
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

#manageCigarOverlay .inventory-history-item {
  padding: 12px 2px;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .inventory-history-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#manageCigarOverlay .inventory-history-reason {
  color: var(--dossier-text);
  font-size: 12px;
}

#manageCigarOverlay .inventory-history-reason--icon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

#manageCigarOverlay .inventory-history-date {
  color: var(--dossier-dim);
  font-size: 10px;
}

#manageCigarOverlay .inventory-history-change,
#manageCigarOverlay .inventory-history-note {
  margin: 5px 0 0;
  color: var(--dossier-muted);
  font-size: 11px;
  line-height: 1.4;
}

/* =========================================================
   DOSSIER — STORAGE
   Placement + environment + readings + bounded history.
   ========================================================= */

#manageCigarOverlay .manage-storage,
#manageCigarOverlay .storage-dashboard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#manageCigarOverlay .storage-dashboard-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 14px;
}

#manageCigarOverlay .storage-latest-card {
  flex: 1 1 calc(50% - 7px);
}

#manageCigarOverlay .storage-preferences-card {
  flex: 1 1 calc(50% - 7px);
}

#manageCigarOverlay .storage-history-card {
  flex: 1 1 100%;
}

#manageCigarOverlay .storage-location-card {
  background: linear-gradient(180deg, #1d1913, #17140f);
}

#manageCigarOverlay .storage-location-list,
#manageCigarOverlay .storage-allocation-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 12px;
}

#manageCigarOverlay .storage-location-item,
#manageCigarOverlay .storage-allocation-row {
  padding: 12px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 11px;
  background: #13110e;
}

#manageCigarOverlay .storage-location-item-header,
#manageCigarOverlay .storage-allocation-row,
#manageCigarOverlay .storage-summary-row,
#manageCigarOverlay .storage-history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

#manageCigarOverlay .storage-location-quantity {
  flex: 0 0 auto;
  color: var(--dossier-gold-bright);
  font-size: 12px;
  font-weight: 800;
}

#manageCigarOverlay .storage-location-environment {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-top: 8px;
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .storage-location-environment-label,
#manageCigarOverlay .storage-summary-label {
  color: var(--dossier-dim);
}

#manageCigarOverlay .storage-location-environment-value,
#manageCigarOverlay .storage-summary-value {
  color: #cfc5b6;
  text-align: right;
}

#manageCigarOverlay .storage-location-summary,
#manageCigarOverlay .storage-recorded-time {
  margin: 10px 0 0;
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .storage-location-actions,
#manageCigarOverlay .storage-reading-actions,
#manageCigarOverlay .storage-preference-actions,
#manageCigarOverlay .storage-history-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

#manageCigarOverlay .storage-reading-actions > *,
#manageCigarOverlay .storage-history-row-actions > * {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}

#manageCigarOverlay .storage-current-values {
  display: flex;
  gap: 12px;
  margin: 10px 0;
}

#manageCigarOverlay .storage-current-value {
  flex: 1 1 0;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 10px;
  background: #11100d;
}

#manageCigarOverlay .storage-current-value strong {
  display: block;
  color: var(--dossier-gold-bright);
  font-family: var(--dossier-font-display);
  font-size: 26px;
}

#manageCigarOverlay .storage-current-value span {
  color: var(--dossier-muted);
  font-size: 10px;
  text-transform: uppercase;
}

#manageCigarOverlay .storage-reading-status {
  margin: 10px 0 0;
  font-size: 11px;
  font-weight: 800;
}

#manageCigarOverlay .storage-reading-status.is-good {
  color: #afd0a5;
}

#manageCigarOverlay .storage-reading-status.needs-attention {
  color: #d7a79e;
}

#manageCigarOverlay .storage-summary-details {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

#manageCigarOverlay .storage-summary-row {
  padding: 9px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
  font-size: 11px;
}

#manageCigarOverlay .storage-summary-row:last-child {
  border-bottom: 0;
}

#manageCigarOverlay .storage-stats-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 12px;
}

#manageCigarOverlay .storage-stat-card {
  flex: 1 1 180px;
  padding: 12px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 10px;
  background: #11100d;
}

#manageCigarOverlay .storage-history-list,
#manageCigarOverlay .storage-movement-history-list {
  display: flex;
  flex-direction: column;
  overflow: visible;
}

#manageCigarOverlay .storage-history-item,
#manageCigarOverlay .storage-movement-history-item {
  min-width: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .storage-history-item:first-child,
#manageCigarOverlay .storage-movement-history-item:first-child {
  padding-top: 4px;
}

#manageCigarOverlay .storage-history-item:last-child,
#manageCigarOverlay .storage-movement-history-item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
#manageCigarOverlay .storage-history-row {
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .storage-history-row:last-child {
  border-bottom: 0;
}

#manageCigarOverlay .storage-history-date {
  flex: 0 0 25%;
  color: var(--dossier-dim);
  font-size: 11px;
}

#manageCigarOverlay .storage-history-value {
  flex: 1 1 0;
  min-width: 0;
  color: var(--dossier-text);
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

#manageCigarOverlay .storage-history-value:last-child {
  text-align: right;
}

#manageCigarOverlay .storage-movement-history-date,
#manageCigarOverlay .storage-history-count {
  color: var(--dossier-dim);
  font-size: 10px;
}

#manageCigarOverlay .storage-movement-history-description {
  display: block;
  margin-top: 4px;
  color: var(--dossier-text);
  font-size: 12px;
}

#manageCigarOverlay .storage-movement-route {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 5px;
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .storage-movement-arrow {
  color: var(--dossier-gold);
}

#manageCigarOverlay .storage-input-unit {
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid #4a3d2e;
  border-radius: 9px;
  background: #100e0c;
}

#manageCigarOverlay .storage-input-unit input {
  border: 0;
  border-radius: 0;
}

#manageCigarOverlay .storage-input-unit span {
  flex: 0 0 auto;
  padding: 0 10px;
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .storage-fieldset {
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid var(--dossier-border);
  border-radius: 11px;
}

/* =========================================================
   DOSSIER — CIGAR
   Identity/specification view. Overview remains operational.
   ========================================================= */

#manageCigarOverlay .manage-cigar-details {
  display: flex;
  align-items: stretch;
  gap: 22px;
}

#manageCigarOverlay .manage-cigar-details-photo {
  flex: 0 1 34%;
  width: 34%;
  min-width: 14rem;
  height: 12rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: linear-gradient(145deg, #654525, #2f2115);
  color: var(--dossier-gold-bright);
  font-family: var(--dossier-font-display);
  font-size: 42px;
  font-weight: 700;
}

#manageCigarOverlay .manage-cigar-details-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#manageCigarOverlay .manage-cigar-details-content {
  flex: 1 1 62%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#manageCigarOverlay .manage-cigar-details-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

#manageCigarOverlay .manage-cigar-details-heading h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1.1;
}

#manageCigarOverlay .manage-cigar-details-cards {
  display: flex;
  align-items: stretch;
  gap: 14px;
  flex-wrap: wrap;
}

#manageCigarOverlay .manage-cigar-details-card {
  flex: 1 1 16rem;
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: var(--dossier-surface);
}

#manageCigarOverlay .manage-cigar-details-card > h4 {
  margin: 0 0 10px;
  color: var(--dossier-muted);
  font-family: inherit;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

#manageCigarOverlay .manage-cigar-details-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 9px 0;
  border-top: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .manage-cigar-details-row:first-of-type {
  border-top: 0;
}

#manageCigarOverlay .manage-cigar-details-label {
  flex: 0 0 auto;
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .manage-cigar-details-value {
  min-width: 0;
  color: var(--dossier-text);
  font-size: 12px;
  font-weight: 700;
  text-align: right;
  overflow-wrap: anywhere;
}

/* =========================================================
   DOSSIER — AGING
   Plan state → progress → plan facts → operations.
   Green carries active/progress state; gold remains action language.
   ========================================================= */

#manageCigarOverlay .manage-aging {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#manageCigarOverlay .aging-plan-card {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 16px;
  padding: 20px;
}

#manageCigarOverlay .aging-plan-card > h3 {
  flex: 1 1 auto;
  margin: 0;
  align-self: center;
  font-size: 24px;
}

#manageCigarOverlay .aging-plan-card > .manage-overview-primary {
  flex: 0 0 auto;
  align-self: center;
  display: inline-flex;
  width: fit-content;
  margin-left: auto;
  padding: 6px 10px;
  border: 1px solid #52664c;
  border-radius: 999px;
  background: var(--dossier-green-dark);
  color: #b8d2af;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#manageCigarOverlay .aging-progress {
  order: 2;
  flex: 1 1 60%;
  min-width: 0;
  margin: 0;
  padding: 22px;
  border: 1px solid var(--dossier-border);
  border-radius: 14px;
  background: var(--dossier-raised);
}

#manageCigarOverlay .aging-summary-details {
  order: 3;
  flex: 1 1 34%;
  min-width: 16rem;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 18px;
  border: 1px solid var(--dossier-border);
  border-radius: 14px;
  background: var(--dossier-surface);
}

#manageCigarOverlay .aging-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 11px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .aging-summary-row:first-child {
  padding-top: 0;
}

#manageCigarOverlay .aging-summary-label {
  color: var(--dossier-dim);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

#manageCigarOverlay .aging-summary-value {
  color: var(--dossier-text);
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

#manageCigarOverlay .aging-tracking-description {
  order: 99;
  margin: 14px 0 0;
  padding: 12px 14px;
  border-left: 3px solid var(--dossier-green);
  background: #151710;
  color: var(--dossier-muted);
  font-size: 12px;
  line-height: 1.45;
}

#manageCigarOverlay .aging-progress-header,
#manageCigarOverlay .aging-progress-meta {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}

#manageCigarOverlay .aging-progress-header span {
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .aging-progress-header strong {
  color: var(--dossier-gold-bright);
  font-family: var(--dossier-font-display);
  font-size: 42px;
  line-height: 1;
}

#manageCigarOverlay .aging-progress-track {
  height: 13px;
  margin: 16px 0 11px;
  overflow: hidden;
  border: 1px solid #3b3329;
  border-radius: 999px;
  background: #100e0b;
}

#manageCigarOverlay .aging-progress-bar {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #6f8f67, #94b287);
}

#manageCigarOverlay .aging-progress-meta {
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .aging-progress-complete .aging-progress-header strong {
  color: #b8d2af;
}

#manageCigarOverlay .aging-plan-actions {
  order: 4;
  flex: 0 0 100%;
  display: flex;
  justify-content: flex-end;
  margin-top: 2px;
}

/* =========================================================
   DOSSIER — PHOTOS
   Image-forward media management.
   ========================================================= */

#manageCigarOverlay .manage-photo {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#manageCigarOverlay .manage-photo > h3 {
  margin: 0;
  font-size: 24px;
}

#manageCigarOverlay .manage-photo-primary-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 14px;
  border: 1px solid var(--dossier-border);
  border-radius: var(--dossier-radius);
  background: var(--dossier-surface);
}

#manageCigarOverlay .manage-photo-primary-section > strong {
  color: var(--dossier-muted);
  font-size: 10px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

#manageCigarOverlay .manage-photo-primary {
  width: 100%;
  height: clamp(220px, 40vh, 390px);
  object-fit: contain;
  border-radius: 12px;
  background: #0d0b09;
}

#manageCigarOverlay .manage-photo > h4 {
  margin: 6px 0 0;
  font-size: 17px;
}

#manageCigarOverlay .manage-photo-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

#manageCigarOverlay .manage-photo-gallery-item {
  position: relative;
  flex: 1 1 calc(33.333% - 12px);
  min-width: 190px;
  max-width: calc(50% - 6px);
  overflow: hidden;
  border: 1px solid var(--dossier-border);
  border-radius: 13px;
  background: var(--dossier-surface);
}

#manageCigarOverlay .manage-photo-gallery-item.is-primary {
  border-color: #705737;
}

#manageCigarOverlay .manage-photo-gallery-item > img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #0d0b09;
}

#manageCigarOverlay .manage-photo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 9px;
}

#manageCigarOverlay .manage-photo-actions .secondary-action {
  flex: 1 1 auto;
  min-height: 36px;
  padding-inline: 10px;
  font-size: 10px;
}

#manageCigarOverlay .manage-photo-delete-button {
  color: var(--dossier-danger);
  border-color: var(--dossier-danger-border);
  background: transparent;
}

#manageCigarOverlay .manage-photo-primary-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid #52664c;
  border-radius: 999px;
  background: var(--dossier-green-dark);
  color: #b8d2af;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

#manageCigarOverlay .manage-photo-add-button {
  align-self: flex-start;
}

/* =========================================================
   DOSSIER — NOTES
   Reading/writing/history surface.
   History is intentionally visible; no extra reveal layer.
   ========================================================= */

#manageCigarOverlay .manage-notes,
#manageCigarOverlay .notes-dashboard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#manageCigarOverlay .notes-dashboard-grid {
  display: flex;
  align-items: stretch;
  gap: 16px;
}

#manageCigarOverlay .notes-latest-card {
  flex: 0 1 40%;
  background: linear-gradient(180deg, #1d1913, #17140f);
}

#manageCigarOverlay .notes-history-card {
  flex: 1 1 60%;
  min-width: 0;
}

#manageCigarOverlay .note-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 7px;
}

#manageCigarOverlay .note-type {
  color: var(--dossier-gold);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#manageCigarOverlay .note-date {
  color: var(--dossier-dim);
  font-size: 9px;
}

#manageCigarOverlay .note-text {
  margin: 0;
  color: #ded5c6;
  font-family: var(--dossier-font-display);
  font-size: 13px;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

#manageCigarOverlay .notes-primary-actions {
  display: flex;
  margin-top: 14px;
}

#manageCigarOverlay .notes-history-list {
  max-height: 22rem;
  margin-top: 10px;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  border-top: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .note-history-item {
  padding: 12px 2px;
  border-bottom: 1px solid var(--dossier-border-soft);
}

/* =========================================================
   DOSSIER — HISTORY / LIFECYCLE
   Styles the existing collection-history read surfaces when
   they are presented inside the management workspace.
   ========================================================= */

#manageCigarOverlay .collection-history-content,
#manageCigarOverlay .collection-history-detail,
#manageCigarOverlay .collection-history-overview,
#manageCigarOverlay .collection-history-timeline,
#manageCigarOverlay .collection-history-notes {
  color: var(--dossier-text);
}

#manageCigarOverlay .collection-history-header,
#manageCigarOverlay .collection-history-detail-header,
#manageCigarOverlay .collection-history-timeline-top,
#manageCigarOverlay .collection-history-note-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#manageCigarOverlay .collection-history-tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

#manageCigarOverlay .collection-history-tab {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 11px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--dossier-muted);
  font-weight: 750;
}

#manageCigarOverlay .collection-history-tab.is-active {
  border-bottom-color: var(--dossier-gold);
  color: var(--dossier-gold-bright);
}

#manageCigarOverlay .collection-history-overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
}

#manageCigarOverlay .collection-history-overview-item,
#manageCigarOverlay .collection-history-detail-row,
#manageCigarOverlay .collection-history-note,
#manageCigarOverlay .collection-history-storage-condition {
  padding: 12px;
  border: 1px solid var(--dossier-border);
  border-radius: 11px;
  background: var(--dossier-surface);
}

#manageCigarOverlay .collection-history-overview-item {
  min-width: 0;
  padding: 9px 10px;
  border-radius: 0;
}

@media (max-width: 760px) {
  #manageCigarOverlay .collection-history-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#manageCigarOverlay .collection-history-detail-list,
#manageCigarOverlay .collection-history-storage-conditions,
#manageCigarOverlay .collection-history-timeline,
#manageCigarOverlay .collection-history-notes {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

#manageCigarOverlay .collection-history-timeline,
#manageCigarOverlay .collection-history-notes,
#manageCigarOverlay .collection-history-detail-list {
  max-height: 22rem;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}

#manageCigarOverlay .collection-history-timeline-item {
  position: relative;
  display: flex;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .collection-history-timeline-marker {
  flex: 0 0 9px;
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--dossier-green);
}

#manageCigarOverlay .collection-history-eyebrow,
#manageCigarOverlay .collection-history-detail-label,
#manageCigarOverlay .collection-history-section-title {
  color: var(--dossier-dim);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

#manageCigarOverlay .collection-history-detail-value,
#manageCigarOverlay .collection-history-timeline-summary,
#manageCigarOverlay .collection-history-note-body {
  color: var(--dossier-text);
}

#manageCigarOverlay .collection-history-dates,
#manageCigarOverlay .collection-history-detail-dates,
#manageCigarOverlay .collection-history-timeline-date,
#manageCigarOverlay .collection-history-note-date {
  color: var(--dossier-dim);
  font-size: 10px;
}

/* =========================================================
   DOSSIER — STORAGE AREA SUBVIEWS
   FLEX RELATIONSHIP CONTRACT

   Every meaningful layout group owns its children. Children
   grow/shrink from percentage-based relationships. Breakpoints
   change container orientation, wrapping, and proportions rather
   than reaching through unrelated descendants.
   ========================================================= */

#manageCigarOverlay .storage-area-manager,
#manageCigarOverlay .storage-area-detail,
#manageCigarOverlay .storage-area-detail-workspace,
#manageCigarOverlay .storage-area-list-section,
#manageCigarOverlay .storage-area-snapshot {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#manageCigarOverlay .storage-area-manager-header,
#manageCigarOverlay .storage-area-list-header,
#manageCigarOverlay .storage-area-detail-header,
#manageCigarOverlay .storage-area-section-header,
#manageCigarOverlay .storage-area-snapshot-heading {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#manageCigarOverlay .storage-area-manager-header > *,
#manageCigarOverlay .storage-area-list-header > *,
#manageCigarOverlay .storage-area-detail-header > *,
#manageCigarOverlay .storage-area-section-header > *,
#manageCigarOverlay .storage-area-snapshot-heading > * {
  min-width: 0;
}

/* STORAGE AREA CARD COLLECTION */

#manageCigarOverlay .storage-area-grid {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--dossier-gap-desktop);
}

#manageCigarOverlay .storage-area-card {
  flex: 1 1 calc(50% - 7px);
  width: min(100%, var(--dossier-boundary-card));
  min-width: 280px;
  max-width: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 15px;
  border: 1px solid var(--dossier-border);
  border-radius: 13px;
  background: var(--dossier-surface);
}

#manageCigarOverlay .storage-area-card-layout {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Status is supporting state; identity and inventory are equal peers. */
#manageCigarOverlay .storage-area-card-summary {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

#manageCigarOverlay .storage-area-card-status-row {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

#manageCigarOverlay .storage-area-card-primary-row {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 10px;
}

#manageCigarOverlay .storage-area-card-header,
#manageCigarOverlay .storage-area-card-contents {
  flex: 1 1 50%;
  width: 50%;
  min-width: 0;
}

#manageCigarOverlay .storage-area-card-header {
  display: flex;
  align-items: flex-start;
}

#manageCigarOverlay .storage-area-card-identity {
  flex: 1 1 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#manageCigarOverlay .storage-area-card-contents {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 4px;
}

#manageCigarOverlay .storage-area-status {
  flex: 0 1 auto;
  width: auto;
  min-width: max-content;
  max-width: 100%;
  align-self: flex-start;
  color: #b8d2af;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  text-align: left;
  white-space: nowrap;
  overflow-wrap: normal;
}

#manageCigarOverlay .storage-area-status,
#manageCigarOverlay .storage-area-detail-status-summary {
  border: 1px solid var(--dossier-border);
  border-radius: 999px;
  padding: 6px 9px;
}

#manageCigarOverlay .storage-area-status.is-healthy,
#manageCigarOverlay .storage-area-detail-status-summary.is-healthy {
  border-color: rgba(95, 155, 105, 0.42);
  background: rgba(72, 125, 80, 0.14);
  color: #9bb48e;
}

#manageCigarOverlay .storage-area-status.is-attention,
#manageCigarOverlay .storage-area-detail-status-summary.is-attention {
  border-color: rgba(190, 151, 81, 0.45);
  background: rgba(190, 151, 81, 0.12);
  color: var(--dossier-gold-bright);
}

#manageCigarOverlay .storage-area-status.is-unread,
#manageCigarOverlay .storage-area-detail-status-summary.is-unread {
  color: var(--dossier-muted);
}

#manageCigarOverlay .storage-area-card-environment {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 10px;
}

#manageCigarOverlay .storage-area-environment-group {
  flex: 1 1 50%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#manageCigarOverlay .storage-area-environment-label {
  color: var(--dossier-dim);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#manageCigarOverlay .storage-area-environment-values {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

#manageCigarOverlay .storage-area-card-actions {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: auto;
}

#manageCigarOverlay .storage-area-card-actions > * {
  flex: 1 1 100%;
  min-width: 0;
}

/* STORAGE AREA DETAIL */

/*
   Storage Detail owns one readable left-aligned content column.
   The 69rem boundary is derived from its two 34rem environment panels
   plus the 1rem desktop relationship gap; it is not an arbitrary page cap.
   Every major detail group shares this boundary so headings, summary,
   controls, panels, contents, activity, and destructive actions align.
*/
#manageCigarOverlay .storage-area-detail-header,
#manageCigarOverlay .storage-area-detail-summary,
#manageCigarOverlay .storage-area-detail-workspace,
#manageCigarOverlay .storage-area-delete-section {
  width: min(100%, var(--dossier-boundary-detail));
  max-width: var(--dossier-boundary-detail);
  align-self: flex-start;
}

#manageCigarOverlay .storage-area-detail-workspace > *,
#manageCigarOverlay .storage-area-environment-section,
#manageCigarOverlay .storage-area-detail-contents,
#manageCigarOverlay .storage-area-detail-activity {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#manageCigarOverlay .storage-area-detail-contents {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
}

#manageCigarOverlay .storage-area-environment-section {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}

#manageCigarOverlay .storage-area-environment-comparison {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--dossier-gap-desktop);
}

#manageCigarOverlay .storage-area-current-panel,
#manageCigarOverlay .storage-area-environment-panel,
#manageCigarOverlay .storage-area-target-panel {
  flex: 1 1 calc(50% - 6px);
  width: min(100%, var(--dossier-boundary-panel));
  min-width: 240px;
  max-width: var(--dossier-boundary-panel);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  padding: 15px;
  border: 1px solid var(--dossier-border);
  border-radius: 13px;
  background: var(--dossier-surface);
}

#manageCigarOverlay .storage-area-detail-summary,
#manageCigarOverlay .storage-area-snapshot-stats {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 12px;
}

#manageCigarOverlay .storage-area-detail-summary-item,
#manageCigarOverlay .storage-area-snapshot-stat {
  flex: 1 1 33.333%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 6px;
  text-align: start;
}

#manageCigarOverlay .storage-area-detail-summary-item > strong,
#manageCigarOverlay .storage-area-snapshot-stat > strong {
  flex: 0 1 auto;
}

#manageCigarOverlay .storage-area-detail-summary-item > span,
#manageCigarOverlay .storage-area-snapshot-stat > span {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

#manageCigarOverlay .storage-area-detail-status-summary {
  flex-wrap: nowrap;
  align-items: center;
  align-content: flex-start;
  min-width: max-content;
  border-radius: 10px;
  white-space: nowrap;
}

#manageCigarOverlay .storage-area-detail-status-summary > strong,
#manageCigarOverlay .storage-area-detail-status-summary > span {
  flex: 0 0 auto;
  min-width: max-content;
  white-space: nowrap;
  overflow-wrap: normal;
}

#manageCigarOverlay .storage-area-snapshot-stat {
  flex-wrap: nowrap;
  min-width: max-content;
  white-space: nowrap;
}

#manageCigarOverlay .storage-area-snapshot-stat > span {
  flex: 0 0 auto;
  min-width: max-content;
  white-space: nowrap;
  overflow-wrap: normal;
}

#manageCigarOverlay .storage-area-environment-panel-header,
#manageCigarOverlay .storage-area-detail-values,
#manageCigarOverlay .storage-area-target-values {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

#manageCigarOverlay .storage-area-environment-panel-header {
  justify-content: space-between;
}

#manageCigarOverlay .storage-area-detail-value {
  flex: 1 1 calc(50% - 5px);
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 9px;
  background: #11100d;
  text-align: start;
}

#manageCigarOverlay .storage-area-detail-value > strong {
  flex: 0 1 auto;
}

#manageCigarOverlay .storage-area-detail-value > span {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

#manageCigarOverlay .storage-area-snapshot-stat {
  padding: 10px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 9px;
  background: #11100d;
}

/* =========================================================
   STORAGE AREA — INTERNAL TEXT / ASSIGNMENT RHYTHM
   Values, labels, and supporting ranges own separate readable
   space. Assignment labels retain a useful readable boundary;
   numeric controls consume the remaining row width.
   ========================================================= */

#manageCigarOverlay .storage-area-target-values {
  align-items: stretch;
  gap: 12px;
}

#manageCigarOverlay .storage-area-target-group {
  flex: 1 1 calc(50% - 6px);
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--dossier-border-soft);
  border-radius: 9px;
  background: #11100d;
  text-align: start;
}

#manageCigarOverlay .storage-area-target-group > strong {
  line-height: 1.15;
}

#manageCigarOverlay .storage-area-target-group > .manage-overview-meta {
  margin: 0;
  line-height: 1.35;
}

#manageCigarOverlay .storage-allocation-row {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}

#manageCigarOverlay .storage-allocation-row > label {
  flex: 0 1 35%;
  min-width: 7rem;
  max-width: 35%;
  overflow-wrap: normal;
  word-break: normal;
}

#manageCigarOverlay .storage-allocation-row > input {
  flex: 1 1 65%;
  width: auto;
  min-width: 0;
  max-width: 100%;
}

/* STORAGE AREA CIGAR / ACTIVITY LISTS */

#manageCigarOverlay .storage-area-cigar-list,
#manageCigarOverlay .storage-area-detail-activity {
  width: 100%;
  min-width: 0;
  max-height: 20rem;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  padding-inline: 14px;
}

#manageCigarOverlay .storage-area-cigar-row {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}

#manageCigarOverlay .storage-area-cigar-row > :first-child {
  flex: 1 1 80%;
  min-width: 0;
}

#manageCigarOverlay .storage-area-cigar-quantity {
  flex: 0 1 20%;
  min-width: 0;
  color: var(--dossier-gold-bright);
  font-weight: 800;
  text-align: right;
}

#manageCigarOverlay .storage-area-cigar-identity {
  flex: 1 1 80%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

#manageCigarOverlay .storage-area-cigar-identity strong,
#manageCigarOverlay .storage-area-cigar-identity span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#manageCigarOverlay .storage-area-empty,
#manageCigarOverlay .storage-area-create-section,
#manageCigarOverlay .storage-area-activity-history {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

#manageCigarOverlay .storage-area-empty {
  align-items: center;
  padding: 20px;
  border: 1px dashed var(--dossier-border);
  border-radius: 13px;
  text-align: center;
}

#manageCigarOverlay .storage-area-create-section {
  gap: 12px;
}

#manageCigarOverlay .storage-area-activity-history {
  max-height: 18rem;
  overflow-y: auto;
}

#manageCigarOverlay .storage-area-latest-note {
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid var(--dossier-border-soft);
  color: var(--dossier-muted);
  font-size: 11px;
}

#manageCigarOverlay .storage-area-delete-section .secondary-action,
#manageCigarOverlay .storage-area-delete-section button {
  color: var(--dossier-danger);
  border-color: var(--dossier-danger-border);
}


/* =========================================================
   DOSSIER — RESPONSIVE BOUNDARY CONTRACT
   Flex decides how siblings share space; boundaries decide how
   much useful space a surface may claim. Parents own gaps,
   surfaces own padding, and children remain shrinkable.
   ========================================================= */

#manageCigarOverlay .manage-overview-card,
#manageCigarOverlay .inventory-quantity-card,
#manageCigarOverlay .inventory-history-card,
#manageCigarOverlay .storage-latest-card,
#manageCigarOverlay .storage-preferences-card,
#manageCigarOverlay .storage-location-card,
#manageCigarOverlay .aging-plan-card,
#manageCigarOverlay .notes-latest-card,
#manageCigarOverlay .notes-history-card {
  min-width: 0;
  max-width: var(--dossier-boundary-card);
}

#manageCigarOverlay .manage-edit-form,
#manageCigarOverlay .aging-form,
#manageCigarOverlay .inventory-adjustment-form,
#manageCigarOverlay .storage-reading-form,
#manageCigarOverlay .storage-preferences-form,
#manageCigarOverlay .storage-assignment-form,
#manageCigarOverlay .notes-form,
#manageCigarOverlay .storage-area-form,
#manageCigarOverlay .storage-area-reading-form,
#manageCigarOverlay .storage-area-preferences-form {
  max-width: var(--dossier-boundary-form);
}

/* =========================================================
   DOSSIER — TABLET
   First-class touch workspace: contained, wider pairings,
   no desktop-only density assumptions.
   ========================================================= */

@media (min-width: 701px) and (max-width: 1100px) {
  #manageCigarOverlay.cigar-detail-overlay {
    padding: 18px;
  }

  #manageCigarOverlay .manage-cigar {
    width: min(96vw, 58rem);
    height: calc(100dvh - 36px);
  }

  #manageCigarOverlay .manage-dossier-header {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px 16px;
    padding: 16px 54px 14px 18px;
  }

  #manageCigarOverlay .manage-dossier-identity {
    flex: 1 1 24rem;
  }

  #manageCigarOverlay .manage-dossier-quick {
    flex: 1 1 18rem;
    width: auto;
  }

  #manageCigarOverlay .manage-dossier-quick-item {
    flex: 1 1 0;
    min-width: 0;
  }

  #manageCigarOverlay .manage-tabs {
    padding-inline: 10px;
  }

  #manageCigarOverlay .manage-tab {
    min-height: 50px;
    padding: 6px 9px 5px;
  }

  #manageCigarOverlay .manage-content {
    padding: 18px;
  }

  #manageCigarOverlay .inventory-dashboard-grid,
  #manageCigarOverlay .notes-dashboard-grid {
    gap: 12px;
  }

  #manageCigarOverlay .inventory-quantity-card {
    flex-basis: 42%;
  }

  #manageCigarOverlay .notes-latest-card {
    flex-basis: 42%;
  }

  #manageCigarOverlay .manage-photo-gallery-item {
    flex-basis: calc(50% - 6px);
    min-width: 170px;
  }

  #manageCigarOverlay .storage-area-grid,
  #manageCigarOverlay .storage-area-environment-comparison {
    gap: var(--dossier-gap-tablet);
  }

  #manageCigarOverlay .storage-area-card {
    flex: 1 1 calc(50% - 6px);
    width: min(100%, 34rem);
    min-width: 280px;
    max-width: 34rem;
  }

  #manageCigarOverlay .storage-area-current-panel,
  #manageCigarOverlay .storage-area-environment-panel,
  #manageCigarOverlay .storage-area-target-panel {
    width: min(100%, 30rem);
    max-width: 30rem;
  }

  #manageCigarOverlay .storage-area-detail-contents {
    flex-direction: row;
  }
}


/* =========================================================
   DOSSIER — MOBILE / PHONE
   Full viewport, touch-first, vertical composition,
   persistent identity + horizontally scrollable lifecycle rail.
   ========================================================= */

@media (max-width: 700px) {
  #manageCigarOverlay.cigar-detail-overlay {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
    background: var(--dossier-bg);
  }

  #manageCigarOverlay .manage-cigar {
    width: 100%;
    max-width: none;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #manageCigarOverlay .cigar-detail-close {
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
  }

  #manageCigarOverlay .manage-dossier-header {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
    padding: 12px 52px 11px 14px;
  }

  #manageCigarOverlay .manage-dossier-identity {
    gap: 12px;
  }

  #manageCigarOverlay .manage-dossier-photo {
    flex-basis: 62px;
    width: 62px;
    height: 62px;
    border-radius: 12px;
    font-size: 25px;
  }

  #manageCigarOverlay .manage-dossier-copy h2 {
    font-size: 20px;
  }

  #manageCigarOverlay .manage-dossier-series,
  #manageCigarOverlay .manage-dossier-meta {
    font-size: 10px;
  }

  #manageCigarOverlay .manage-dossier-quick {
    width: calc(100% + 38px);
    gap: 6px;
  }

  #manageCigarOverlay .manage-dossier-quick-item {
    flex: 1 1 0;
    min-width: 0;
    padding: 7px 5px;
  }

  #manageCigarOverlay .manage-dossier-quick-item strong {
    font-size: 16px;
  }

  #manageCigarOverlay .manage-dossier-quick-item span {
    font-size: 8px;
  }

  #manageCigarOverlay .manage-tabs {
    flex: 0 0 auto;
    gap: 0;
    padding: 0 6px;
  }

  #manageCigarOverlay .manage-tab {
    min-height: 48px;
    padding: 6px 8px 5px;
    font-size: 10px;
  }

  #manageCigarOverlay .manage-tab .action-icon {
    display: inline-flex;
  }

  #manageCigarOverlay .manage-content {
    flex: 1 1 0;
    min-height: 0;
    padding: 14px 14px max(24px, env(safe-area-inset-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: auto;
    touch-action: pan-y;
  }

  #manageCigarOverlay .manage-overview-card {
    padding: 14px;
  }

  #manageCigarOverlay .dossier-section-label {
    margin-top: 12px;
  }

  #manageCigarOverlay .dossier-state-row {
    min-height: 58px;
    gap: 9px;
    padding: 10px 11px;
  }

  #manageCigarOverlay .dossier-state-icon {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
  }

  #manageCigarOverlay .dossier-state-value {
    max-width: 32%;
    font-size: 10px;
  }

  #manageCigarOverlay .dossier-state-meta {
    font-size: 10px;
  }

  #manageCigarOverlay .dossier-actions {
    gap: 7px;
  }

  #manageCigarOverlay .dossier-action {
    flex: 1 1 calc(50% - 7px);
    min-width: 0;
    min-height: 44px;
    padding-inline: 10px;
    font-size: 11px;
  }

  #manageCigarOverlay .dossier-cigar-actions {
    flex-direction: column;
  }

  #manageCigarOverlay .dossier-cigar-actions .secondary-action {
    width: 100%;
  }

  #manageCigarOverlay .inventory-dashboard-grid,
  #manageCigarOverlay .notes-dashboard-grid,
  #manageCigarOverlay .storage-dashboard-grid {
    flex-direction: column;
  }

  #manageCigarOverlay .inventory-quantity-card,
  #manageCigarOverlay .inventory-history-card,
  #manageCigarOverlay .notes-latest-card,
  #manageCigarOverlay .notes-history-card,
  #manageCigarOverlay .storage-latest-card,
  #manageCigarOverlay .storage-preferences-card,
  #manageCigarOverlay .storage-history-card {
    flex-basis: auto;
    width: 100%;
  }

  #manageCigarOverlay .inventory-current-quantity strong {
    font-size: 40px;
  }

  #manageCigarOverlay .inventory-history-list {
    max-height: 17rem;
  }

  #manageCigarOverlay .notes-history-list {
    max-height: 15rem;
  }

  #manageCigarOverlay .storage-current-values {
    gap: 8px;
  }

  #manageCigarOverlay .storage-current-value {
    padding: 10px;
  }

  #manageCigarOverlay .storage-current-value strong {
    font-size: 23px;
  }

  #manageCigarOverlay .storage-location-item-header,
  #manageCigarOverlay .storage-location-environment,
  #manageCigarOverlay .storage-summary-row,
  #manageCigarOverlay .aging-summary-row,
  #manageCigarOverlay .aging-progress-meta,
  #manageCigarOverlay .storage-history-header {
    align-items: flex-start;
  }

  #manageCigarOverlay .aging-plan-card {
    padding: 15px;
  }

  #manageCigarOverlay .aging-progress {
    padding: 15px;
  }

  #manageCigarOverlay .aging-progress-header strong {
    font-size: 34px;
  }

  #manageCigarOverlay .manage-photo-primary {
    height: min(42vh, 320px);
  }

  #manageCigarOverlay .manage-photo-gallery {
    gap: 9px;
  }

  #manageCigarOverlay .manage-photo-gallery-item {
    flex: 1 1 calc(50% - 5px);
    min-width: 130px;
    max-width: none;
  }

  #manageCigarOverlay .manage-photo-actions {
    flex-direction: column;
  }

  #manageCigarOverlay .manage-photo-actions .secondary-action {
    width: 100%;
  }

  #manageCigarOverlay .note-meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  #manageCigarOverlay .form-row {
    flex-direction: column;
    gap: 0;
  }

  #manageCigarOverlay .manage-edit-form,
  #manageCigarOverlay .aging-form,
  #manageCigarOverlay .inventory-adjustment-form,
  #manageCigarOverlay .storage-reading-form,
  #manageCigarOverlay .storage-preferences-form,
  #manageCigarOverlay .storage-assignment-form,
  #manageCigarOverlay .notes-form,
  #manageCigarOverlay .storage-area-form,
  #manageCigarOverlay .storage-area-reading-form,
  #manageCigarOverlay .storage-area-preferences-form {
    padding: 15px;
  }

  #manageCigarOverlay .aging-form-actions,
  #manageCigarOverlay .inventory-form-actions,
  #manageCigarOverlay .storage-form-actions,
  #manageCigarOverlay .notes-form-actions,
  #manageCigarOverlay .cigar-detail-actions {
    flex-direction: column;
  }

  #manageCigarOverlay .aging-form-actions > *,
  #manageCigarOverlay .inventory-form-actions > *,
  #manageCigarOverlay .storage-form-actions > *,
  #manageCigarOverlay .notes-form-actions > *,
  #manageCigarOverlay .cigar-detail-actions > * {
    width: 100%;
  }

  /* STORAGE AREA — MOBILE RELATIONSHIPS */

  #manageCigarOverlay .storage-area-grid {
    flex-direction: column;
  }

  #manageCigarOverlay .storage-area-grid,
  #manageCigarOverlay .storage-area-environment-comparison {
    gap: var(--dossier-gap-mobile);
  }

  #manageCigarOverlay .storage-area-card,
  #manageCigarOverlay .storage-area-current-panel,
  #manageCigarOverlay .storage-area-environment-panel,
  #manageCigarOverlay .storage-area-target-panel {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #manageCigarOverlay .storage-area-card {
    padding: 14px;
    gap: var(--dossier-gap-mobile);
  }

  #manageCigarOverlay .storage-area-current-panel,
  #manageCigarOverlay .storage-area-environment-panel,
  #manageCigarOverlay .storage-area-target-panel {
    padding: 14px;
    gap: var(--dossier-gap-mobile);
  }

  #manageCigarOverlay .storage-area-card-layout {
    flex-direction: column;
    gap: 10px;
  }

  #manageCigarOverlay .storage-area-card-summary {
    flex-direction: column;
    gap: 8px;
  }

  #manageCigarOverlay .storage-area-card-primary-row {
    flex-direction: row;
    gap: 8px;
  }

  #manageCigarOverlay .storage-area-card-header,
  #manageCigarOverlay .storage-area-card-contents {
    flex-basis: 50%;
    width: 50%;
  }

  #manageCigarOverlay .storage-area-card-environment {
    flex-direction: row;
    gap: 8px;
  }

  #manageCigarOverlay .storage-area-environment-group {
    flex-basis: 50%;
  }

  #manageCigarOverlay .storage-area-detail-contents,
  #manageCigarOverlay .storage-area-environment-comparison {
    flex-direction: column;
  }

  #manageCigarOverlay .storage-area-detail-summary,
  #manageCigarOverlay .storage-area-snapshot-stats {
    gap: 8px;
  }

  #manageCigarOverlay .storage-area-status,
  #manageCigarOverlay .storage-area-detail-status-summary,
  #manageCigarOverlay .storage-area-snapshot-stat {
    font-size: 11px;
    font-weight: 750;
  }

  #manageCigarOverlay .storage-area-status,
  #manageCigarOverlay .storage-area-detail-status-summary {
    padding: 5px 7px;
  }

  #manageCigarOverlay .storage-area-detail-status-summary {
    gap: 4px;
  }

  #manageCigarOverlay .storage-area-snapshot-stat {
    gap: 4px;
  }

  #manageCigarOverlay .storage-reading-actions,
  #manageCigarOverlay .storage-history-row-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  #manageCigarOverlay .storage-reading-actions > *,
  #manageCigarOverlay .storage-history-row-actions > * {
    width: 100%;
    min-height: 42px;
    padding-inline: 8px;
  }
}

/* =========================================================
   DOSSIER — MOBILE LANDSCAPE / SHORT VIEWPORT
   Same phone experience, compressed for limited height.
   ========================================================= */

@media (max-width: 900px) and (orientation: landscape) and (max-height: 560px) {
  #manageCigarOverlay .storage-area-card-layout {
    flex-direction: row;
    align-items: stretch;
  }

  #manageCigarOverlay .storage-area-card-summary {
    flex: 1 1 62%;
  }

  #manageCigarOverlay .storage-area-card-environment {
    flex: 1 1 38%;
  }

  #manageCigarOverlay .manage-dossier-header {
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 8px 48px 8px 12px;
  }

  #manageCigarOverlay .manage-dossier-identity {
    gap: 10px;
  }

  #manageCigarOverlay .manage-dossier-photo {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
  }

  #manageCigarOverlay .manage-dossier-copy .eyebrow {
    margin-bottom: 2px;
    font-size: 8px;
  }

  #manageCigarOverlay .manage-dossier-copy h2 {
    font-size: 17px;
  }

  #manageCigarOverlay .manage-dossier-series,
  #manageCigarOverlay .manage-dossier-meta {
    margin-top: 2px;
    font-size: 9px;
  }

  #manageCigarOverlay .manage-dossier-quick {
    width: auto;
    gap: 5px;
  }

  #manageCigarOverlay .manage-dossier-quick-item {
    min-width: 62px;
    padding: 5px 6px;
  }

  #manageCigarOverlay .manage-dossier-quick-item strong {
    font-size: 14px;
  }

  #manageCigarOverlay .manage-dossier-quick-item span {
    font-size: 7px;
  }

  #manageCigarOverlay .manage-tabs {
    padding-inline: 8px;
  }

  #manageCigarOverlay .manage-tab {
    min-height: 42px;
    padding: 4px 7px 3px;
    font-size: 9px;
  }

  #manageCigarOverlay .manage-content {
    padding: 10px 12px 16px;
  }

  #manageCigarOverlay .dossier-section-label {
    margin: 9px 0 6px;
  }

  #manageCigarOverlay .dossier-state-row {
    min-height: 48px;
    padding: 7px 9px;
  }

  #manageCigarOverlay .dossier-state-icon {
    flex-basis: 28px;
    width: 28px;
    height: 28px;
  }

  #manageCigarOverlay .manage-overview-card {
    padding: 12px;
  }

  #manageCigarOverlay .inventory-history-list,
  #manageCigarOverlay .notes-history-list {
    max-height: 12rem;
  }
}

/* =========================================================
   DOSSIER — COMPLETE GENERATED-STATE COVERAGE
   Explicit styling for app.js classes that participate in Dossier
   operations but previously relied on incidental inheritance.
   ========================================================= */
#manageCigarOverlay .inventory-detail-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--dossier-border);
}
#manageCigarOverlay .inventory-detail-row:last-child {
  border-bottom: 0;
}
#manageCigarOverlay .inventory-detail-label {
  color: var(--dossier-muted);
  font-size: 12px;
}
#manageCigarOverlay .inventory-detail-value {
  color: var(--dossier-text);
  font-weight: 700;
  text-align: right;
}

/* Storage reading rows are their own production structure. */
#manageCigarOverlay .storage-history-row {
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--dossier-border-soft);
}
#manageCigarOverlay .storage-history-row:last-child {
  border-bottom: 0;
}
#manageCigarOverlay .storage-history-date {
  flex: 0 0 5.25rem;
  min-width: 0;
  color: var(--dossier-muted);
  font-size: 12px;
}
#manageCigarOverlay .storage-history-value {
  flex: 0 0 6rem;
  min-width: 0;
  color: var(--dossier-text);
  font-weight: 700;
  text-align: left;
}
#manageCigarOverlay .storage-history-note {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--dossier-muted);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
#manageCigarOverlay .storage-history-toggle,
#manageCigarOverlay .manage-photo-primary-button {
  color: var(--dossier-gold-bright);
}
#manageCigarOverlay .storage-movement-history-card,
#manageCigarOverlay .storage-area-assignment,
#manageCigarOverlay .storage-area-environment-empty {
  width: 100%;
  min-width: 0;
}
#manageCigarOverlay .storage-movement-location,
#manageCigarOverlay .storage-preference-source,
#manageCigarOverlay .storage-recent-heading,
#manageCigarOverlay .storage-stat-label,
#manageCigarOverlay .storage-stat-meta {
  color: var(--dossier-muted);
  font-size: 12px;
}
#manageCigarOverlay .storage-stat-value {
  color: var(--dossier-gold-bright);
  font-family: Georgia, serif;
  font-size: 20px;
}
#manageCigarOverlay .storage-split-environments {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
#manageCigarOverlay .storage-area-environment-empty {
  padding: 16px;
  border: 1px dashed var(--dossier-border-strong);
  border-radius: 12px;
  color: var(--dossier-muted);
  text-align: center;
  background: var(--dossier-soft);
}
#manageCigarOverlay .collection-history-detail-name {
  margin: 0;
  font-family: Georgia, serif;
  font-size: 20px;
}
#manageCigarOverlay .collection-history-detail-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
#manageCigarOverlay .collection-history-tab-section {
  width: 100%;
  min-width: 0;
}
#manageCigarOverlay .collection-history-storage-condition-name {
  color: var(--dossier-text);
  font-weight: 700;
}
#manageCigarOverlay .collection-history-storage-condition-values,
#manageCigarOverlay .collection-history-timeline-content {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
#manageCigarOverlay .collection-history-timeline-note {
  color: var(--dossier-muted);
  font-size: 12px;
}
#manageCigarOverlay .collection-history-empty {
  padding: 24px;
  color: var(--dossier-muted);
  text-align: center;
}

@media (max-width: 700px) {
  #manageCigarOverlay .inventory-detail-row,
  #manageCigarOverlay .storage-history-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 7px 10px;
    padding: 10px 0;
  }
  #manageCigarOverlay .storage-history-date,
  #manageCigarOverlay .storage-history-note,
  #manageCigarOverlay .storage-history-row-actions {
    grid-column: 1 / -1;
    width: 100%;
  }
  #manageCigarOverlay .storage-history-date,
  #manageCigarOverlay .storage-history-value {
    flex-basis: auto;
  }
  #manageCigarOverlay .storage-history-row-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  #manageCigarOverlay .storage-history-row-actions .secondary-action {
    width: 100%;
    min-width: 0;
    padding-inline: 8px;
    overflow-wrap: anywhere;
  }
  #manageCigarOverlay .collection-history-detail,
  #manageCigarOverlay .collection-history-overview,
  #manageCigarOverlay .collection-history-timeline,
  #manageCigarOverlay .collection-history-notes {
    gap: 8px;
  }
  #manageCigarOverlay .collection-history-detail-header {
    align-items: flex-start;
    gap: 7px;
  }
  #manageCigarOverlay .collection-history-tabs {
    gap: 2px;
  }
  #manageCigarOverlay .collection-history-tab {
    min-height: 34px;
    padding-inline: 8px;
    font-size: 10px;
  }
  #manageCigarOverlay .collection-history-overview-grid,
  #manageCigarOverlay .collection-history-detail-list,
  #manageCigarOverlay .collection-history-storage-conditions,
  #manageCigarOverlay .collection-history-timeline,
  #manageCigarOverlay .collection-history-notes {
    gap: 7px;
  }
  #manageCigarOverlay .collection-history-overview-item,
  #manageCigarOverlay .collection-history-detail-row,
  #manageCigarOverlay .collection-history-note,
  #manageCigarOverlay .collection-history-storage-condition {
    flex-basis: 100%;
    padding: 9px 10px;
  }
  #manageCigarOverlay .collection-history-timeline-item {
    gap: 9px;
    padding: 8px 0;
  }
  #manageCigarOverlay .storage-split-environments {
    flex-direction: column;
  }
}

/* =========================================================
   DOSSIER — AGING RESPONSIVE COMPOSITION
   Progress remains primary; plan facts stack below it.
   ========================================================= */
@media (max-width: 800px) {
  #manageCigarOverlay .aging-plan-card {
    gap: 12px;
    padding: 15px;
  }

  #manageCigarOverlay .aging-plan-card > h3,
  #manageCigarOverlay .aging-plan-card > .manage-overview-primary,
  #manageCigarOverlay .aging-progress,
  #manageCigarOverlay .aging-summary-details,
  #manageCigarOverlay .aging-plan-actions {
    flex: 0 0 100%;
  }

  #manageCigarOverlay .aging-plan-card > .manage-overview-primary {
    margin-left: 0;
  }

  #manageCigarOverlay .aging-progress {
    order: 2;
    padding: 16px;
  }

  #manageCigarOverlay .aging-summary-details {
    order: 3;
    min-width: 0;
    padding: 16px;
  }

  #manageCigarOverlay .aging-plan-actions {
    order: 4;
  }
}

@media (max-width: 500px) {
  #manageCigarOverlay .aging-plan-card > h3 {
    font-size: 21px;
  }

  #manageCigarOverlay .aging-progress-header strong {
    font-size: 34px;
  }

  #manageCigarOverlay .aging-summary-row,
  #manageCigarOverlay .aging-progress-meta {
    align-items: flex-start;
    gap: 8px;
  }

  #manageCigarOverlay .aging-plan-actions > .secondary-action {
    width: 100%;
  }
}


/* =========================================================
   STORAGE AREA — MOBILE TEXT RHYTHM
   Preserve readable labels without allowing controls to crush
   them; target facts stack only when phone width requires it.
   ========================================================= */
@media (max-width: 700px) {
  #manageCigarOverlay .storage-area-target-values {
    flex-direction: column;
  }

  #manageCigarOverlay .storage-area-target-group {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
  }

  #manageCigarOverlay .storage-allocation-row {
    gap: 10px;
  }

  #manageCigarOverlay .storage-allocation-row > label {
    flex: 0 1 35%;
    min-width: 6.5rem;
    max-width: 35%;
  }

  #manageCigarOverlay .storage-allocation-row > input {
    flex: 1 1 65%;
  }
}

/* =========================================================
   DOSSIER — INVENTORY ADJUSTMENT TYPE
   Intent selector uses the existing Dossier gold/secondary
   action language; it introduces no separate form theme.
   ========================================================= */

#manageCigarOverlay .inventory-adjustment-type-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#manageCigarOverlay .inventory-adjustment-type-options > button {
  flex: 1 1 0;
  min-width: 8rem;
}


/* =========================================================
   DOSSIER — CIGAR RESPONSIVE COMPOSITION
   ========================================================= */

@media (max-width: 700px) {
  #manageCigarOverlay .manage-cigar-details {
    flex-direction: column;
    gap: 14px;
  }

  #manageCigarOverlay .manage-cigar-details-photo {
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
    height: 8.5rem;
  }

  #manageCigarOverlay .manage-cigar-details-content {
    flex: 0 0 auto;
    width: 100%;
  }

  #manageCigarOverlay .manage-cigar-details-heading h3 {
    font-size: 22px;
  }

  #manageCigarOverlay .manage-cigar-details-cards {
    flex-direction: column;
  }

  #manageCigarOverlay .manage-cigar-details-card {
    flex: 0 0 auto;
    width: 100%;
  }
}