.species-identification-slot{min-width:0}
.species-identification-help{
  display:grid;
  gap:.75rem;
  margin-top:.65rem;
  padding:.75rem;
  border:1px solid rgba(37,99,235,.2);
  border-radius:12px;
  background:rgba(37,99,235,.055);
}
.species-identification-help[hidden],
.species-identification-status[hidden],
.species-identification-modal[hidden],
.species-identification-zoom[hidden]{display:none!important}
.species-identification-help__identity{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:.65rem;
  align-items:center;
  min-width:0;
}
.species-identification-help__eye{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#2563eb,#3b82f6 55%,#2388f4);
  box-shadow:0 7px 16px rgba(37,99,235,.2);
}
.species-identification-help__eye svg,
.species-identification-help__button svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.species-identification-help__identity strong,
.species-identification-help__identity em{display:block}
.species-identification-help__identity strong{
  overflow:hidden;
  color:var(--fg);
  font-size:.9rem;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.species-identification-help__identity em{
  margin-top:.1rem;
  color:var(--muted);
  font-size:.78rem;
  line-height:1.3;
}
.species-identification-help__button{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.55rem .8rem;
  border:1px solid #3b82f6;
  border-radius:10px;
  background:transparent;
  color:#2563eb;
  font:inherit;
  font-size:.86rem;
  font-weight:800;
  cursor:pointer;
}
.species-identification-help__button:hover{background:rgba(59,130,246,.1)}
.species-identification-help__button:focus-visible,
.species-identification-sheet button:focus-visible{
  outline:3px solid rgba(59,130,246,.42);
  outline-offset:2px;
}
.species-identification-status{
  margin:.55rem 0 0;
  color:#166534;
  font-size:.82rem;
  font-weight:700;
  line-height:1.4;
}
[data-theme="dark"] .species-identification-help{
  border-color:rgba(96,165,250,.28);
  background:rgba(37,99,235,.09);
}
[data-theme="dark"] .species-identification-help__button{color:#60a5fa}
[data-theme="dark"] .species-identification-status{color:#86efac}

body.report-species-modal-open{overflow:hidden}
.species-identification-modal{
  position:fixed;
  z-index:1850;
  inset:0;
  display:grid;
  align-items:end;
}
.species-identification-modal__backdrop{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:rgba(2,6,23,.76);
  cursor:pointer;
}
.species-identification-sheet{
  --species-sheet-bg:#f8fbff;
  --species-sheet-panel:#eaf4ff;
  position:relative;
  z-index:1;
  width:100%;
  height:min(94dvh, 820px);
  max-height:94dvh;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  overflow:hidden;
  border:1px solid rgba(96,165,250,.32);
  border-radius:20px 20px 0 0;
  background:var(--species-sheet-bg);
  color:var(--fg);
  box-shadow:0 -24px 70px rgba(2,6,23,.34);
}
[data-theme="dark"] .species-identification-sheet{
  --species-sheet-bg:#0f1b2d;
  --species-sheet-panel:#14243b;
  border-color:#2a4262;
  box-shadow:0 -24px 70px rgba(0,0,0,.56);
}
.species-identification-sheet__header{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 44px;
  gap:.35rem;
  align-items:center;
  min-height:58px;
  padding:.45rem .65rem;
  border-bottom:1px solid var(--border);
  background:var(--species-sheet-bg);
}
.species-identification-sheet__header p{
  margin:0;
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.species-identification-sheet__back,
.species-identification-sheet__close,
.species-identification-zoom > button{
  min-width:44px;
  min-height:44px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--fg);
  font:inherit;
  cursor:pointer;
}
.species-identification-sheet__back{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.4rem .45rem;
  font-size:.8rem;
  font-weight:750;
}
.species-identification-sheet__back svg,
.species-identification-zoom > button svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.species-identification-sheet__close{
  padding:0;
  font-size:1.75rem;
  line-height:1;
}
.species-identification-sheet__back:hover,
.species-identification-sheet__close:hover,
.species-identification-zoom > button:hover{background:rgba(59,130,246,.1)}
.species-identification-sheet__scroll{
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.species-identification-detail{padding:1rem}
.species-identification-image{
  position:relative;
  width:100%;
  min-height:230px;
  height:clamp(230px,37dvh,340px);
  display:grid;
  place-items:center;
  padding:1rem;
  overflow:hidden;
  border:1px solid rgba(59,130,246,.18);
  border-radius:16px;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,255,255,.96),rgba(219,238,255,.82) 58%,rgba(191,219,254,.5));
  cursor:zoom-in;
}
[data-theme="dark"] .species-identification-image{
  border-color:rgba(96,165,250,.22);
  background:radial-gradient(circle at 50% 46%,#dceeff,#b9d9f3 62%,#7eaed2);
}
.species-identification-image img{
  position:absolute;
  inset:1rem;
  width:calc(100% - 2rem);
  height:calc(100% - 2rem);
  max-width:calc(100% - 2rem);
  max-height:calc(100% - 2rem);
  min-width:0;
  min-height:0;
  display:block;
  object-fit:contain;
  transform:scale(var(--species-image-scale,1));
  transform-origin:center;
  filter:drop-shadow(0 13px 18px rgba(15,23,42,.2));
}
.species-identification-image > span{
  position:absolute;
  z-index:1;
  right:.65rem;
  bottom:.65rem;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.35rem .6rem;
  border:1px solid rgba(37,99,235,.22);
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#1e3a8a;
  font-size:.75rem;
  font-weight:800;
  backdrop-filter:blur(8px);
}
.species-identification-image > span svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
}
.species-identification-identity{padding:1rem 0 .8rem}
.species-identification-identity h2{
  margin:0;
  font-size:clamp(1.55rem,7vw,2rem);
  line-height:1.1;
  letter-spacing:-.025em;
}
.species-identification-identity > p{
  margin:.3rem 0 0;
  color:var(--muted);
  font-size:.96rem;
  font-style:italic;
}
.species-identification-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top:.75rem;
}
.species-identification-tags > span{
  display:inline-flex;
  align-items:center;
  gap:.32rem;
  min-height:30px;
  padding:.3rem .65rem;
  border:1px solid rgba(37,99,235,.22);
  border-radius:999px;
  background:rgba(37,99,235,.07);
  color:#1d4ed8;
  font-size:.76rem;
  font-weight:800;
}
.species-identification-tags__measurements > span[aria-hidden="true"]{
  margin-inline:.08rem;
  color:var(--muted);
}
.species-identification-tags__assessment{
  display:inline-flex;
  flex:none;
  gap:.45rem;
}
.species-identification-tags__compact{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  min-height:30px;
  margin:0;
  padding:.3rem .5rem;
  border:1px solid rgba(100,116,139,.28);
  border-radius:999px;
  background:rgba(100,116,139,.08);
  color:var(--text);
  font:inherit;
  font-size:.76rem;
  font-weight:850;
  line-height:1;
  cursor:help;
  -webkit-appearance:none;
  appearance:none;
}
.species-identification-tags__trend{font-size:1rem}
.species-identification-tags__compact::after{
  content:attr(data-tooltip);
  position:absolute;
  z-index:5;
  top:calc(100% + .45rem);
  right:0;
  width:max-content;
  max-width:min(240px,calc(100vw - 2rem));
  padding:.42rem .55rem;
  border-radius:8px;
  background:#0f172a;
  color:#f8fafc;
  box-shadow:0 8px 24px rgba(15,23,42,.24);
  font-size:.72rem;
  font-weight:700;
  line-height:1.3;
  text-align:left;
  white-space:normal;
  opacity:0;
  visibility:hidden;
  transform:translateY(-3px);
  transition:opacity .14s ease,transform .14s ease,visibility .14s ease;
  pointer-events:none;
}
.species-identification-tags__compact:hover::after,
.species-identification-tags__compact:focus::after,
.species-identification-tags__compact:focus-visible::after{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.species-identification-tags__conservation[data-category="LC"],
.species-identification-tags__trend[data-trend="increasing"]{
  border-color:rgba(22,163,74,.3);
  background:rgba(22,163,74,.1);
  color:#15803d;
}
.species-identification-tags__conservation[data-category="VU"],
.species-identification-tags__trend[data-trend="decreasing"]{
  border-color:rgba(217,119,6,.32);
  background:rgba(217,119,6,.1);
  color:#b45309;
}
.species-identification-tags__conservation[data-category="EN"],
.species-identification-tags__conservation[data-category="CR"]{
  border-color:rgba(220,38,38,.3);
  background:rgba(220,38,38,.1);
  color:#b91c1c;
}
.species-identification-tags__conservation[data-category="DD"],
.species-identification-tags__trend[data-trend="unknown"]{
  border-color:rgba(100,116,139,.3);
  background:rgba(100,116,139,.1);
  color:#475569;
}
.species-identification-tags__trend[data-trend="stable"]{
  border-color:rgba(37,99,235,.28);
  background:rgba(37,99,235,.08);
  color:#1d4ed8;
}
[data-theme="dark"] .species-identification-tags > span{color:#93c5fd;background:rgba(37,99,235,.13)}
[data-theme="dark"] .species-identification-tags__conservation[data-category="LC"],
[data-theme="dark"] .species-identification-tags__trend[data-trend="increasing"]{color:#86efac}
[data-theme="dark"] .species-identification-tags__conservation[data-category="VU"],
[data-theme="dark"] .species-identification-tags__trend[data-trend="decreasing"]{color:#fcd34d}
[data-theme="dark"] .species-identification-tags__conservation[data-category="EN"],
[data-theme="dark"] .species-identification-tags__conservation[data-category="CR"]{color:#fca5a5}
[data-theme="dark"] .species-identification-tags__conservation[data-category="DD"],
[data-theme="dark"] .species-identification-tags__trend[data-trend="unknown"]{color:#cbd5e1}
[data-theme="dark"] .species-identification-tags__trend[data-trend="stable"]{color:#93c5fd}
.species-identification-traits{
  padding:.9rem;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--species-sheet-panel);
}
.species-identification-traits h3{
  margin:0 0 .7rem;
  font-size:1rem;
}
.species-identification-traits ul{
  display:grid;
  gap:.65rem;
  margin:0;
  padding:0;
  list-style:none;
}
.species-identification-traits li{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:.6rem;
  align-items:start;
}
.species-identification-traits li > span{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#2563eb;
  color:#fff;
  font-size:.8rem;
  font-weight:900;
}
.species-identification-traits b,
.species-identification-traits small{display:block}
.species-identification-traits b{font-size:.86rem;line-height:1.3}
.species-identification-traits small{margin-top:.08rem;color:var(--muted);font-size:.76rem;line-height:1.35}
.species-identification-observation{
  margin-top:.8rem;
  padding:.9rem;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--species-sheet-panel);
}
.species-identification-observation h3{
  margin:0;
  font-size:.95rem;
  line-height:1.3;
}
.species-identification-observation dl{
  display:grid;
  margin:.65rem 0 0;
}
.species-identification-observation dl > div{
  display:grid;
  gap:.18rem;
  padding:.62rem 0;
  border-top:1px solid var(--border);
}
.species-identification-observation dl > div:last-child{padding-bottom:0}
.species-identification-observation dt{
  color:#1d4ed8;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.025em;
  line-height:1.3;
  text-transform:uppercase;
}
.species-identification-observation dd{
  min-width:0;
  margin:0;
  color:var(--fg);
  font-size:.8rem;
  line-height:1.42;
}
[data-theme="dark"] .species-identification-observation dt{color:#93c5fd}
.species-identification-threats{
  margin-top:.7rem;
  padding:.75rem .8rem .8rem;
  border:1px solid rgba(217,119,6,.24);
  border-radius:14px;
  background:rgba(217,119,6,.055);
}
.species-identification-threats header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-bottom:.6rem;
}
.species-identification-threats h3{
  display:flex;
  align-items:center;
  gap:.4rem;
  margin:0;
  color:#b45309;
  font-size:.9rem;
  line-height:1.2;
}
.species-identification-threats h3 svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.species-identification-threats ul{
  display:flex;
  flex-wrap:wrap;
  gap:.38rem;
  margin:0;
  padding:0;
  list-style:none;
}
.species-identification-threats li{
  display:inline-flex;
  align-items:center;
  gap:.34rem;
  max-width:100%;
  padding:.34rem .52rem;
  border:1px solid rgba(217,119,6,.2);
  border-radius:999px;
  background:rgba(255,255,255,.55);
  color:var(--text);
  font-size:.72rem;
  font-weight:700;
  line-height:1.25;
}
.species-identification-threats li > span{
  display:inline-grid;
  flex:0 0 15px;
  width:15px;
  height:15px;
  place-items:center;
  border-radius:50%;
  background:#d97706;
  color:#fff;
  font-size:.62rem;
  font-weight:900;
  line-height:1;
}
[data-theme="dark"] .species-identification-threats{
  border-color:rgba(251,191,36,.2);
  background:rgba(217,119,6,.075);
}
[data-theme="dark"] .species-identification-threats h3{color:#fcd34d}
[data-theme="dark"] .species-identification-threats li{
  border-color:rgba(251,191,36,.18);
  background:rgba(15,23,42,.28);
}
.species-identification-credit{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:.3rem;
  margin:.55rem .15rem 0;
  color:var(--muted);
  font-size:.68rem;
  line-height:1.35;
}
.species-identification-credit > span:first-child{font-weight:750}
.species-identification-question{
  margin:1rem 0 .1rem;
  font-size:1rem;
  font-weight:850;
  text-align:center;
}
.species-identification-actions{
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:.65rem;
  padding:.75rem max(.75rem,env(safe-area-inset-right)) calc(.75rem + env(safe-area-inset-bottom)) max(.75rem,env(safe-area-inset-left));
  border-top:1px solid var(--border);
  background:var(--species-sheet-bg);
  box-shadow:0 -9px 24px rgba(15,23,42,.08);
}
.species-identification-actions button{
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  padding:.65rem .7rem;
  border-radius:11px;
  font:inherit;
  font-size:.88rem;
  font-weight:850;
  cursor:pointer;
}
.species-identification-actions button > span{font-size:1.15rem;line-height:1}
.species-identification-actions__reject{
  border:1px solid var(--border);
  background:transparent;
  color:var(--fg);
}
.species-identification-actions__reject:hover{background:rgba(148,163,184,.12)}
.species-identification-actions__confirm{
  border:1px solid transparent;
  background:linear-gradient(135deg,#2563eb,#3b82f6 55%,#2388f4);
  color:#fff;
  box-shadow:0 9px 20px rgba(37,99,235,.24);
}
.species-identification-actions__confirm:hover{filter:brightness(1.06)}
.species-identification-zoom{
  min-height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:.6rem;
  padding:1rem;
  background:var(--species-sheet-bg);
}
.species-identification-zoom > button{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.45rem .55rem;
  font-size:.86rem;
  font-weight:800;
}
.species-identification-zoom img{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  min-width:0;
  min-height:0;
  display:block;
  box-sizing:border-box;
  padding:1rem;
  border:1px solid rgba(59,130,246,.18);
  border-radius:16px;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,255,255,.96),rgba(219,238,255,.82) 58%,rgba(191,219,254,.5));
  object-fit:contain;
  filter:drop-shadow(0 16px 22px rgba(15,23,42,.24));
}
[data-theme="dark"] .species-identification-zoom img{
  border-color:rgba(96,165,250,.22);
  background:radial-gradient(circle at 50% 46%,#dceeff,#b9d9f3 62%,#7eaed2);
}
.species-identification-sheet.is-zoomed .species-identification-actions{display:none}

@media (max-width:420px){
  .species-identification-sheet__header{grid-template-columns:minmax(0,1fr) 44px}
  .species-identification-sheet__header > p{display:none}
  .species-identification-detail{padding:.8rem}
  .species-identification-actions{grid-template-columns:1fr}
  .species-identification-actions__confirm{grid-row:1}
}

@media (min-width:560px){
  .species-identification-help{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
  }
  .species-identification-help__button{padding-inline:1rem}
  .species-identification-observation dl > div{
    grid-template-columns:minmax(125px,.42fr) minmax(0,1fr);
    gap:.8rem;
    align-items:start;
  }
}

@media (min-width:768px){
  .species-identification-modal{place-items:center;padding:1.5rem}
  .species-identification-sheet{
    width:min(760px,100%);
    height:min(90dvh,780px);
    max-height:90dvh;
    border-radius:20px;
    box-shadow:0 28px 80px rgba(2,6,23,.46);
  }
  .species-identification-detail{padding:1.25rem 1.5rem}
  .species-identification-image{height:clamp(280px,40dvh,390px)}
  .species-identification-actions{padding-inline:1.5rem}
}

@keyframes species-sheet-enter{
  from{opacity:.5;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes species-sheet-enter-desktop{
  from{opacity:.4;transform:translateY(8px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media (prefers-reduced-motion:no-preference){
  .species-identification-sheet{animation:species-sheet-enter .18s ease-out}
}
@media (min-width:768px) and (prefers-reduced-motion:no-preference){
  .species-identification-sheet{animation-name:species-sheet-enter-desktop}
}