:root{
      --bg:#070707;
      --bg-soft:#0f0c0a;
      --panel:#15110f;
      --panel-2:#1a1411;
      --panel-3:#201813;
      --line:#3b2b21;
      --line-soft:#4b392d;
      --gold:#c8a96a;
      --gold-2:#e5c88b;
      --text:#f5f0e6;
      --muted:#b8b3a9;
      --muted-2:#8f7a58;
      --danger:#b25555;
      --ok:#6ca26a;
      --shadow:0 24px 80px rgba(0,0,0,.45);
      --radius:22px;
      --radius-lg:30px;
      --font-serif:"Georgia","Times New Roman",serif;
      --font-sans:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    }

    *{box-sizing:border-box}
    html,body{
      margin:0;
      padding:0;
      background:radial-gradient(circle at top,#2c1a12 0%,#120f0d 30%,#090909 65%,#040404 100%);
      color:var(--text);
      font-family:var(--font-sans);
    }
    body{min-height:100vh}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}

    .container{
      max-width:1400px;
      margin:0 auto;
      padding:18px 20px 28px;
    }

    .hero{
      position:relative;
      overflow:hidden;
      border:1px solid rgba(200,169,106,.25);
      background:rgba(15,12,10,.88);
      border-radius:32px;
      padding:24px;
      box-shadow:var(--shadow);
      backdrop-filter:blur(10px);
    }

    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(135deg,rgba(200,169,106,.08),transparent 35%,transparent 65%,rgba(200,169,106,.05));
      pointer-events:none;
    }

    .hero-inner{
      position:relative;
      display:grid;
      grid-template-columns:1.2fr 1fr;
      gap:24px;
      align-items:start;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:16px;
    }

    .logo-round{
      position:relative;
      width:160px;
      height:88px;
      border-radius:20px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:linear-gradient(135deg,rgba(44,26,18,.82),rgba(21,17,15,.95),rgba(0,0,0,.98));
      border:1px solid rgba(200,169,106,.4);
      box-shadow:0 0 30px rgba(200,169,106,.12);
      flex:0 0 auto;
      overflow:hidden;
    }

    .logo-round::before{
      content:"";
      position:absolute;
      inset:8px;
      border-radius:14px;
      border:1px dashed rgba(229,200,139,.25);
      pointer-events:none;
    }

    .logo-round::after{
      content:"PNG LOGO";
      position:absolute;
      right:10px;
      bottom:8px;
      font-size:9px;
      letter-spacing:.18em;
      color:rgba(229,200,139,.48);
      pointer-events:none;
    }

    .logo-star{
      font-size:12px;
      color:var(--gold-2);
      letter-spacing:.25em;
      margin-bottom:4px;
    }

    .logo-ech{
      font-family:var(--font-serif);
      color:var(--gold-2);
      letter-spacing:.28em;
      font-size:24px;
      margin-left:6px;
    }

    .brand-title{
      font-family:var(--font-serif);
      font-size:34px;
      color:var(--gold-2);
      letter-spacing:.22em;
      line-height:1.05;
    }

    .brand-subtitle{
      font-size:12px;
      color:var(--muted-2);
      text-transform:uppercase;
      letter-spacing:.42em;
      margin-top:6px;
    }

    .hero-copy{
      margin-top:18px;
      max-width:760px;
      color:#cfc8bb;
      line-height:1.7;
      font-size:14px;
    }

    .hero-copy strong{color:var(--gold-2)}

    .metrics{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:12px;
    }

    .metric{
      border:1px solid var(--line);
      background:rgba(18,15,13,.95);
      border-radius:22px;
      padding:18px;
    }

    .metric-top{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
    }

    .metric-label{
      font-size:11px;
      text-transform:uppercase;
      letter-spacing:.24em;
      color:#a6906a;
    }

    .metric-value{
      margin-top:10px;
      font-family:var(--font-serif);
      font-size:30px;
      color:var(--gold-2);
    }

    .metric-hint{
      margin-top:8px;
      color:var(--muted);
      font-size:13px;
    }

    .metric-icon{
      width:42px;
      height:42px;
      border-radius:16px;
      border:1px solid rgba(200,169,106,.2);
      background:#1b1512;
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--gold-2);
      font-size:18px;
      flex:0 0 auto;
    }

    .tabs{
      margin-top:24px;
    }

    .tab-buttons{
      display:grid;
      grid-template-columns:repeat(7,1fr);
      gap:10px;
      background:#0f0c0a;
      border:1px solid var(--line);
      border-radius:20px;
      padding:10px;
      box-shadow:inset 0 0 24px rgba(200,169,106,.03);
    }

    .tab-btn{
      border:none;
      background:transparent;
      color:var(--muted);
      border-radius:14px;
      padding:13px 12px;
      font-size:13px;
      font-weight:600;
      transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }

    .tab-btn.active{
      background:#1c1512;
      color:var(--gold-2);
      border:1px solid var(--line-soft);
      box-shadow:0 10px 22px rgba(0,0,0,.16);
    }

    .tab-btn:hover{
      color:var(--text);
      transform:translateY(-1px);
    }

    .tab-panel{
      display:none;
      margin-top:24px;
    }

    .tab-panel.active{display:block}

    .grid{display:grid;gap:20px}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .grid-sidebar{grid-template-columns:460px 1fr}
    .grid-tasting{grid-template-columns:1.15fr .85fr}
    .grid-collection{grid-template-columns:1fr 360px}

    #collection .grid-collection{
      grid-template-columns:1fr;
      align-items:start;
    }

    #collection .grid-collection > .grid{
      grid-template-columns:repeat(2, minmax(0, 1fr));
      align-items:start;
    }

    #settings .grid-2{
      grid-template-columns:1fr;
    }

    .card{
      border:1px solid var(--line);
      background:rgba(18,15,13,.95);
      border-radius:var(--radius);
      overflow:hidden;
      box-shadow:0 16px 40px rgba(0,0,0,.14);
    }

    .card-header{padding:18px 18px 0}
    .card-content{padding:18px}

    .section-head{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:16px;
      margin-bottom:18px;
    }

    .section-left{
      display:flex;
      align-items:center;
      gap:12px;
    }

    .section-icon{
      width:44px;
      height:44px;
      border-radius:16px;
      border:1px solid rgba(200,169,106,.3);
      background:#1b1512;
      color:var(--gold-2);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:18px;
      box-shadow:inset 0 0 20px rgba(200,169,106,.06);
      flex:0 0 auto;
    }

    .section-title{
      font-family:var(--font-serif);
      font-size:26px;
      color:var(--text);
      margin:0;
      line-height:1.1;
    }

    .section-subtitle{
      margin-top:4px;
      color:var(--muted);
      font-size:15px;
      line-height:1.55;
    }

    .section-badge{
      border:1px solid var(--line-soft);
      background:#2b2018;
      color:#e0c389;
      padding:8px 12px;
      border-radius:999px;
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .form-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:16px;
    }

    .full{grid-column:1 / -1}

    .field label{
      display:block;
      margin-bottom:8px;
      font-size:11px;
      font-weight:700;
      text-transform:uppercase;
      letter-spacing:.18em;
      color:#b8a27b;
    }

    .input,.select,.textarea{
      width:100%;
      border:1px solid #47352a;
      background:#171311;
      color:var(--text);
      border-radius:14px;
      padding:13px 15px;
      font-size:15px;
      outline:none;
      transition:border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease;
    }

    .input:focus,.select:focus,.textarea:focus{
      border-color:var(--gold);
      box-shadow:0 0 0 3px rgba(200,169,106,.12);
      background:#1b1512;
    }

    .textarea{
      min-height:104px;
      resize:vertical;
    }

    .btn{
      border:none;
      border-radius:14px;
      padding:13px 18px;
      background:var(--gold);
      color:#000;
      font-weight:700;
      letter-spacing:.01em;
      box-shadow:0 10px 24px rgba(0,0,0,.18);
      transition:transform .18s ease, background .18s ease, box-shadow .18s ease, filter .18s ease;
    }

    .btn:hover{
      background:var(--gold-2);
      transform:translateY(-1px);
      box-shadow:0 14px 28px rgba(0,0,0,.24);
    }

    .btn:active{
      transform:translateY(0);
    }

    .btn:focus-visible,.input:focus-visible,.select:focus-visible,.textarea:focus-visible,.tab-btn:focus-visible{
      outline:none;
      box-shadow:0 0 0 3px rgba(229,200,139,.16), 0 0 0 1px rgba(229,200,139,.42);
    }

    .btn-secondary{
      background:linear-gradient(180deg,#241b15,#1d1510);
      color:#f2d89d;
      border:1px solid var(--line-soft);
      box-shadow:none;
    }

    .btn-secondary:hover{
      background:linear-gradient(180deg,#2b2018,#221811);
      color:#ffe8b4;
    }
    .btn-danger{
      background:#3a1f1f;
      color:#ffd0d0;
      border:1px solid #6a3030;
    }

    .toolbar{
      display:flex;
      gap:12px;
      align-items:center;
      flex-wrap:wrap;
    }

    .search-wrap{
      position:relative;
      flex:1;
      min-width:220px;
    }

    .search-wrap .input{padding-left:42px}
    .search-icon{
      position:absolute;
      left:14px;
      top:50%;
      transform:translateY(-50%);
      color:#7b6b5c;
      font-size:16px;
    }

.inventory-list,.history-list,.collection-list{
  display:grid;
  gap:14px;
}

#humidor .inventory-grid-full{
  grid-template-columns:minmax(0,1fr) !important;
}

#humidor .inventory-modal-layout{
  grid-template-columns:minmax(0,1fr) !important;
}

#humidor #inventoryCreateCard{
  display:none;
}

#inventoryCreateModal #inventoryCreateCard{
  display:block !important;
}

#inventoryCreateModal .card{
  border-radius:24px;
  box-shadow:none;
}

#inventoryCreateModal .card-header{
  padding-bottom:8px;
}

#inventoryCreateModal .card-content{
  padding-top:10px;
}

#inventoryCreateModal .form-grid{
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px 16px;
}

#inventoryCreateModal .field.full{
  grid-column:1 / -1;
}

#inventoryCreateModal .card{
  border:1px solid rgba(163,126,67,.16) !important;
  border-radius:28px !important;
  background:linear-gradient(180deg, rgba(246,241,232,.98), rgba(236,228,216,.94)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48) !important;
}

#inventoryCreateModal .card-header{
  padding:18px 18px 10px !important;
  border-bottom:1px solid rgba(163,126,67,.10) !important;
}

#inventoryCreateModal .card-content{
  padding:18px !important;
}

#inventoryCreateModal .section-icon{
  background:linear-gradient(180deg,#f7f2ea,#efe5d6) !important;
  border:1px solid rgba(163,126,67,.18) !important;
  color:#17362c !important;
  box-shadow:0 10px 22px rgba(82,60,34,.08) !important;
}

#inventoryCreateModal .section-title{
  color:#17362c !important;
}

#inventoryCreateModal .section-subtitle{
  color:#5f5a50 !important;
}

#inventoryCreateModal .form-grid{
  gap:16px 18px !important;
}

#inventoryCreateModal .field{
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

#inventoryCreateModal .field label{
  color:#9b7439 !important;
  letter-spacing:.18em !important;
  font-size:10px !important;
}

#inventoryCreateModal .input,
#inventoryCreateModal .select,
#inventoryCreateModal .textarea{
  background:rgba(248,244,236,.92) !important;
  border:1px solid rgba(163,126,67,.18) !important;
  color:#17362c !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55) !important;
}

#inventoryCreateModal .input::placeholder,
#inventoryCreateModal .textarea::placeholder{
  color:#8f8370 !important;
}

#inventoryCreateModal .textarea{
  min-height:108px !important;
}

#inventoryCreateModal input[type="file"]{
  background:#f6f1e8 !important;
  border:1px solid rgba(163,126,67,.18) !important;
  border-radius:16px !important;
  padding:12px 14px !important;
  color:#5f5a50 !important;
}

#inventoryCreateModal input[type="file"]::file-selector-button{
  margin-right:12px !important;
  border:1px solid rgba(163,126,67,.20) !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#fffaf3,#efe5d6) !important;
  color:#17362c !important;
  padding:8px 12px !important;
  cursor:pointer !important;
}

#inventoryCreateModal .upload-preview{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(163,126,67,.14);
  background:rgba(255,255,255,.45);
}

#inventoryCreateModal .upload-preview img{
  width:100%;
  max-height:260px;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(163,126,67,.16);
}

#inventoryCreateModal .footer-note{
  line-height:1.7;
  margin-top:10px !important;
  padding:12px 14px !important;
  border-radius:16px !important;
  border:1px solid rgba(163,126,67,.16) !important;
  background:rgba(255,255,255,.56) !important;
  color:#6c5839 !important;
  box-shadow:none !important;
}

#inventoryCreateModal #saveHumidorBtn{
  min-width:260px !important;
  border-radius:16px !important;
  box-shadow:0 14px 28px rgba(23,54,44,.14) !important;
}

#inventoryCreateModal #clearPhotoBtn{
  align-self:flex-start !important;
}

.item-card{
  background:#171311;
  border:1px solid var(--line);
  border-radius:20px;
      padding:16px;
    }

    .item-top{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:16px;
    }

    .item-title{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      align-items:center;
    }

    .item-title h3{
      margin:0;
      font-family:var(--font-serif);
      font-size:25px;
      color:var(--gold-2);
      line-height:1.08;
    }

    .pill{
      border-radius:999px;
      padding:7px 11px;
      font-size:11px;
      letter-spacing:.12em;
      text-transform:uppercase;
      border:1px solid var(--line-soft);
    }

    .pill-gold{
      background:#2c2018;
      color:#e0c389;
    }

    .pill-outline{
      background:transparent;
      color:#cdb898;
    }

    .item-sub{
      margin-top:6px;
      font-size:15px;
      color:var(--text);
      line-height:1.55;
    }

    .item-meta{
      margin-top:14px;
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:8px 16px;
      font-size:15px;
      color:var(--muted);
    }

    .item-meta strong{color:var(--text)}

    .item-notes{
      margin-top:14px;
      color:var(--muted);
      font-size:15px;
      line-height:1.7;
    }

    .tasting-ratings-summary{
      border:1px solid rgba(200,169,106,.16);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at right top, rgba(212,174,90,.08), transparent 34%),
        linear-gradient(180deg, rgba(27,20,15,.98), rgba(15,11,8,.98));
      box-shadow:0 16px 34px rgba(0,0,0,.14);
    }

    .tasting-ratings-summary-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .tasting-ratings-summary-label{
      font-size:11px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-ratings-summary-value{
      font-family:var(--font-serif);
      font-size:34px;
      line-height:1;
      color:var(--gold-2);
    }

    .tasting-ratings-summary-copy{
      margin-top:12px;
      color:var(--muted);
      font-size:14px;
      line-height:1.6;
    }

    .tasting-ratings-summary-pill,
    .tasting-rating-caption{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:30px;
      padding:8px 12px;
      border-radius:999px;
      font-size:11px;
      letter-spacing:.14em;
      text-transform:uppercase;
      border:1px solid var(--line-soft);
    }

    .tasting-rating-field{
      border:1px solid rgba(200,169,106,.12);
      border-radius:16px;
      padding:14px;
      background:rgba(255,255,255,.018);
    }

    .tasting-rating-caption{
      margin-bottom:10px;
      width:max-content;
    }

    .rating-pills-premium{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }

    .rating-pill[data-tone="gold"].active,
    .tone-gold{
      background:rgba(200,169,106,.18);
      color:#f0d38a;
      border-color:rgba(200,169,106,.26);
    }

    .rating-pill[data-tone="green"].active,
    .tone-green{
      background:rgba(108,140,84,.2);
      color:#d5efb4;
      border-color:rgba(108,140,84,.28);
    }

    .rating-pill[data-tone="blue"].active,
    .tone-blue{
      background:rgba(88,112,156,.18);
      color:#d4e2ff;
      border-color:rgba(88,112,156,.24);
    }

    .rating-pill[data-tone="amber"].active,
    .tone-amber{
      background:rgba(154,110,58,.18);
      color:#f3d8a3;
      border-color:rgba(154,110,58,.26);
    }

    .rating-pill[data-tone="red"].active,
    .tone-red{
      background:rgba(128,63,63,.2);
      color:#f0cccc;
      border-color:rgba(128,63,63,.26);
    }

    .tasting-live-summary{
      margin-bottom:16px;
      border:1px solid rgba(200,169,106,.14);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(12,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.12);
    }

    .tasting-live-summary-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .tasting-live-summary-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-live-summary-value{
      font-family:var(--font-serif);
      font-size:26px;
      line-height:1.08;
      color:var(--gold-2);
      text-transform:capitalize;
    }

    .tasting-live-summary-pill{
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(200,169,106,.16);
      background:rgba(255,255,255,.03);
      color:#f0d38a;
      font-size:11px;
      letter-spacing:.14em;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .tasting-live-summary-copy{
      margin-top:12px;
      color:var(--muted);
      font-size:14px;
      line-height:1.6;
    }

    .tasting-narrative-card{
      margin-bottom:16px;
      border:1px solid rgba(200,169,106,.14);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(12,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.12);
    }

    .tasting-third-score-wrap{
      margin-bottom:12px;
      padding:12px 14px;
      border:1px solid rgba(200,169,106,.12);
      border-radius:16px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(22,17,13,.94), rgba(13,10,8,.96));
    }

    .tasting-third-score-label{
      margin-bottom:10px;
      font-size:11px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color:#c7a66c;
    }

    .tasting-narrative-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .tasting-narrative-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-narrative-value{
      font-family:var(--font-serif);
      font-size:28px;
      line-height:1.08;
      color:var(--gold-2);
    }

    .tasting-narrative-copy{
      margin-top:12px;
      color:var(--muted);
      font-size:14px;
      line-height:1.7;
    }

    .tasting-narrative-tags{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:14px;
    }

    .tasting-narrative-tag{
      display:inline-flex;
      align-items:center;
      min-height:32px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(200,169,106,.14);
      background:rgba(255,255,255,.03);
      color:#f0d38a;
      font-size:11px;
      letter-spacing:.14em;
      text-transform:uppercase;
    }

    .tasting-narrative-grid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:12px;
      margin-top:14px;
    }

    .tasting-closing-card{
      margin-top:18px;
      margin-bottom:18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.1), transparent 30%),
        linear-gradient(180deg, rgba(28,20,14,.98), rgba(13,10,8,.98));
    }

    .tasting-readiness-card{
      margin-bottom:18px;
      border:1px solid rgba(200,169,106,.14);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(12,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.12);
    }

    .tasting-readiness-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .tasting-readiness-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-readiness-value{
      font-family:var(--font-serif);
      font-size:28px;
      line-height:1.08;
      color:var(--gold-2);
    }

    .tasting-readiness-progress{
      position:relative;
      overflow:hidden;
      height:10px;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(200,169,106,.1);
      margin-top:14px;
    }

    .tasting-readiness-progress span{
      display:block;
      height:100%;
      border-radius:999px;
      background:linear-gradient(90deg, rgba(200,169,106,.65), rgba(229,200,139,.95));
      box-shadow:0 0 18px rgba(229,200,139,.22);
    }

    .tasting-readiness-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:10px 14px;
      margin-top:14px;
    }

    .tasting-readiness-item{
      display:flex;
      align-items:center;
      gap:10px;
      min-height:42px;
      padding:10px 12px;
      border-radius:14px;
      border:1px solid rgba(200,169,106,.08);
      background:rgba(255,255,255,.02);
      color:var(--muted);
      font-size:14px;
    }

    .tasting-readiness-item.is-done{
      border-color:rgba(108,140,84,.24);
      background:rgba(108,140,84,.08);
      color:#eef6e2;
    }

    .tasting-readiness-dot{
      font-size:14px;
      color:#f0d38a;
      line-height:1;
    }

    .tasting-save-deck{
      margin-bottom:16px;
      border:1px solid rgba(200,169,106,.14);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(12,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.12);
    }

    .tasting-save-deck-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .tasting-save-deck-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-save-deck-value{
      font-family:var(--font-serif);
      font-size:28px;
      line-height:1.08;
      color:var(--gold-2);
    }

    .tasting-save-deck-copy{
      margin-top:12px;
      color:var(--muted);
      font-size:14px;
      line-height:1.7;
    }

    .tasting-save-deck-tags{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:14px;
    }

    .tasting-save-actions{
      display:flex;
      justify-content:flex-start;
      margin-top:4px;
    }

    .tasting-save-actions #saveTastingBtn{
      min-width:240px;
      min-height:56px;
      font-size:17px;
      box-shadow:0 18px 34px rgba(0,0,0,.24);
    }

    .tasting-narrative-cell{
      border:1px solid rgba(200,169,106,.1);
      border-radius:16px;
      padding:14px;
      background:rgba(255,255,255,.02);
    }

    .tasting-narrative-cell-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .tasting-narrative-cell-copy{
      color:var(--text);
      font-size:14px;
      line-height:1.65;
    }

    .tone-good{
      background:rgba(108,140,84,.2);
      color:#d5efb4;
      border-color:rgba(108,140,84,.28);
    }

    .tone-warn{
      background:rgba(154,110,58,.18);
      color:#f3d8a3;
      border-color:rgba(154,110,58,.26);
    }

    .tone-alert{
      background:rgba(128,63,63,.2);
      color:#f0cccc;
      border-color:rgba(128,63,63,.26);
    }

    .tone-neutral{
      background:rgba(88,112,156,.18);
      color:#d4e2ff;
      border-color:rgba(88,112,156,.24);
    }

    .ech-pairing-readonly{
      background:linear-gradient(180deg, rgba(35,28,22,.98), rgba(24,19,15,.98)) !important;
      color:#d9c28f !important;
      border-color:rgba(200,169,106,.16) !important;
      cursor:not-allowed;
    }

    .empty{
      border:1px dashed #47352a;
      border-radius:20px;
      padding:34px 18px;
      text-align:center;
      color:var(--muted);
    }

    .separator{
      height:1px;
      background:#2b211a;
      margin:8px 0 2px;
    }

    .subheading{
      font-family:var(--font-serif);
      font-size:21px;
      color:var(--gold-2);
      margin:0 0 16px;
      letter-spacing:.01em;
    }

    .rating-pills{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }

    .rating-pills-slider{
      display:block;
    }

    .rating-slider{
      display:flex;
      flex-direction:column;
      gap:14px;
      padding:18px 18px 16px;
      border-radius:18px;
      border:1px solid rgba(163,126,67,.18);
      background:
        radial-gradient(circle at top right, rgba(163,126,67,.10), transparent 34%),
        linear-gradient(180deg, rgba(255,251,245,.72), rgba(246,241,232,.94));
      box-shadow:0 14px 24px rgba(53,39,20,.06);
    }

    .rating-slider-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
    }

    .rating-slider-value{
      font-family:var(--font-serif);
      font-size:34px;
      font-weight:700;
      line-height:1;
      color:#17362c;
      letter-spacing:-.02em;
    }

    .rating-slider-scale{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:34px;
      padding:7px 12px;
      border-radius:999px;
      border:1px solid rgba(163,126,67,.18);
      background:rgba(255,251,245,.88);
      color:#80602f;
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .rating-slider-input,
    .aroma-slider-input{
      width:100%;
      cursor:pointer;
      -webkit-appearance:none;
      appearance:none;
      height:12px;
      border-radius:999px;
      outline:none;
      touch-action:pan-y;
      -webkit-tap-highlight-color:transparent;
      background:
        linear-gradient(90deg, #1b5140 0%, #1b5140 var(--slider-fill, 0%), #d2c3ac var(--slider-fill, 0%), #d2c3ac 100%);
      box-shadow:inset 0 1px 2px rgba(54,39,19,.18);
    }

    .rating-slider-legend,
    .aroma-slider-legend{
      display:flex;
      align-items:center;
      justify-content:space-between;
      color:#80602f;
      font-size:12px;
      font-weight:600;
      letter-spacing:.08em;
      text-transform:uppercase;
    }

    .rating-slider-input::-webkit-slider-thumb,
    .aroma-slider-input::-webkit-slider-thumb{
      -webkit-appearance:none;
      appearance:none;
      width:20px;
      height:20px;
      border-radius:50%;
      background:linear-gradient(180deg, #1f634f 0%, #17362c 100%);
      border:2px solid #f7f1e7;
      box-shadow:0 4px 10px rgba(27,81,64,.28);
      cursor:pointer;
      margin-top:-4px;
    }

    .rating-slider-input::-moz-range-thumb,
    .aroma-slider-input::-moz-range-thumb{
      width:20px;
      height:20px;
      border:none;
      border-radius:50%;
      background:linear-gradient(180deg, #1f634f 0%, #17362c 100%);
      box-shadow:0 4px 10px rgba(27,81,64,.28);
      cursor:pointer;
    }

    .rating-slider-input::-moz-range-track,
    .aroma-slider-input::-moz-range-track{
      height:12px;
      border:none;
      border-radius:999px;
      background:#d2c3ac;
    }

    .rating-pill{
      width:38px;
      height:38px;
      border-radius:999px;
      border:1px solid #5e493a;
      background:#1a1411;
      color:var(--muted);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:14px;
      user-select:none;
    }

    .rating-pill.active{
      border-color:var(--gold-2);
      background:var(--gold);
      color:#000;
      font-weight:700;
    }

    .aroma-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:14px;
    }

    .aroma-summary-card{
      grid-column:1 / -1;
      border:1px solid rgba(200,169,106,.14);
      border-radius:18px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 32%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(12,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.14);
    }

    .aroma-summary-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .aroma-summary-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .aroma-summary-value{
      font-family:var(--font-serif);
      font-size:26px;
      line-height:1.08;
      color:var(--gold-2);
    }

    .aroma-summary-pill{
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(200,169,106,.16);
      background:rgba(255,255,255,.03);
      color:#f0d38a;
      font-size:11px;
      letter-spacing:.14em;
      text-transform:uppercase;
      white-space:nowrap;
    }

    .aroma-summary-copy{
      margin-top:12px;
      color:var(--muted);
      font-size:14px;
      line-height:1.6;
    }

    .aroma-card{
      border:1px solid rgba(163,126,67,.16);
      background:
        radial-gradient(circle at top right, rgba(163,126,67,.08), transparent 34%),
        linear-gradient(180deg, rgba(255,251,245,.68), rgba(246,241,232,.95));
      border-radius:18px;
      padding:16px 16px 14px;
      box-shadow:0 14px 24px rgba(53,39,20,.05);
    }

    .aroma-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      margin-bottom:12px;
    }

    .aroma-name{
      font-size:16px;
      font-weight:600;
      color:#17362c;
      line-height:1.35;
    }

    .aroma-badge{
      border-radius:999px;
      background:rgba(255,251,245,.88);
      color:#a37e43;
      padding:7px 11px;
      font-size:12px;
      font-weight:700;
      border:1px solid rgba(163,126,67,.18);
      min-width:68px;
      text-align:center;
    }

    .progress{
      height:8px;
      background:#e4d7c4;
      border-radius:999px;
      overflow:hidden;
      box-shadow:inset 0 1px 3px rgba(54,39,19,.12);
    }

    .progress > span{
      display:block;
      height:100%;
      background:linear-gradient(90deg, #1b5140 0%, #a37e43 100%);
      width:0%;
    }

    .aroma-slider-wrap{
      margin-top:16px;
      display:flex;
      flex-direction:column;
      gap:12px;
    }

    .aroma-values{
      margin-top:12px;
      display:flex;
      gap:6px;
      flex-wrap:wrap;
    }

    .aroma-value{
      width:32px;
      height:32px;
      border-radius:999px;
      border:1px solid #5e493a;
      background:#1a1411;
      color:var(--muted);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      transition:transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
    }

    .aroma-value:hover{
      transform:translateY(-1px);
      border-color:rgba(200,169,106,.28);
      color:#f2ddb0;
    }

    .aroma-value.active{
      border-color:var(--gold-2);
      background:var(--gold);
      color:#000;
      font-weight:700;
    }

    .tasting-auto-score-card{
      display:flex;
      flex-direction:column;
      gap:12px;
      padding:18px;
      border-radius:18px;
      border:1px solid rgba(163,126,67,.18);
      background:linear-gradient(180deg, #f6f1e8 0%, #ece4d8 100%);
      box-shadow:0 14px 26px rgba(44,33,19,.08);
    }

    .tasting-auto-score-label{
      font-size:11px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color:#80602f;
    }

    .tasting-auto-score-value{
      font-family:var(--font-serif);
      font-size:38px;
      font-weight:700;
      line-height:1;
      color:#17362c;
    }

    .tasting-auto-score-copy{
      color:#5f5a50;
      font-size:14px;
      line-height:1.7;
    }

    .tasting-auto-score-card[data-tone="gold"] .tasting-auto-score-value{ color:#a37e43; }
    .tasting-auto-score-card[data-tone="green"] .tasting-auto-score-value{ color:#1b5140; }
    .tasting-auto-score-card[data-tone="blue"] .tasting-auto-score-value{ color:#315c7c; }
    .tasting-auto-score-card[data-tone="amber"] .tasting-auto-score-value{ color:#8d6228; }
    .tasting-auto-score-card[data-tone="red"] .tasting-auto-score-value{ color:#87453b; }

    #t_first_third,
    #t_second_third,
    #t_final_third,
    #t_general{
      min-height:148px;
      line-height:1.68;
      padding:16px 17px;
      background:linear-gradient(180deg, rgba(25,19,14,.98), rgba(15,12,9,.98));
      border-color:rgba(200,169,106,.14);
    }

    #t_first_third::placeholder,
    #t_second_third::placeholder,
    #t_final_third::placeholder,
    #t_general::placeholder{
      color:#8d7b67;
      line-height:1.55;
    }

    .stats-grid{
      display:grid;
      grid-template-columns:2fr 1fr;
      gap:20px;
    }

    .simple-bars{
      display:grid;
      gap:10px;
      margin-top:6px;
    }

    .bar-row{
      display:grid;
      grid-template-columns:160px 1fr 70px;
      gap:12px;
      align-items:center;
      font-size:14px;
      color:var(--muted);
    }

    .bar-track{
      width:100%;
      height:12px;
      border-radius:999px;
      background:#221913;
      overflow:hidden;
    }

    .bar-fill{
      height:100%;
      width:0%;
      border-radius:999px;
      background:linear-gradient(90deg,#8f5d3b,#c8a96a,#e5c88b);
    }

    .insights{
      display:grid;
      gap:14px;
    }

    .insight{
      border:1px solid var(--line);
      background:#171311;
      border-radius:18px;
      padding:16px;
    }

    .insight-label{
      font-size:11px;
      text-transform:uppercase;
      letter-spacing:.22em;
      color:#b8a27b;
    }

    .insight-value{
      margin-top:10px;
      font-family:var(--font-serif);
      font-size:24px;
      color:var(--gold-2);
    }

    .footer-note{
      margin-top:18px;
      border:1px solid var(--line-soft);
      background:#120f0d;
      border-radius:18px;
      padding:16px;
      color:#d3ccc1;
      line-height:1.7;
      font-size:14px;
    }

    .modal{
      position:fixed;
      inset:0;
      display:none;
      align-items:center;
      justify-content:center;
      background:rgba(0,0,0,.7);
      padding:20px;
      z-index:100;
    }

    .modal.open{display:flex}

    .modal-box{
      width:min(1100px,100%);
      max-height:88vh;
      overflow:auto;
      border:1px solid #47352a;
      background:#120f0d;
      color:var(--text);
      border-radius:24px;
      padding:24px;
    }

    .modal-head{
      display:flex;
      justify-content:space-between;
      gap:12px;
      align-items:center;
      margin-bottom:18px;
    }

    .modal-title{
      font-family:var(--font-serif);
      color:var(--gold-2);
      font-size:28px;
      margin:0;
    }

    .close{
      border:none;
      width:42px;
      height:42px;
      border-radius:14px;
      background:#241b15;
      color:#f2d89d;
      font-size:18px;
    }

    .modal-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:20px;
    }

    .detail-box{
      border:1px solid var(--line);
      background:#171311;
      border-radius:18px;
      padding:16px;
    }

    .detail-box p{
      margin:0 0 12px;
      color:#d3ccc1;
      line-height:1.7;
      font-size:14px;
    }

    .detail-box strong{color:var(--gold-2)}

    .upload-preview{
      display:flex;
      align-items:center;
      gap:12px;
      margin-top:8px;
      flex-wrap:wrap;
    }

    .upload-preview img{
      width:82px;
      height:110px;
      object-fit:cover;
      border-radius:12px;
      border:1px solid var(--line-soft);
      background:#0d0d0d;
    }

    .collection-card{
      display:grid;
      grid-template-columns:120px 1fr;
      gap:16px;
      align-items:start;
      background:#171311;
      border:1px solid var(--line);
      border-radius:20px;
      padding:16px;
    }

    .collection-card img{
      width:100%;
      height:160px;
      object-fit:cover;
      border-radius:14px;
      border:1px solid var(--line-soft);
      background:#0c0c0c;
    }

    .collection-title{
      margin:0;
      font-family:var(--font-serif);
      font-size:24px;
      color:var(--gold-2);
    }

    .collection-sub{
      margin-top:4px;
      color:var(--text);
      font-size:14px;
    }

    .collection-desc{
      margin-top:12px;
      color:var(--muted);
      line-height:1.7;
      font-size:14px;
    }

    .qr-wrap{
      display:grid;
      gap:18px;
      align-items:stretch;
    }

    .qr-box{
      border:1px solid var(--line-soft);
      background:#120f0d;
      border-radius:18px;
      padding:18px;
      text-align:center;
    }

    .qr-box #qrcode{
      display:flex;
      justify-content:center;
      padding:10px;
      background:#fff;
      border-radius:16px;
      width:max-content;
      margin:0 auto;
    }

    .qr-link{
      word-break:break-all;
      color:#d6c29b;
      font-size:13px;
      line-height:1.6;
      margin-top:10px;
    }

    .collection-share-summary{
      border:1px solid rgba(200,169,106,.16);
      border-radius:20px;
      padding:16px 18px;
      background:
        radial-gradient(circle at top right, rgba(212,174,90,.08), transparent 30%),
        linear-gradient(180deg, rgba(24,18,13,.98), rgba(11,9,7,.98));
      box-shadow:0 14px 34px rgba(0,0,0,.12);
    }

    .collection-share-summary-head{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap:12px;
    }

    .collection-share-summary-label{
      font-size:11px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .collection-share-summary-value{
      font-family:var(--font-serif);
      font-size:28px;
      line-height:1.05;
      color:var(--gold-2);
    }

    .collection-share-summary-copy{
      margin-top:12px;
      color:#c7b187;
      font-size:14px;
      line-height:1.7;
    }

    .collection-share-summary-grid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:12px;
      margin-top:14px;
    }

    .collection-share-summary-item{
      border:1px solid rgba(200,169,106,.1);
      border-radius:16px;
      padding:14px;
      background:rgba(255,255,255,.02);
    }

    .collection-share-summary-item-label{
      font-size:11px;
      letter-spacing:.16em;
      text-transform:uppercase;
      color:#b8a27b;
      margin-bottom:8px;
    }

    .collection-share-summary-item-value{
      font-size:16px;
      color:#f5e7bf;
      line-height:1.45;
      word-break:break-word;
    }

    .collection-public-extra-actions{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:10px;
    }

    .qr-wrap > #copyCollectionLinkBtn,
    .collection-public-extra-actions .btn{
      width:100%;
      min-height:48px;
    }

    .public-page{
      min-height:100vh;
      padding:28px 20px 40px;
      background:radial-gradient(circle at top,#2c1a12 0%,#120f0d 30%,#090909 65%,#040404 100%);
    }

    .public-shell{
      max-width:1200px;
      margin:0 auto;
    }

    .public-hero{
      border:1px solid rgba(200,169,106,.25);
      background:rgba(15,12,10,.88);
      border-radius:32px;
      padding:28px;
      box-shadow:var(--shadow);
      position:relative;
      overflow:hidden;
    }

    .public-hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(135deg,rgba(200,169,106,.08),transparent 35%,transparent 65%,rgba(200,169,106,.05));
      pointer-events:none;
    }

    .public-hero-inner{position:relative}
    .public-title{
      font-family:var(--font-serif);
      font-size:38px;
      letter-spacing:.2em;
      color:var(--gold-2);
      margin:0;
    }

    .public-sub{
      margin-top:8px;
      color:#b8a27b;
      text-transform:uppercase;
      letter-spacing:.35em;
      font-size:12px;
    }

    .public-copy{
      margin-top:18px;
      max-width:760px;
      color:#d2cbc0;
      line-height:1.8;
      font-size:15px;
    }

    .public-grid{
      margin-top:22px;
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:18px;
    }

    .public-stat{
      border:1px solid var(--line);
      background:#171311;
      border-radius:18px;
      padding:16px;
    }

    .public-stat-label{
      color:#a6906a;
      font-size:11px;
      text-transform:uppercase;
      letter-spacing:.2em;
    }

    .public-stat-value{
      margin-top:8px;
      font-family:var(--font-serif);
      color:var(--gold-2);
      font-size:30px;
    }

    .public-list{
      margin-top:26px;
      display:grid;
      gap:16px;
    }

    .public-empty{
      margin-top:26px;
      border:1px dashed #47352a;
      border-radius:20px;
      padding:40px 20px;
      text-align:center;
      color:var(--muted);
      background:rgba(18,15,13,.85);
    }

    @media (max-width: 1200px){
      .hero-inner,.grid-sidebar,.grid-tasting,.stats-grid,.grid-collection{grid-template-columns:1fr}
      .aroma-grid{grid-template-columns:repeat(2,1fr)}
      .tab-buttons{grid-template-columns:repeat(3,1fr)}
    }

    @media (max-width: 900px){
      .grid-2,.form-grid,.item-meta,.modal-grid,.public-grid{grid-template-columns:1fr}
      .metrics{grid-template-columns:1fr 1fr}
      .bar-row{grid-template-columns:1fr}
      .aroma-summary-head{flex-direction:column;align-items:flex-start}
      .tasting-live-summary-head{flex-direction:column;align-items:flex-start}
      .tasting-narrative-head{flex-direction:column;align-items:flex-start}
      .tasting-narrative-grid{grid-template-columns:1fr}
      .tasting-readiness-head{flex-direction:column;align-items:flex-start}
      .tasting-readiness-grid{grid-template-columns:1fr}
      .tasting-save-deck-head{flex-direction:column;align-items:flex-start}
      .tasting-save-actions #saveTastingBtn{width:100%;min-width:0}
      .collection-public-extra-actions{grid-template-columns:1fr}
      #collection .grid-collection > .grid{grid-template-columns:1fr}
    }

    @media (max-width: 640px){
      .container{padding:14px}
      .hero{padding:18px}
      .brand-title{font-size:26px}
      .section-title{font-size:20px}
      .metrics{grid-template-columns:1fr}
      .aroma-grid{grid-template-columns:1fr}
      .tab-buttons{grid-template-columns:repeat(2,1fr)}
      .collection-card{grid-template-columns:1fr}
      .public-title{font-size:28px}
    }

    @media (max-width: 820px){
      .hero{
        padding:18px;
        border-radius:24px;
      }

      .hero-inner{
        gap:18px;
      }

      .login-top-back{
        position:static !important;
        margin-bottom:14px;
        display:flex;
        justify-content:flex-end;
      }

      .hero-copy{
        font-size:15px;
        line-height:1.7;
      }

      .hero-control-row{
        flex-wrap:wrap;
        gap:10px;
      }

      .tabs{
        overflow:visible;
      }

      .tab-buttons{
        flex-wrap:nowrap !important;
        overflow-x:auto;
        overflow-y:hidden;
        padding:4px 2px 8px;
        margin:0 -2px;
        scroll-snap-type:x proximity;
        -webkit-overflow-scrolling:touch;
      }

      .tab-buttons::-webkit-scrollbar{
        display:none;
      }

      .tab-btn{
        min-width:144px;
        min-height:64px;
        scroll-snap-align:start;
        justify-content:center;
      }

      .card{
        border-radius:22px;
      }

      .card-content,
      .card-header{
        padding-left:16px;
        padding-right:16px;
      }

      .toolbar{
        gap:12px;
      }

      .filters-grid{
        grid-template-columns:1fr;
      }

      .search-wrap{
        width:100%;
      }

      .input,
      .select,
      .textarea,
      button.btn,
      .btn.btn-secondary,
      .btn.btn-ghost{
        font-size:16px;
      }

      .input,
      .select{
        min-height:52px;
      }

      .btn{
        min-height:52px;
        padding:13px 18px;
      }

      .action-row{
        justify-content:stretch;
      }

      .action-row > *{
        flex:1 1 100%;
      }

      .rating-slider{
        padding:18px 16px 16px;
        gap:12px;
      }

      .rating-slider-head{
        align-items:flex-start;
        flex-direction:column;
        gap:8px;
      }

      .rating-slider-value{
        font-size:30px;
      }

      .rating-slider-input,
      .aroma-slider-input{
        height:16px;
      }

      .rating-slider-input::-webkit-slider-thumb,
      .aroma-slider-input::-webkit-slider-thumb{
        width:30px;
        height:30px;
        margin-top:-7px;
      }

      .rating-slider-input::-moz-range-thumb,
      .aroma-slider-input::-moz-range-thumb{
        width:30px;
        height:30px;
      }

      .rating-slider-legend,
      .aroma-slider-legend{
        font-size:11px;
        letter-spacing:.06em;
      }

      .tasting-narrative-grid,
      .tasting-readiness-grid{
        gap:10px;
      }

      .upload-preview{
        flex-direction:column;
        align-items:stretch;
      }

      #tastingBandSection > div[style*="display:grid"]{
        grid-template-columns:1fr !important;
      }
    }

    .brand-logo-img{
      position:relative;
      z-index:2;
      width:100%;
      height:100%;
      object-fit:contain;
      padding:10px 14px;
      display:none;
      background:transparent;
    }

    .brand-logo-fallback{
      position:relative;
      z-index:2;
      width:100%;
      height:100%;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-direction:column;
    }

    .brand-logo-fallback.hidden{display:none}
    .brand-logo-img.visible{display:block}

    .action-row{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      justify-content:flex-end;
    }

    .filters-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(140px,1fr));
      gap:10px;
      width:100%;
    }

    .inline-muted{
      color:var(--muted);
      font-size:13px;
    }

    .statline{
      margin-top:12px;
      display:flex;
      gap:8px;
      flex-wrap:wrap;
    }

    .gallery-grid-premium{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
      gap:18px;
    }

    .gallery-card{
      border:1px solid var(--line);
      background:#171311;
      border-radius:22px;
      overflow:hidden;
      box-shadow:0 16px 40px rgba(0,0,0,.24);
    }

    .gallery-card-media{
      aspect-ratio:4/5;
      background:#0c0c0c;
      border-bottom:1px solid var(--line);
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

    .gallery-card-media img{
      width:100%;
      height:100%;
      object-fit:cover;
    }

    .gallery-card-body{
      padding:16px;
    }

    .public-logo-wrap{
      margin-bottom:14px;
    }

    .logo-slot-note{
      margin-top:8px;
      color:var(--muted);
      font-size:12px;
      letter-spacing:.04em;
    }

/* === admin tab visibility fix === */
.tab-buttons{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  align-items:center !important;
}

.tab-btn{
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

/* === admin tab fixed visibility === */
.tab-buttons,
.tabs,
.tab-nav{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  align-items:center !important;
}

.tab-btn{
  flex:0 0 auto !important;
  white-space:nowrap !important;
}














/* ===== Dashboard visual refine real ===== */

/* HERO e TABS com a mesma largura visual */
.container > section.hero,
.container > section.tabs{
  width: 100% !important;
  box-sizing: border-box !important;
}

.container > section.tabs{
  margin-top: 18px !important;
  padding: 0 !important;
}

/* Área superior */
.hero{
  padding: 30px 32px !important;
}

.hero-inner{
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr) !important;
  align-items: center !important;
  gap: 28px !important;
}

/* Logo + saudação lado a lado */
.brand{
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 32px !important;
  width: 100% !important;
}

.logo-round{
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}

.logo-round::before,
.logo-round::after{
  display: none !important;
  content: none !important;
}

/* Logo realmente maior */
#mainBrandLogoImg{
  display: block !important;
  width: 100% !important;
  max-width: 340px !important;
  height: auto !important;
  object-fit: contain !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Esconde os textos antigos do bloco da marca */
.brand-title,
.brand-subtitle,
.logo-slot-note,
.hero-copy{
  display: none !important;
}

/* Wrapper ao lado da logo */
.brand > div:last-child{
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  flex: 1 1 auto !important;
  min-width: 280px !important;
  max-width: 560px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Saudação */
#currentUserLine{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #e6d3a3 !important;
  max-width: 100% !important;
}

#currentUserLine .greeting-title{
  display: block !important;
  font-size: 32px !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  color: #f0d38a !important;
  font-family: var(--font-serif) !important;
}

#currentUserLine .greeting-subtitle{
  display: block !important;
  margin-top: 8px !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
  color: #d6bb87 !important;
  max-width: 520px !important;
}

#logoutBtn{
  margin-top: 16px !important;
}

/* Cards métricos superiores */
.metrics{
  gap: 16px !important;
  align-self: center !important;
}

.metric{
  min-height: 156px !important;
}

.metric-label{
  font-size: 15px !important;
  letter-spacing: .16em !important;
}

/* Card das abas maior e alinhado com o topo */
.tab-buttons{
  width: 100% !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 16px !important;
  padding: 18px 22px !important;
  min-height: 112px !important;
  align-items: stretch !important;
  border-radius: 24px !important;
}

.tab-btn{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 8px !important;
  min-height: 72px !important;
  padding: 14px 12px !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  border-radius: 18px !important;
}

.tab-btn span:first-child{
  font-size: 24px !important;
  line-height: 1 !important;
}

.tab-btn span:last-child{
  font-size: 17px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

/* Responsivo */
@media (max-width: 1180px){
  .hero-inner{
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .brand{
    gap: 22px !important;
  }

  #mainBrandLogoImg{
    max-width: 280px !important;
  }

  .brand > div:last-child{
    max-width: none !important;
  }

  #currentUserLine .greeting-title{
    font-size: 28px !important;
  }

  .tab-buttons{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    min-height: auto !important;
  }

  .tab-btn{
    min-height: 66px !important;
  }
}

@media (max-width: 760px){
  .brand{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }

  #mainBrandLogoImg{
    max-width: 240px !important;
  }

  #currentUserLine .greeting-title{
    font-size: 24px !important;
  }

  #currentUserLine .greeting-subtitle{
    font-size: 15px !important;
  }

  .tab-buttons{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 14px !important;
  }

  .tab-btn{
    min-height: 58px !important;
    padding: 12px 10px !important;
  }

  .tab-btn span:first-child{
    font-size: 21px !important;
  }

  .tab-btn span:last-child{
    font-size: 15px !important;
  }
}


/* ===== RESTORE GREETING + LOGO SIDE BY SIDE ===== */
.brand{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:40px !important;
}

.logo-round{
  flex:0 0 auto !important;
}

#mainBrandLogoImg{
  max-width:360px !important;
  width:100% !important;
  height:auto !important;
}

#currentUserLine{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
  max-width:520px !important;
  min-width:280px !important;
}

#currentUserLine .greeting-title{
  font-size:34px !important;
  font-weight:700 !important;
  line-height:1.08 !important;
  color:#f0d38a !important;
  font-family:var(--font-serif) !important;
}

#currentUserLine .greeting-subtitle{
  margin-top:8px !important;
  font-size:17px !important;
  line-height:1.45 !important;
  color:#d6bb87 !important;
}

@media (max-width: 760px){
  .brand{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:16px !important;
  }

  #mainBrandLogoImg{
    max-width:240px !important;
  }

  #currentUserLine{
    min-width:0 !important;
    max-width:none !important;
  }
}


/* ===== AUTH GREETING SAFE ===== */
#appRoot .brand{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:16px !important;
}

#appRoot .logo-round{
  flex:0 0 auto !important;
}

#appRoot #mainBrandLogoImg{
  max-width:380px !important;
  width:100% !important;
  height:auto !important;
  display:block !important;
}

#appRoot #currentUserLine{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:flex-start !important;
    min-width:320px !important;
    max-width:620px !important;
    margin:0 0 10px 0 !important;
    padding:0 !important;
  }

  #appRoot #currentUserLine .greeting-title{
    font-size:34px !important;
    line-height:1.08 !important;
    font-weight:700 !important;
    color:#f0d38a !important;
  font-family:var(--font-serif) !important;
}

  #appRoot #currentUserLine .greeting-subtitle{
      margin-top:4px !important;
      font-size:17px !important;
      line-height:1.45 !important;
      color:#d6bb87 !important;
      max-width:620px !important;
    }

  #appRoot .brand-subtitle{
    margin-top:0 !important;
  }

  #appRoot .hero{
  background:
    radial-gradient(circle at top left, rgba(200,169,106,.11), transparent 34%),
    linear-gradient(135deg, rgba(25,19,14,.98), rgba(14,11,9,.98)) !important;
  border-color: rgba(200,169,106,.22) !important;
  box-shadow: 0 28px 60px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.02) !important;
}

#appRoot .hero::after{
  content:"";
  position:absolute;
  inset:auto -80px -120px auto;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(200,169,106,.12) 0%, rgba(200,169,106,0) 72%);
  pointer-events:none;
}

#appRoot .hero-inner{
  align-items:stretch !important;
  gap:32px !important;
}

#appRoot .metrics{
  gap:18px !important;
}

#appRoot .metric{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(23,18,14,.98), rgba(13,10,8,.98)) !important;
  border-color:rgba(200,169,106,.16) !important;
  box-shadow:0 14px 28px rgba(0,0,0,.16) !important;
  min-height:164px !important;
}

#appRoot .metric::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(200,169,106,.06), transparent 42%);
  pointer-events:none;
}

#appRoot .metric-top{
  position:relative;
  z-index:1;
}

#appRoot .metric-value{
  letter-spacing:-.03em !important;
}

#appRoot .metric-hint{
  color:#b9a47f !important;
}

#appRoot .metric-icon{
  border-color:rgba(200,169,106,.18) !important;
  background:linear-gradient(180deg, rgba(43,31,22,.92), rgba(21,16,13,.92)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}

  #appRoot #logoutBtn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:44px !important;
  padding:0 18px !important;
  border-radius:14px !important;
  border-color:rgba(200,169,106,.2) !important;
    background:rgba(255,255,255,.03) !important;
    margin-top:10px !important;
  color:#f0d496 !important;
  box-shadow:none !important;
    line-height:1 !important;
  }

  #appRoot .hero-control-row{
    margin-top:4px !important;
  }

@media (max-width: 760px){
  #appRoot .brand{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:16px !important;
  }

  #appRoot #mainBrandLogoImg{
    max-width:240px !important;
  }

  #appRoot #currentUserLine{
    min-width:0 !important;
    max-width:none !important;
  }

  #appRoot #currentUserLine .greeting-title{
    font-size:24px !important;
  }

  #appRoot #currentUserLine .greeting-subtitle{
    font-size:15px !important;
  }
}


/* ===== AUTH GREETING BLOCK ===== */
#appRoot #authGreetingBlock{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
  min-width:320px !important;
  max-width:560px !important;
  margin:0 !important;
  padding:0 !important;
}

#appRoot #authGreetingBlock .greeting-title{
  font-size:34px !important;
  line-height:1.08 !important;
  font-weight:700 !important;
  color:#f0d38a !important;
  font-family:var(--font-serif) !important;
}

#appRoot #authGreetingBlock .greeting-subtitle{
  margin-top:8px !important;
  font-size:17px !important;
  line-height:1.45 !important;
  color:#d6bb87 !important;
  max-width:520px !important;
}


/* ===== REDUCE LOGO GREETING GAP ===== */
#appRoot .brand{
  gap: 16px !important;
  align-items: center !important;
}

#appRoot #mainBrandLogoImg{
  margin-right: 0 !important;
}

#appRoot #authGreetingBlock{
  margin-left: 0 !important;
}


/* ===== METRICS RESIZE ===== */
.metrics{
  gap: 18px !important;
}

.metric{
  min-height: 178px !important;
  padding: 22px 24px !important;
  border-radius: 24px !important;
}

.metric-top{
  align-items: flex-start !important;
  gap: 14px !important;
}

.metric-label{
  font-size: 16px !important;
  letter-spacing: .18em !important;
  line-height: 1.3 !important;
}

.metric-value{
  font-size: 28px !important;
  line-height: 1.05 !important;
}

.metric-subtitle,
.metric-desc,
.metric small,
.metric p{
  font-size: 16px !important;
  line-height: 1.45 !important;
}

.metric .section-icon,
.metric .metric-icon,
.metric-top .icon,
.metric-top i,
.metric-top svg{
  width: 22px !important;
  height: 22px !important;
  font-size: 22px !important;
}

#appRoot .hero-control-row{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
}

#appRoot .hero-language-switch{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:999px;
  border:1px solid rgba(200,169,106,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  box-shadow:0 14px 28px rgba(0,0,0,.14);
}

#appRoot #heroLanguageSwitch .lang-flag-btn{
  width:30px;
  height:30px;
  min-width:30px;
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(200,169,106,.18);
  background:rgba(14,11,9,.76);
  color:#f4d897;
  font-size:20px;
  line-height:1;
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  padding:0;
  overflow:hidden;
  flex:0 0 30px;
}

#appRoot #heroLanguageSwitch .lang-flag-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(233,200,131,.36);
  background:rgba(29,21,16,.94);
}

#appRoot #heroLanguageSwitch .lang-flag-btn.active{
  border-color:rgba(240,211,138,.52);
  background:linear-gradient(180deg, rgba(200,169,106,.24), rgba(76,54,27,.28));
  box-shadow:0 0 0 3px rgba(200,169,106,.10);
}

#appRoot #heroLanguageSwitch .lang-flag-btn > img{
  width:18px !important;
  height:18px !important;
  min-width:18px;
  min-height:18px;
  max-width:18px;
  max-height:18px;
  display:block;
  object-fit:contain;
  border-radius:0;
  pointer-events:none;
  position:static;
  transform:none;
  margin:0;
  box-shadow:none;
}

@media (max-width: 760px){
  #appRoot .hero-control-row{
    align-items:flex-start;
  }

  #appRoot .hero-language-switch{
    padding:6px 7px;
  }

  #appRoot #heroLanguageSwitch .lang-flag-btn{
    width:28px;
    height:28px;
    min-width:28px;
    min-height:28px;
    flex:0 0 28px;
  }

  #appRoot #heroLanguageSwitch .lang-flag-btn > img{
    width:16px !important;
    height:16px !important;
    min-width:16px;
    min-height:16px;
    max-width:16px;
    max-height:16px;
  }
}

@media (max-width: 1180px){
  .metric{
    min-height: 162px !important;
    padding: 20px 22px !important;
  }

  .metric-value{
    font-size: 26px !important;
  }

  .metric-label{
    font-size: 15px !important;
  }

  .tasting-ratings-summary-head{
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  #inventoryCreateModal .form-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 760px){
  #inventoryCreateModal{
    padding:12px !important;
    align-items:flex-end !important;
  }

  #inventoryCreateModal > div{
    width:100% !important;
    max-height:92vh !important;
    border-radius:24px 24px 0 0 !important;
  }
}


/* ===== HUMIDOR STEP 1 SAFE ===== */
/* Oculta visualmente campos do formulário sem remover do DOM */
#inventory .field:has(#h_wrapper),
#inventory .field:has(#h_binder),
#inventory .field:has(#h_filler),
#inventory .field:has(#h_vendor),
#inventory .field:has(#h_slot),
#inventory .field:has(#h_notes){
  display: none !important;
}


/* ===== HUMIDOR SAVE BUTTON CENTER ===== */
#inventory #saveHumidorBtn{
  display: inline-flex !important;
}

#inventory #saveHumidorBtn{
  min-width: 240px !important;
}

#inventory #saveHumidorBtn{
  justify-content: center !important;
}

#inventory #saveHumidorBtn{
  margin: 0 auto !important;
}

#inventory #saveHumidorBtn{
  display: flex !important;
}

#inventory #saveHumidorBtn{
  align-items: center !important;
}

#inventory #saveHumidorBtn{
  text-align: center !important;
}

#inventory #saveHumidorBtn{
  width: auto !important;
}

#inventory #saveHumidorBtn{
  max-width: 100% !important;
}

#inventory #saveHumidorBtn{
  align-self: center !important;
}

#inventory #saveHumidorBtn{
  font-size: 17px !important;
}

#inventory #saveHumidorBtn{
  font-weight: 600 !important;
}

#inventory .card-content > div:has(#saveHumidorBtn){
  display: flex !important;
  justify-content: center !important;
}

/* ===== ECH EDITORIAL COLOR REMODEL 2026-07 ===== */
:root{
  --bg:#E7E0D4;
  --bg-soft:#F3EEE5;
  --panel:#F6F1E8;
  --panel-2:#F3EEE5;
  --panel-3:#ECE4D8;
  --line:#C9BEAC;
  --line-soft:#DDD4C6;
  --gold:#A37E43;
  --gold-2:#C0A05D;
  --text:#171613;
  --muted:#5F5A50;
  --muted-2:#81796D;
  --danger:#87453B;
  --ok:#315A49;
  --shadow:0 24px 56px rgba(23,54,44,.08);
  --ech-bg-deep:#0D241D;
  --ech-bg-deeper:#071914;
  --ech-panel-soft:#ECE4D8;
  --ech-panel-tint:#E2EAE5;
  --ech-text-on-dark:#F3EEE5;
  --ech-text-on-dark-muted:#D5CBB9;
  --ech-text-on-dark-soft:#BCAF99;
  --ech-bronze:#A37E43;
  --ech-bronze-dark:#80602F;
  --ech-bronze-light:#CFB777;
  --ech-warning:#9A7438;
}

html,body{
  background:linear-gradient(145deg, #E7E0D4 0%, #F3EEE5 48%, #ECE4D8 100%);
  color:var(--text);
}

.hero{
  border-color:rgba(201,190,172,.88);
  background:linear-gradient(155deg, #F8F4EC 0%, #F1EBE0 100%);
  box-shadow:0 24px 52px rgba(23,54,44,.08);
}

.hero::before{
  background:linear-gradient(135deg, rgba(163,126,67,.06), transparent 38%, transparent 66%, rgba(23,54,44,.05));
}

.logo-round{
  background:linear-gradient(145deg, #071914 0%, #0D241D 52%, #17362C 100%);
  border-color:rgba(163,126,67,.34);
  box-shadow:0 0 24px rgba(23,54,44,.12);
}

.logo-round::before{
  border-color:rgba(207,183,119,.22);
}

.logo-round::after{
  color:rgba(243,238,229,.38);
}

.brand-title,
.metric-value{
  color:var(--ech-bg-deep);
}

.brand-subtitle,
.metric-label,
.field label,
.section-badge,
.tasting-ratings-summary-label,
.tasting-live-summary-label,
.tasting-narrative-label,
.tasting-readiness-label,
.tasting-third-score-label{
  color:var(--ech-bronze);
}

.hero-copy,
.section-subtitle,
.metric-hint,
.item-meta,
.item-notes,
.footer-note,
.tasting-ratings-summary-copy,
.tasting-live-summary-copy,
.tasting-narrative-copy{
  color:var(--muted);
}

.logo-slot-note{
  color:var(--muted-2) !important;
}

.metric{
  border-color:rgba(201,190,172,.88);
  background:linear-gradient(155deg, #F8F4EC 0%, #F1EBE0 100%);
  box-shadow:0 14px 28px rgba(23,54,44,.06);
}

.metric-icon,
.section-icon{
  border-color:rgba(163,126,67,.22);
  background:rgba(23,54,44,.06);
  color:var(--ech-bg-deep);
  box-shadow:none;
}

.tab-buttons{
  background:linear-gradient(145deg, #071914 0%, #0D241D 60%, #17362C 100%);
  border-color:rgba(128,96,47,.28);
  box-shadow:inset 0 0 0 1px rgba(243,238,229,.03);
}

.tab-btn{
  color:var(--ech-text-on-dark-soft);
}

.tab-btn.active{
  background:linear-gradient(155deg, #F8F4EC 0%, #F1EBE0 100%);
  color:var(--ech-bg-deep);
  border:1px solid rgba(163,126,67,.28);
  box-shadow:0 10px 20px rgba(23,54,44,.10);
}

.tab-btn:hover{
  color:var(--ech-text-on-dark);
}

.card,
.item-card,
.tasting-ratings-summary,
.tasting-live-summary,
.tasting-narrative-card,
.tasting-readiness-card,
.tasting-closing-card{
  border-color:rgba(201,190,172,.9);
  background:linear-gradient(155deg, #F8F4EC 0%, #F1EBE0 100%);
  box-shadow:0 16px 34px rgba(23,54,44,.07);
}

.section-title,
.item-sub,
.item-meta strong,
.tasting-ratings-summary-value,
.tasting-live-summary-value,
.tasting-narrative-value,
.tasting-readiness-value{
  color:var(--text);
}

.input,.select,.textarea{
  border-color:var(--line);
  background:#F6F1E8;
  color:var(--text);
}

.input::placeholder,.textarea::placeholder{
  color:var(--muted-2);
}

.input:focus,.select:focus,.textarea:focus{
  border-color:var(--ech-bronze);
  box-shadow:0 0 0 3px rgba(163,126,67,.18);
  background:#F6F1E8;
}

.btn{
  background:#17362C;
  color:#F6E7BF;
  border:1px solid rgba(23,54,44,.92);
  box-shadow:0 12px 24px rgba(23,54,44,.14);
}

.btn:hover{
  background:#214638;
  color:#F1D99D;
  border-color:#214638;
  box-shadow:0 14px 28px rgba(23,54,44,.18);
}

.btn:focus-visible,.input:focus-visible,.select:focus-visible,.textarea:focus-visible,.tab-btn:focus-visible{
  box-shadow:0 0 0 3px rgba(163,126,67,.18), 0 0 0 1px rgba(163,126,67,.42);
}

.btn-secondary{
  background:#17362C;
  color:#F6E7BF;
  border:1px solid rgba(23,54,44,.92);
  box-shadow:0 12px 24px rgba(23,54,44,.14);
}

.btn-secondary:hover{
  background:#214638;
  color:#F1D99D;
  border-color:#214638;
}

.btn-danger{
  background:transparent;
  color:#87453B;
  border:1px solid #C99D96;
}

.btn-danger:hover{
  background:#F2E3E0;
  color:#87453B;
  border-color:#87453B;
}

.search-icon{
  color:var(--muted-2);
}

.item-title h3{
  color:var(--text);
}

.pill{
  border-color:rgba(201,190,172,.88);
}

.pill-gold,
.rating-pill[data-tone="gold"].active,
.tone-gold,
.rating-pill[data-tone="amber"].active,
.tone-amber,
.tasting-live-summary-pill,
.tasting-narrative-tag{
  background:#F1E7CF;
  color:#80602F;
  border-color:#C0A05D;
}

.pill-outline{
  color:var(--muted);
}

.rating-pill[data-tone="green"].active,
.tone-green{
  background:#E4ECE7;
  color:#315A49;
  border-color:#9CB6A3;
}

.rating-pill[data-tone="blue"].active,
.tone-blue{
  background:#E2EAE5;
  color:#17362C;
  border-color:#92AA9D;
}

.rating-pill[data-tone="red"].active,
.tone-red{
  background:#F2E3E0;
  color:#87453B;
  border-color:#D1A19A;
}

.tasting-rating-field,
.tasting-third-score-wrap{
  border-color:rgba(201,190,172,.88);
  background:#F6F1E8;
}

.tasting-readiness-progress{
  background:#D9D0C2;
  border-color:#C9BEAC;
}

.tasting-readiness-progress span{
  background:linear-gradient(90deg, #17362C, #A37E43);
  box-shadow:none;
}

#tastingBandSection{
  border-color:rgba(128,96,47,.3) !important;
  background:linear-gradient(145deg, #1D120C 0%, #43291C 55%, #17362C 100%) !important;
}

#tastingBandSection #tastingBandEmptyState{
  border-color:rgba(207,183,119,.28) !important;
  background:rgba(243,238,229,.06) !important;
  color:var(--ech-text-on-dark-soft) !important;
}

#tastingBandSection #tastingBandPreviewWrap{
  border-color:rgba(192,160,93,.34) !important;
  background:rgba(243,238,229,.05) !important;
}

#tastingBandSection #tastingBandStatusTitle{
  color:var(--ech-text-on-dark) !important;
}

#tastingBandSection #tastingBandStatusHelper{
  color:var(--ech-text-on-dark-muted) !important;
}

/* ===== ECH EDITORIAL COLOR REMODEL 2026-07 ROUND 2 ===== */
.hero{
  background:linear-gradient(145deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.22) !important;
  box-shadow:0 22px 44px rgba(82,60,34,.08) !important;
}

.hero::before{
  background:
    radial-gradient(circle at top right, rgba(163,126,67,.10), transparent 34%),
    linear-gradient(90deg, rgba(23,54,44,.05), transparent 52%) !important;
}

.brand-title,
#currentUserLine .greeting-title{
  color:#17362C !important;
}

.brand-subtitle,
.logo-slot-note,
#currentUserLine .greeting-subtitle,
.hero-copy,
.hero-copy div:last-child{
  color:#5F5A50 !important;
}

.logo-round{
  background:linear-gradient(145deg, #F3EEE5 0%, #E7E0D4 100%) !important;
  border-color:rgba(163,126,67,.26) !important;
  box-shadow:0 18px 36px rgba(82,60,34,.10) !important;
}

.metric{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.18) !important;
  box-shadow:0 14px 28px rgba(82,60,34,.08) !important;
}

.metric-label,
.metric-hint{
  color:#5F5A50 !important;
}

.metric-value{
  color:#17362C !important;
}

.metric-icon{
  background:#E8EEE9 !important;
  color:#A37E43 !important;
  border-color:rgba(163,126,67,.20) !important;
}

.footer-note,
.section-subtitle{
  color:#5F5A50 !important;
}

.modal-box,
.detail-box{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.18) !important;
  color:#171613 !important;
}

.modal-head{
  border-bottom-color:rgba(163,126,67,.16) !important;
}

.modal-title{
  color:#17362C !important;
}

#collection .qr-box,
.qr-box{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.16) !important;
}

#appRoot .hero{
  background:linear-gradient(145deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.22) !important;
  box-shadow:0 22px 44px rgba(82,60,34,.08) !important;
}

#appRoot .hero::after{
  background:radial-gradient(circle, rgba(163,126,67,.10) 0%, rgba(163,126,67,0) 72%) !important;
}

#appRoot #currentUserLine .greeting-title,
#appRoot .brand-title{
  color:#17362C !important;
}

#appRoot #currentUserLine .greeting-subtitle,
#appRoot .brand-subtitle,
#appRoot .hero-copy,
#appRoot .logo-slot-note{
  color:#5F5A50 !important;
}

#appRoot .metric{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.18) !important;
  box-shadow:0 14px 28px rgba(82,60,34,.08) !important;
}

#appRoot .metric::before{
  background:linear-gradient(135deg, rgba(163,126,67,.06), transparent 42%) !important;
}

#appRoot .metric-value{
  color:#17362C !important;
}

#appRoot .metric-hint,
#appRoot .metric-label{
  color:#5F5A50 !important;
}

#appRoot .metric-icon{
  background:#E8EEE9 !important;
  color:#A37E43 !important;
  border-color:rgba(163,126,67,.20) !important;
}

.aroma-summary-card,
.aroma-card,
.tasting-ratings-summary,
.tasting-live-summary,
.tasting-readiness-card,
.tasting-save-deck,
.tasting-closing-card{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.16) !important;
  box-shadow:0 14px 30px rgba(82,60,34,.08) !important;
}

.aroma-summary-label,
.aroma-summary-pill,
.aroma-badge,
.tasting-ratings-summary-pill,
.tasting-live-summary-pill,
.tasting-readiness-label,
.tasting-save-deck-label,
.tasting-narrative-cell-label{
  color:#80602F !important;
}

.aroma-summary-pill,
.aroma-badge{
  background:#F3EEE5 !important;
  border-color:rgba(163,126,67,.16) !important;
}

.aroma-summary-value,
.aroma-name,
.tasting-save-deck-value,
.tasting-readiness-value,
.tasting-ratings-summary-value,
.tasting-live-summary-value{
  color:#17362C !important;
}

.aroma-summary-copy,
.tasting-save-deck-copy,
.tasting-ratings-summary-copy,
.tasting-live-summary-copy,
.tasting-narrative-copy{
  color:#5F5A50 !important;
}

.progress{
  background:#DDD4C6 !important;
  box-shadow:none !important;
}

.progress > span{
  background:linear-gradient(90deg, #17362C, #A37E43) !important;
}

.aroma-value{
  background:#F3EEE5 !important;
  border-color:rgba(163,126,67,.16) !important;
  color:#5F5A50 !important;
}

.aroma-value:hover{
  border-color:rgba(163,126,67,.28) !important;
  color:#17362C !important;
}

.aroma-value.active{
  background:#E4ECE7 !important;
  border-color:#9CB6A3 !important;
  color:#17362C !important;
}

.tasting-narrative-cell{
  border-color:rgba(163,126,67,.14) !important;
  background:#F3EEE5 !important;
}

.tasting-narrative-cell-copy{
  color:#171613 !important;
}

#t_first_third,
#t_second_third,
#t_final_third,
#t_general{
  background:#F6F1E8 !important;
  border-color:rgba(163,126,67,.16) !important;
  color:#171613 !important;
}

#t_first_third::placeholder,
#t_second_third::placeholder,
#t_final_third::placeholder,
#t_general::placeholder{
  color:#81796D !important;
}

#tastingBandSection{
  background:linear-gradient(180deg, #F6F1E8 0%, #ECE4D8 100%) !important;
  border-color:rgba(163,126,67,.18) !important;
}

#tastingBandSection #tastingBandEmptyState{
  background:#F3EEE5 !important;
  color:#80602F !important;
  border-color:rgba(163,126,67,.18) !important;
}

#tastingBandSection #tastingBandPreviewWrap{
  background:#F3EEE5 !important;
  border-color:rgba(163,126,67,.16) !important;
}

#tastingBandSection #tastingBandStatusTitle{
  color:#17362C !important;
}

#tastingBandSection #tastingBandStatusHelper{
  color:#5F5A50 !important;
}

#humidor .footer-note,
#humidor input[type="file"]{
  background:#F3EEE5 !important;
  border-color:rgba(163,126,67,.16) !important;
  color:#5F5A50 !important;
}

#humidor input[type="file"]{
  border:1px solid rgba(163,126,67,.16) !important;
  border-radius:14px !important;
  padding:10px 12px !important;
}

#humidor input[type="file"]::file-selector-button{
  margin-right:12px;
  border:1px solid rgba(163,126,67,.18);
  border-radius:10px;
  background:#F6F1E8;
  color:#17362C;
  padding:8px 12px;
  cursor:pointer;
}

.metric-value-shell{
  display:flex;
  align-items:center;
  gap:10px;
}

.metric-toggle-btn{
  width:38px;
  height:38px;
  border-radius:14px;
  border:1px solid rgba(163,126,67,.18);
  background:linear-gradient(180deg,#f7f2ea 0%,#efe6d8 100%);
  color:#17362c;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 18px rgba(118,93,54,.12);
  transition:all .2s ease;
}

.metric-toggle-btn:hover,
.metric-toggle-btn.is-open{
  background:linear-gradient(180deg,#e7f0ea 0%,#dce9e1 100%);
  border-color:#9cb6a3;
}

.metric-toggle-icon{
  width:18px;
  height:18px;
  line-height:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.metric-toggle-icon svg{
  width:18px;
  height:18px;
  display:block;
}

.subheading-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.btn-sm{
  min-height:38px;
  padding:10px 14px;
  border-radius:12px;
  font-size:12px;
}

.tasting-custom-profiles-wrap{
  margin-bottom:16px;
}

.tasting-custom-profiles-empty{
  padding:12px 14px;
  border:1px dashed rgba(163,126,67,.18);
  border-radius:16px;
  color:#5f5a50;
  background:#f3eee5;
  font-size:13px;
  line-height:1.6;
}

.tasting-custom-profiles-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.tasting-custom-profile-pill{
  border:1px solid rgba(163,126,67,.18);
  border-radius:999px;
  background:#f6f1e8;
  color:#17362c;
  padding:9px 14px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
}

.tasting-custom-profile-pill.is-active{
  background:#17362c;
  border-color:#17362c;
  color:#f0d38a;
}

.tasting-inventory-panel{
  position:relative;
  margin-top:12px;
  border:1px solid rgba(163,126,67,.18);
  border-radius:22px;
  background:linear-gradient(180deg,#f6f1e8 0%,#ece4d8 100%);
  box-shadow:0 16px 30px rgba(82,60,34,.12);
  overflow:hidden;
}

.tasting-inventory-panel-head{
  position:sticky;
  top:0;
  z-index:2;
  background:linear-gradient(180deg,#f6f1e8 0%,#ece4d8 100%);
  padding:18px 18px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.tasting-inventory-panel-title{
  color:#17362c;
  font-size:16px;
  font-weight:700;
}

.tasting-inventory-search-shell{
  position:sticky;
  top:60px;
  z-index:2;
  padding:0 18px 14px;
  background:linear-gradient(180deg,#f6f1e8 0%,#ece4d8 100%);
}

.tasting-inventory-search{
  background:#fffdf9 !important;
}

.tasting-inventory-results{
  max-height:360px;
  overflow:auto;
  padding:0 18px 18px;
}

.tasting-inventory-close{
  border:1px solid rgba(163,126,67,.18);
  border-radius:999px;
  background:#f6f1e8;
  color:#80602f;
  padding:9px 14px;
  cursor:pointer;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.tasting-inventory-option{
  width:100%;
  text-align:left;
  margin-bottom:12px;
  border:1px solid rgba(163,126,67,.16);
  border-radius:18px;
  background:#fffdf9;
  padding:12px;
  display:flex;
  gap:12px;
}

.tasting-inventory-option.is-selected{
  border-color:#9cb6a3;
  box-shadow:0 0 0 1px rgba(156,182,163,.3);
}

.tasting-inventory-option-photo{
  width:62px;
  min-width:62px;
  height:62px;
  border-radius:14px;
  overflow:hidden;
  background:#f3eee5;
}

.tasting-inventory-option-photo-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.tasting-inventory-chip{
  border:1px solid rgba(163,126,67,.16);
  border-radius:999px;
  background:#f6f1e8;
  color:#80602f;
  padding:6px 10px;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

@media (max-width: 760px){
  .metric-value-shell{
    align-items:flex-start;
  }

  .subheading-row{
    flex-direction:column;
    align-items:flex-start;
  }

  .tasting-inventory-panel{
    border-radius:18px;
  }

  .tasting-inventory-panel-head{
    padding:16px 14px 10px;
  }

  .tasting-inventory-search-shell{
    top:58px;
    padding:0 14px 12px;
  }

  .tasting-inventory-results{
    padding:0 14px 14px;
    max-height:52vh;
  }

  .tasting-inventory-option{
    padding:10px;
  }
}

#appRoot .login-top-back .btn{
  background:#17362C !important;
  color:#F6F1E8 !important;
  border:1px solid rgba(23,54,44,.92) !important;
  box-shadow:0 12px 24px rgba(23,54,44,.18) !important;
}

#appRoot .login-top-back .btn:hover{
  background:#214638 !important;
  color:#FFF9F0 !important;
  border-color:#214638 !important;
}

#appRoot #logoutBtn{
  background:#17362C !important;
  color:#F6F1E8 !important;
  border:1px solid rgba(23,54,44,.92) !important;
  box-shadow:0 10px 20px rgba(23,54,44,.16) !important;
}

#appRoot #logoutBtn:hover{
  background:#214638 !important;
  color:#FFF9F0 !important;
  border-color:#214638 !important;
}

#appRoot .login-top-back .btn.btn-secondary,
#appRoot .login-top-back a.btn,
#appRoot .hero #logoutBtn.btn-secondary,
#appRoot .hero #logoutBtn{
  background:#17362C !important;
  color:#F6F1E8 !important;
  border:1px solid rgba(23,54,44,.92) !important;
  text-shadow:none !important;
  opacity:1 !important;
}

#appRoot .login-top-back .btn.btn-secondary:hover,
#appRoot .login-top-back a.btn:hover,
#appRoot .hero #logoutBtn.btn-secondary:hover,
#appRoot .hero #logoutBtn:hover{
  background:#214638 !important;
  color:#FFF9F0 !important;
  border-color:#214638 !important;
}