/* MiMascota visual theme
   Base palette: #BEDCC8 Soft Green, #237A4D Forest Green, #173326 Deep Green, #245C3C Leaf Green.
   The palette is used as green accents, not as a color overlay. */
:root{
  --pet-tan:#BEDCC8;
  --pet-chestnut:#237A4D;
  --pet-coffee:#173326;
  --pet-bark:#245C3C;
  --pet-cream:#F5FBF8;
  --pet-cream-2:#FAFDFB;
  --pet-sand:#CFEBDC;
  --pet-peach:#DBF0E5;
  --pet-sage:#7F8F57;
  --pet-sage-soft:#EEF3E4;
  --pet-coral:#A84625;
  --bg:#FAFDFB;
  --fg:#173326;
  --card:#FFFFFF;
  --primary:#237A4D;
  --primary-fg:#FAFDFB;
  --secondary-bg:#CFEBDC;
  --muted:#DBF0E5;
  --muted-fg:#487D61;
  --border:rgba(24,55,38,.13);
  --accent:#237A4D;
  --accent-soft:#DBF0E5;
  --green:#7F8F57;
  --blue:#728B7E;
  --red:#A84625;
  --shadow:0 10px 28px rgba(24,55,38,.08);
  --shadow-lg:0 24px 64px rgba(24,55,38,.16);
}

/* Premium, búsqueda global, accesibilidad y rendimiento */
.global-search-dialog,.premium-page{
  --text:var(--fg);--muted:var(--muted-fg);--orange-pale:var(--accent-soft);--orange:var(--primary)
}
.skip-link{
  position:fixed;top:.75rem;left:.75rem;z-index:10000;
  transform:translateY(-160%);padding:.7rem 1rem;border-radius:12px;
  background:#fff;color:#214F31;font-weight:800;box-shadow:0 8px 30px rgba(0,0,0,.25)
}
.skip-link:focus{transform:translateY(0)}
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important
}

:where(button,a,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid #62B878!important;outline-offset:3px!important
}
.detail-back-btn{
  width:auto!important;min-width:6.25rem;height:2.55rem!important;padding:0 .9rem!important;gap:.45rem;
  border:1px solid var(--border)!important;border-radius:12px!important;background:var(--card)!important;
  color:var(--fg)!important;font-weight:800;line-height:1;white-space:nowrap
}
.detail-back-btn:hover{transform:translateX(-2px)!important}
html[data-theme="dark"] .detail-back-btn{
  background:#1F3328!important;border-color:rgba(233,246,239,.22)!important;color:#F4FAF7!important;
  box-shadow:0 8px 20px rgba(0,0,0,.2)!important
}

.sidebar-premium{
  display:flex;align-items:center;gap:.75rem;margin:.5rem .8rem;padding:.75rem;
  border:1px solid rgba(76,145,86,.28);border-radius:16px;background:linear-gradient(135deg,#EDF8EB,#DFF1DD);
  color:#245A34;text-align:left;cursor:pointer
}
.sidebar-premium>span:first-child{display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:12px;background:#2F7D4A;color:#fff}
.sidebar-premium>span:last-child{display:grid;gap:.08rem}.sidebar-premium small{font-size:.68rem;color:#54755C}
.sidebar-premium--active{border-color:#2F7D4A;box-shadow:0 0 0 2px rgba(47,125,74,.12)}

.global-search-trigger{width:auto!important;min-width:2.55rem!important;padding:0 .75rem!important;gap:.4rem}
.global-search-trigger span{font-size:.74rem;font-weight:800}
.premium-header-btn{
  display:flex;align-items:center;gap:.35rem;height:2.65rem;padding:0 .8rem;border:1px solid #78A66D;
  border-radius:14px;background:#E8F6E4;color:#275E36;font:inherit;cursor:pointer
}
.premium-header-btn span{color:#2F7D4A}.premium-header-btn strong{font-size:.75rem}

.global-search-backdrop{
  position:fixed;inset:0;z-index:5000;display:grid;place-items:start center;padding:8dvh 1rem 1rem;
  background:rgba(16,28,22,.54);backdrop-filter:blur(9px)
}
.global-search-dialog{
  width:min(720px,100%);max-height:min(760px,84dvh);display:flex;flex-direction:column;
  overflow:hidden;border:1px solid rgba(255,255,255,.72);border-radius:26px;background:var(--card);
  color:var(--text);box-shadow:0 30px 100px rgba(14,33,23,.42);animation:popupEnter .2s ease-out
}
.global-search-head{display:flex;align-items:center;gap:.8rem;padding:1rem 1.15rem;border-bottom:1px solid var(--border)}
.global-search-head>span{display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:12px;background:var(--orange-pale);color:var(--orange);font-size:1.45rem}
.global-search-head>div{display:grid;gap:.1rem;flex:1}.global-search-head strong{font-size:1rem}.global-search-head small{color:var(--muted)}
.global-search-input-wrap{display:flex;align-items:center;gap:.7rem;margin:1rem 1.15rem 0;padding:.55rem .75rem;border:2px solid var(--border);border-radius:16px;background:var(--bg)}
.global-search-input-wrap:focus-within{border-color:#4E9660;box-shadow:0 0 0 4px rgba(78,150,96,.12)}
.global-search-input-wrap input{flex:1;min-width:0;height:2.35rem;padding:0;border:0!important;outline:0!important;background:transparent!important;color:var(--text);font:inherit;font-size:1rem;box-shadow:none!important}
.global-search-input-wrap input:focus{border:0!important;box-shadow:none!important}
.global-search-input-wrap button{border:0;background:transparent;color:var(--muted);font-size:1.2rem;cursor:pointer}
kbd{padding:.18rem .4rem;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--muted);font:600 .66rem/1.2 inherit;box-shadow:0 1px 0 var(--border)}
.global-search-body{min-height:220px;overflow-y:auto;padding:1rem 1.15rem}
.global-search-state{min-height:190px;display:grid;place-items:center;align-content:center;gap:.5rem;text-align:center;color:var(--muted)}
.global-search-state strong{color:var(--text)}
.global-search-suggestions>span{display:block;margin-bottom:.75rem}
.global-search-suggestions>div{display:grid;grid-template-columns:repeat(4,1fr);gap:.65rem}
.global-search-suggestions button{display:grid;place-items:center;gap:.35rem;min-height:92px;border:1px solid var(--border);border-radius:16px;background:var(--bg);color:var(--text);font:700 .78rem inherit;cursor:pointer}
.global-search-suggestions button span{font-size:1.45rem}.global-search-suggestions .global-search-premium{background:#E8F6E4;border-color:#9FC995;color:#275E36}
.global-search-summary{display:flex;justify-content:space-between;margin-bottom:.6rem;color:var(--muted);font-size:.75rem}
.global-search-results{display:grid;gap:.35rem}
.global-search-result{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.8rem;width:100%;padding:.72rem;border:1px solid transparent;border-radius:15px;background:transparent;color:var(--text);text-align:left;cursor:pointer}
.global-search-result:hover,.global-search-result:focus-visible{border-color:var(--border);background:var(--bg)}
.global-search-result-icon{display:grid;place-items:center;width:2.55rem;height:2.55rem;border-radius:13px;background:var(--orange-pale)}
.global-search-result>span:nth-child(2){display:grid;gap:.05rem;min-width:0}.global-search-result small{color:var(--muted);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em}.global-search-result strong,.global-search-result em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.global-search-result em{color:var(--muted);font-size:.75rem;font-style:normal}
.global-search-result-premium{padding:.25rem .45rem;border-radius:99px;background:#E1F2DC;color:#28643A;font-size:.64rem;white-space:nowrap}
.global-search-result>i{font-style:normal;color:var(--muted)}
.global-search-footer{display:flex;gap:1rem;padding:.7rem 1.15rem;border-top:1px solid var(--border);color:var(--muted);font-size:.68rem}

.premium-page{
  height:100%;min-height:0;padding:1.25rem;display:grid;gap:1.1rem;
  grid-auto-rows:max-content;align-content:start;
  overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-gutter:stable;color:var(--text)
}
.premium-hero{position:relative;min-height:280px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2rem;padding:clamp(1.5rem,4vw,3rem);border:1px solid #87B17D;border-radius:28px;background:linear-gradient(135deg,#153F27 0%,#286842 55%,#4D8D55 100%);color:#fff;box-shadow:0 22px 55px rgba(28,89,52,.22)}
.premium-hero:after{content:"★";position:absolute;right:28%;top:-4rem;color:rgba(255,255,255,.07);font-size:17rem;line-height:1}
.premium-hero>div{position:relative;z-index:1}.premium-kicker{display:inline-flex;padding:.38rem .7rem;border:1px solid rgba(255,255,255,.3);border-radius:99px;background:rgba(255,255,255,.12);font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.premium-hero h2{max-width:760px;margin:.75rem 0 .55rem;color:#fff;font-size:clamp(2rem,5vw,4.6rem);line-height:.94;letter-spacing:-.045em}.premium-hero p{max-width:680px;margin:0;color:rgba(255,255,255,.78);font-size:1rem;line-height:1.55}
.premium-plan-status{min-width:210px;display:grid;gap:.2rem;padding:1.1rem;border:1px solid rgba(255,255,255,.25);border-radius:20px;background:rgba(13,48,28,.5);backdrop-filter:blur(10px)}
.premium-plan-status span{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em}.premium-plan-status strong{font-size:1.4rem}.premium-plan-status small{color:rgba(255,255,255,.7)}
.premium-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.premium-metrics article{display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:center;padding:1rem;border:1px solid var(--border);border-radius:18px;background:var(--card);box-shadow:var(--shadow)}
.premium-metrics article>span{grid-row:1/3;display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:13px;background:#E7F5E3;color:#2F7D4A;font-size:1.15rem}.premium-metrics strong{font-size:1.25rem}.premium-metrics small{color:var(--muted)}
.premium-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1rem;align-items:start}.premium-section{padding:1.1rem;border:1px solid var(--border);border-radius:22px;background:var(--card);box-shadow:var(--shadow)}
.premium-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}.premium-section-head h3,.premium-promote-box h3{margin:.18rem 0 0}.eyebrow{color:#387748;font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.premium-campaign-list{display:grid;gap:.75rem}.premium-campaign{padding:1rem;border:1px solid var(--border);border-radius:18px;background:var(--bg)}.premium-campaign--active{border-color:#9FC995;background:linear-gradient(135deg,var(--card),rgba(229,245,225,.7))}.premium-campaign--expired{opacity:.68}
.premium-campaign-top{display:flex;justify-content:space-between;gap:.6rem}.premium-type{color:#347344;font-size:.72rem;font-weight:800;text-transform:uppercase}.premium-campaign h4{margin:.55rem 0 .25rem;font-size:1.05rem}.premium-campaign p{margin:0;color:var(--muted);font-size:.78rem}.campaign-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.8rem 0}.campaign-stats span{display:grid;padding:.55rem;border-radius:12px;background:var(--card);color:var(--muted);font-size:.68rem}.campaign-stats b{color:var(--text);font-size:.9rem}
.campaign-progress{height:7px;overflow:hidden;border-radius:99px;background:rgba(76,125,82,.14)}.campaign-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#286842,#75AD63)}
.urgent-alert-row{position:relative;z-index:2;display:grid;grid-template-columns:auto minmax(112px,120px) minmax(0,1fr);align-items:center;gap:.55rem;margin-top:.85rem}.urgent-alert-row label{font-size:.72rem;font-weight:700}.urgent-alert-row select{height:2.75rem;min-width:112px;padding:.5rem 2rem .5rem .85rem;line-height:1.25;white-space:nowrap}.btn-premium{border-color:#2F7D4A!important;background:#2F7D4A!important;color:#fff!important}.btn-premium:hover{background:#245F39!important}.premium-success{display:block;margin-top:.55rem;color:#337748;font-weight:700}
.premium-sidebar{position:sticky;top:1rem;z-index:3}.premium-promote-box{overflow:visible}.premium-promote-box>p{color:var(--muted);font-size:.8rem;line-height:1.5}.premium-form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,1fr);gap:.6rem}.premium-form-grid .form-group{min-width:0}.premium-form-grid select{min-width:0;padding-right:2rem}
.premium-plans{margin-top:.2rem}.premium-plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}.premium-plan-card{position:relative;display:flex;flex-direction:column;padding:1.15rem;border:1px solid var(--border);border-radius:19px;background:var(--bg)}.premium-plan-card--featured{border-color:#5F9E66;background:linear-gradient(180deg,#EDF8E9,var(--card));box-shadow:0 15px 35px rgba(47,125,74,.14)}
.premium-plan-recommended{position:absolute;top:.75rem;right:.75rem;padding:.25rem .5rem;border-radius:99px;background:#2F7D4A;color:#fff;font-size:.62rem;font-weight:800}.premium-plan-icon{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:14px;background:#DFF1DA;color:#2F7D4A;font-size:1.3rem}.premium-plan-card h4{margin:.8rem 0 .25rem;font-size:1.15rem}.premium-plan-card p{min-height:2.5rem;margin:0;color:var(--muted);font-size:.78rem}.premium-price{margin:.8rem 0;color:#255D35;font-size:1.5rem}.premium-price small{font-size:.7rem;color:var(--muted)}.premium-plan-card ul{display:grid;gap:.4rem;margin:0 0 1rem;padding:0;list-style:none;color:var(--muted);font-size:.75rem}.premium-plan-card .btn{margin-top:auto}
.premium-checkout{max-width:480px!important}.premium-checkout .modal-body{text-align:center}.premium-checkout-icon{display:grid;place-items:center;width:4rem;height:4rem;margin:0 auto;border-radius:20px;background:#E1F2DC;color:#2F7D4A;font-size:1.8rem}.checkout-summary{display:grid;grid-template-columns:1fr auto;gap:.65rem;margin:1rem 0;padding:1rem;border-radius:15px;background:var(--bg);text-align:left}.checkout-summary strong{text-align:right}
.premium-reach-badge{position:absolute;left:.65rem;bottom:.65rem;padding:.3rem .55rem;border:1px solid rgba(255,255,255,.65);border-radius:99px;background:rgba(31,105,55,.92);color:#fff;font-size:.62rem;font-weight:800;backdrop-filter:blur(8px)}.premium-reach-badge--lost{bottom:.65rem}

.network-status{position:fixed;left:50%;top:.75rem;z-index:12000;transform:translate(-50%,-180%);max-width:min(92vw,650px);padding:.7rem 1rem;border-radius:13px;background:#8B2E24;color:#fff;font-size:.78rem;font-weight:700;box-shadow:0 10px 35px rgba(0,0,0,.28);transition:transform .2s ease}
body.is-offline .network-status,.network-status--restored{transform:translate(-50%,0)}.network-status--restored{background:#2F7D4A}

/* Blazor activa este panel mediante un style inline solo cuando ocurre un error real. */
#blazor-error-ui{display:none;position:fixed;right:1rem;bottom:1rem;z-index:13000;max-width:min(92vw,560px);padding:.9rem 3rem .9rem 1rem;border:1px solid #EFB4B4;border-radius:14px;background:#FFF1F1;color:#8B1D2C;font-size:.82rem;font-weight:700;box-shadow:0 16px 45px rgba(55,20,10,.25)}
#blazor-error-ui .reload{margin-left:.45rem;color:#8B1D2C;text-decoration:underline}
#blazor-error-ui .dismiss{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:inherit;cursor:pointer;text-decoration:none}

.pet-card,.community-post,.premium-campaign,.nearby-item{content-visibility:auto;contain-intrinsic-size:auto 360px}
.pet-card-img,img[loading="lazy"]{background:linear-gradient(110deg,var(--bg) 25%,var(--card) 45%,var(--bg) 65%);background-size:200% 100%}

html[data-theme="dark"] .premium-page{--premium-surface:#16211B;--premium-surface-raised:#1C2A23;--premium-green:#63C47D;--premium-border:rgba(190,222,184,.2)}
html[data-theme="dark"] .premium-hero{border-color:rgba(141,207,143,.62);background:linear-gradient(135deg,#123923 0%,#1E5D38 52%,#3F7F4D 100%);box-shadow:0 22px 55px rgba(0,0,0,.28)}
html[data-theme="dark"] .premium-section,html[data-theme="dark"] .premium-metrics article{background:var(--premium-surface)!important;border-color:var(--premium-border)!important;box-shadow:0 12px 28px rgba(0,0,0,.2)!important}
html[data-theme="dark"] .premium-campaign,html[data-theme="dark"] .premium-plan-card{background:#101713!important;border-color:rgba(233,246,239,.13)!important}
html[data-theme="dark"] .premium-campaign--active{background:linear-gradient(135deg,#1D2119,#193322)!important;border-color:rgba(113,194,119,.7)!important}
html[data-theme="dark"] .campaign-stats span{background:rgba(9,12,10,.5)!important;color:#A5BCB0!important}
html[data-theme="dark"] .campaign-stats b,html[data-theme="dark"] .premium-campaign h4,html[data-theme="dark"] .premium-plan-card h4,html[data-theme="dark"] .premium-section h3{color:#F6FBF8!important}
html[data-theme="dark"] .premium-campaign p,html[data-theme="dark"] .premium-promote-box>p,html[data-theme="dark"] .premium-plan-card p,html[data-theme="dark"] .premium-plan-card ul{color:#AEC4B8!important}
html[data-theme="dark"] .eyebrow,html[data-theme="dark"] .premium-type,html[data-theme="dark"] .premium-success,html[data-theme="dark"] .premium-price{color:#75D18D!important}
html[data-theme="dark"] .premium-metrics article>span,html[data-theme="dark"] .premium-plan-icon,html[data-theme="dark"] .premium-checkout-icon,html[data-theme="dark"] .global-search-result-premium{background:#214F31;color:#BFF0C8}
html[data-theme="dark"] .premium-metrics small{color:#AEC4B8!important}
html[data-theme="dark"] .premium-plan-card--featured{background:linear-gradient(180deg,#17482B,#12341F)!important;color:#EAF8ED!important;border-color:#54A969!important;box-shadow:0 16px 38px rgba(0,0,0,.28)!important}
html[data-theme="dark"] .premium-plan-card--featured p,html[data-theme="dark"] .premium-plan-card--featured ul{color:#C6DFCA!important}
html[data-theme="dark"] .premium-page select{background:#0F1813!important;border-color:rgba(233,246,239,.2)!important;color:#F6FBF8!important}
html[data-theme="dark"] .sidebar-premium,html[data-theme="dark"] .premium-header-btn,html[data-theme="dark"] .global-search-suggestions .global-search-premium{background:#173C26;color:#BCE9C5;border-color:#3F7C4F}

@media(max-width:980px){
  .premium-layout{grid-template-columns:1fr}.premium-sidebar{position:static}.premium-metrics{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:768px){
  .premium-header-btn{display:none}.global-search-trigger{width:2.45rem!important;min-width:2.45rem!important;padding:0!important}
  .global-search-backdrop{align-items:end;padding:0}.global-search-dialog{width:100%;max-height:92dvh;border-radius:24px 24px 0 0}
  .global-search-suggestions>div{grid-template-columns:repeat(2,1fr)}.global-search-footer{display:none}
  .global-search-result{grid-template-columns:auto 1fr auto;padding:.65rem}.global-search-result-premium,.global-search-result>i{display:none}
  .premium-page{padding:.7rem}.premium-hero{min-height:0;grid-template-columns:1fr;padding:1.35rem;border-radius:22px}.premium-hero h2{font-size:2.25rem}.premium-plan-status{min-width:0}
  .premium-plan-grid{grid-template-columns:1fr}.premium-metrics{gap:.55rem}.premium-metrics article{padding:.75rem}.premium-metrics article>span{width:2.25rem;height:2.25rem}
  .campaign-stats{grid-template-columns:repeat(3,1fr)}.urgent-alert-row{grid-template-columns:1fr 90px}.urgent-alert-row .btn{grid-column:1/-1}
}

@media(max-width:420px){
  .premium-metrics{grid-template-columns:1fr 1fr}.premium-metrics strong{font-size:1rem}.premium-metrics small{font-size:.63rem}
  .campaign-stats{grid-template-columns:1fr}.premium-form-grid{grid-template-columns:1fr}
  .global-search-head small,.global-search-input-wrap kbd{display:none}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

html,body{
  background:var(--bg)!important;
  color:var(--fg)!important;
}

.app-shell,
.content-area,
.adoptions-page,
.profile-wrap,
.sub-page,
.detail-page,
.chats-layout,
.map-layout,
.caniles-page,
.landing-page,
.auth-screen--modern{
  background:
    radial-gradient(circle at 8% 10%,rgba(165,216,189,.30),transparent 24rem),
    radial-gradient(circle at 90% 14%,rgba(127,143,87,.15),transparent 22rem),
    linear-gradient(180deg,#FAFDFB 0%,#F5FBF8 52%,#DBF0E5 100%)!important;
}

.sidebar,
.top-header,
.mobile-nav,
.notif-panel,
.filter-panel,
.pet-card,
.stat-card,
.profile-section-card,
.pub-card,
.reaction-item,
.modal-sheet,
.nearby-panel,
.chat-list-panel,
.chat-convo-header,
.contact-card,
.chip,
.canil-card,
.caniles-side-panel,
.canil-detail-drawer,
.map-detail-panel,
.lost-stat,
.auth-card,
.landing-stats article,
.landing-modules article,
.landing-steps article,
.landing-module-detail-card{
  background:rgba(255,255,255,.92)!important;
  border-color:var(--border)!important;
  color:var(--fg)!important;
  box-shadow:0 14px 36px rgba(24,55,38,.07)!important;
}

.sidebar-brand,
.adoptions-header,
.chat-list-header,
.detail-header,
.modal-header,
.notif-header,
.profile-tabs,
.insta-profile-tabs{
  background:rgba(250,253,251,.88)!important;
  border-color:var(--border)!important;
  backdrop-filter:blur(14px);
}

.brand-icon,
.avatar-btn,
.nav-item--active,
.filter-chip--active,
.btn-primary,
.fab-main,
.auth-tabs .auth-tab--active,
.landing-btn--dark,
.profile-avatar,
.insta-avatar-placeholder{
  background:linear-gradient(135deg,var(--pet-chestnut),var(--pet-bark))!important;
  color:#FAFDFB!important;
  border-color:transparent!important;
  box-shadow:0 14px 30px rgba(76,177,123,.22)!important;
}

.btn-outline,
.filter-chip,
.icon-btn,
.map-ctrl-btn,
.landing-btn--outline,
input,
select,
textarea,
.chat-input{
  background:#FAFDFB!important;
  border-color:var(--border)!important;
  color:var(--fg)!important;
}

input:focus,
select:focus,
textarea:focus,
.chat-input:focus{
  border-color:var(--pet-chestnut)!important;
  box-shadow:0 0 0 4px rgba(76,177,123,.14)!important;
}

.adoptions-title-row h2,
.header-title,
.detail-content h2,
.profile-name h2,
.landing-section h2,
.landing-final h2,
.auth-card h2,
.caniles-header h2,
.landing-module-detail-card h3{
  color:var(--pet-coffee)!important;
}

.count-label,
.form-subtitle,
.pet-card-body p,
.pet-card-loc,
.detail-breed,
.detail-meta,
.detail-section p,
.profile-location,
.profile-bio,
.stat-label,
.reaction-info p,
.reaction-info span,
.notif-item p,
.notif-item small,
.caniles-subtitle,
.canil-detail-hero small,
.landing-section p,
.landing-modules p,
.landing-steps p,
.landing-module-detail-card p,
.landing-module-detail-card small{
  color:var(--muted-fg)!important;
}

.link-btn,
.mob-nav-btn--active,
.hashtag,
.dist-tag,
.landing-section-label,
.auth-form-kicker,
.hashtag-item-detail span{
  color:var(--pet-chestnut)!important;
}

.landing-section-label,
.auth-form-kicker,
.auth-demo-box,
.hint-box,
.warning-card,
.video-selected-card,
.profile-post-extra div,
.profile-post-metrics span,
.profile-social-link,
.settings-logout,
.map-legend,
.reward-badge,
.gender-badge--male,
.gender-badge--female,
.reaction-badge--super,
.reaction-badge--like,
.canil-status,
.pet-type-badge{
  background:var(--pet-peach)!important;
  border-color:rgba(76,177,123,.22)!important;
  color:var(--pet-bark)!important;
}

.hint-box code{
  background:var(--pet-tan)!important;
  color:var(--pet-coffee)!important;
}

.sidebar .nav-item:hover,
.mob-nav-btn:hover,
.notif-item:hover,
.nearby-item:hover,
.chat-item:hover,
.filter-chip:hover,
.icon-btn:hover{
  background:rgba(165,216,189,.30)!important;
  color:var(--pet-coffee)!important;
}

.badge,
.notif-badge,
.nav-badge,
.lost-badge--lost,
.fab-btn--red,
.map-pin--perdida .pin-dot,
.legend-dot--lost{
  background:var(--pet-coral)!important;
  color:#FAFDFB!important;
}

.fab-btn--blue,
.fab-btn--green,
.suggestion-follow-btn:not(.suggestion-follow-btn--active),
.btn-follow:not(.btn-follow--active),
.canil-status--open,
.adoption-badge,
.map-pin--adopcion .pin-dot,
.legend-dot--adoption{
  background:var(--pet-sage)!important;
  color:#FAFDFB!important;
  border-color:rgba(255,255,255,.65)!important;
}

.filter-chip--found,
.filter-chip--adoption,
.filter-chip--premium{
  border-color:rgba(127,143,87,.34)!important;
  color:#566438!important;
}

.pet-card--premium,
.lost-card--lost,
.lost-card--found{
  border-color:rgba(76,177,123,.25)!important;
  box-shadow:0 16px 36px rgba(76,177,123,.14)!important;
}

.pet-card--premium::before,
.filter-chip--premium.filter-chip--active,
.reward-filter.filter-chip--active,
.premium-badge,
.hashtag-featured span,
.online-dot{
  background:linear-gradient(135deg,var(--pet-sage),var(--pet-chestnut))!important;
  border-color:rgba(255,255,255,.68)!important;
  color:#FAFDFB!important;
}

.like-btn,
.canil-icon,
.nearby-fallback,
.upload-hero-icon,
.landing-module-detail-top>span{
  background:var(--pet-sand)!important;
  color:var(--pet-coffee)!important;
}

.adoption-uploader,
.adoption-upload-hero,
.report-upload-hero{
  background:linear-gradient(135deg,#FAFDFB,var(--pet-sage-soft))!important;
  border-color:rgba(127,143,87,.30)!important;
  color:#566438!important;
}

.pin-dot,
.map-pin--canil .pin-dot,
.pin-tooltip,
.map-pin--encontrada .pin-dot,
.legend-dot--found{
  background:var(--pet-chestnut)!important;
  color:#FAFDFB!important;
}

.map-bg,
.map-bg--hybrid{
  background-color:#D8EDE2!important;
  background-image:
    linear-gradient(rgba(41,96,67,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(41,96,67,.07) 1px,transparent 1px),
    radial-gradient(circle at 25% 24%,rgba(127,143,87,.18),transparent 12rem),
    radial-gradient(circle at 72% 62%,rgba(165,216,189,.26),transparent 14rem)!important;
}

.map-park,
.map-water{
  background:rgba(238,243,228,.76)!important;
  border-color:rgba(127,143,87,.24)!important;
  color:#566438!important;
}

.road--highway,
.road--main{stroke:#FAFDFB!important}
.road--street{stroke:rgba(41,96,67,.18)!important}

.tiktok-container{
  background:
    radial-gradient(circle at 18% 14%,rgba(76,177,123,.62),transparent 21rem),
    radial-gradient(circle at 78% 18%,rgba(165,216,189,.28),transparent 18rem),
    radial-gradient(circle at 52% 92%,rgba(127,143,87,.18),transparent 20rem),
    linear-gradient(135deg,#173326 0%,#245C3C 46%,#237A4D 130%)!important;
}

.discover-feed-tabs,
.discover-suggestions-head,
.discover-suggestion-card,
.suggestion-profile-btn,
.tiktok-info-left,
.controls-hint,
.tiktok-nav-btn,
.play-btn,
.action-btn,
.tiktok-empty-feed{
  background:linear-gradient(135deg,rgba(250,253,251,.18),rgba(76,177,123,.16))!important;
  border-color:rgba(165,216,189,.34)!important;
  color:#FAFDFB!important;
  box-shadow:0 18px 46px rgba(24,55,38,.22)!important;
}

.discover-feed-tabs .discover-feed-tab--active{
  background:linear-gradient(135deg,#FAFDFB,#BEDCC8)!important;
  color:var(--pet-coffee)!important;
  box-shadow:0 10px 24px rgba(76,177,123,.28)!important;
}

.discover-feed-tabs{
  padding:.32rem!important;
  background:rgba(24,55,38,.34)!important;
}

.discover-feed-tabs button{
  color:rgba(245,251,248,.78)!important;
}

.btn-follow:not(.btn-follow--active),
.suggestion-follow-btn:not(.suggestion-follow-btn--active){
  background:linear-gradient(135deg,#237A4D,#245C3C)!important;
  color:#FAFDFB!important;
  box-shadow:0 10px 24px rgba(76,177,123,.26)!important;
}

.btn-follow--active,
.suggestion-follow-btn--active{
  background:rgba(165,216,189,.24)!important;
  border-color:rgba(165,216,189,.38)!important;
  color:#FAFDFB!important;
}

.action-btn{
  background:linear-gradient(135deg,rgba(76,177,123,.42),rgba(24,55,38,.46))!important;
}

.action-btn--liked{
  color:#BEDCC8!important;
  border-color:rgba(165,216,189,.58)!important;
}

.play-btn{
  background:linear-gradient(135deg,rgba(76,177,123,.72),rgba(41,96,67,.62))!important;
  border-color:rgba(165,216,189,.48)!important;
  box-shadow:0 18px 44px rgba(76,177,123,.28)!important;
}

.post-indicator{
  background:rgba(165,216,189,.32)!important;
}

.post-indicator--active{
  background:#BEDCC8!important;
  box-shadow:0 0 0 4px rgba(76,177,123,.20)!important;
}

.controls-hint{
  color:#F2F9F5!important;
}

.discover-suggestions-head strong,
.discover-suggestion-card strong{
  color:#FAFDFB!important;
}

.discover-suggestions-head span,
.discover-suggestion-card span,
.discover-suggestion-card small{
  color:rgba(245,251,248,.72)!important;
}

.tiktok-gradient{
  background:
    linear-gradient(90deg,rgba(24,55,38,.52) 0%,rgba(76,177,123,.08) 42%,rgba(24,55,38,.40) 100%),
    linear-gradient(to top,rgba(24,55,38,.84) 0%,rgba(41,96,67,.20) 58%,transparent 78%)!important;
}

.landing-nav{
  background:rgba(250,253,251,.82)!important;
  border-color:rgba(24,55,38,.10)!important;
}

.landing-brand span,
.landing-final,
.auth-demo-box>span{
  background:linear-gradient(135deg,var(--pet-chestnut),var(--pet-bark))!important;
  color:#FAFDFB!important;
}

.landing-hero-shade{
  background:
    linear-gradient(90deg,rgba(24,55,38,.68) 0%,rgba(76,177,123,.30) 44%,rgba(24,55,38,.08) 100%),
    linear-gradient(to top,rgba(24,55,38,.58),rgba(76,177,123,.10) 58%,transparent 76%)!important;
}

.auth-showcase .auth-left-overlay{
  background:linear-gradient(145deg,rgba(24,55,38,.74),rgba(41,96,67,.46) 52%,rgba(127,143,87,.34))!important;
}

.auth-metrics div,
.feature-item,
.landing-hero-card,
.landing-kicker,
.landing-btn--ghost{
  background:rgba(250,253,251,.18)!important;
  border-color:rgba(250,253,251,.28)!important;
}

.auth-register-summary{
  background:var(--pet-sage-soft)!important;
  border-color:rgba(127,143,87,.28)!important;
  color:#566438!important;
}

.auth-register-summary span{
  background:var(--pet-sage)!important;
  color:#FAFDFB!important;
}

.landing-module-detail-card{
  background:linear-gradient(180deg,#FFFFFF,#F5FBF8)!important;
}

.landing-detail-tags span{
  border-color:rgba(76,177,123,.20)!important;
  background:#EBF6F0!important;
  color:var(--pet-bark)!important;
}

/* La landing clara no debe heredar los textos blancos del hero o del tema oscuro. */
html:not([data-theme="dark"]) .landing-page{
  color:#1B3A29!important;
}
html:not([data-theme="dark"]) .landing-section h2,
html:not([data-theme="dark"]) .landing-section h3,
html:not([data-theme="dark"]) .landing-process h2,
html:not([data-theme="dark"]) .landing-process h3,
html:not([data-theme="dark"]) .landing-stats strong,
html:not([data-theme="dark"]) .landing-modules h3,
html:not([data-theme="dark"]) .landing-steps h3{
  color:#1B3A29!important;
  text-shadow:none!important;
}
html:not([data-theme="dark"]) .landing-stats strong{
  color:#3D8D62!important;
}
html:not([data-theme="dark"]) .landing-section p,
html:not([data-theme="dark"]) .landing-process p,
html:not([data-theme="dark"]) .landing-modules p,
html:not([data-theme="dark"]) .landing-steps p,
html:not([data-theme="dark"]) .landing-stats span{
  color:#4A6B59!important;
}
html:not([data-theme="dark"]) .landing-stats article,
html:not([data-theme="dark"]) .landing-modules article,
html:not([data-theme="dark"]) .landing-steps article{
  color:#1B3A29!important;
  background:#FBFDFC!important;
  border-color:rgba(42,93,66,.14)!important;
}

.insta-avatar-ring{
  background:linear-gradient(135deg,var(--pet-chestnut),var(--pet-sage),var(--pet-tan))!important;
}

html[data-theme="dark"]{
  --bg:#0E2016;
  --fg:#F2F9F5;
  --card:#132C1F;
  --primary:#BEDCC8;
  --primary-fg:#173326;
  --secondary-bg:#173326;
  --muted:#1E4530;
  --muted-fg:#92D0AF;
  --border:rgba(165,216,189,.18);
  --accent:#BEDCC8;
  --accent-soft:#1E4530;
}

html[data-theme="dark"] .app-shell,
html[data-theme="dark"] .content-area,
html[data-theme="dark"] .adoptions-page,
html[data-theme="dark"] .profile-wrap,
html[data-theme="dark"] .sub-page,
html[data-theme="dark"] .detail-page,
html[data-theme="dark"] .chats-layout,
html[data-theme="dark"] .map-layout,
html[data-theme="dark"] .caniles-page{
  background:linear-gradient(180deg,#0E2016 0%,#11281C 52%,#173326 100%)!important;
}

html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .top-header,
html[data-theme="dark"] .mobile-nav,
html[data-theme="dark"] .notif-panel,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .pet-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .profile-section-card,
html[data-theme="dark"] .pub-card,
html[data-theme="dark"] .reaction-item,
html[data-theme="dark"] .modal-sheet,
html[data-theme="dark"] .nearby-panel,
html[data-theme="dark"] .chat-list-panel,
html[data-theme="dark"] .chat-convo-header,
html[data-theme="dark"] .contact-card,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .canil-card,
html[data-theme="dark"] .caniles-side-panel,
html[data-theme="dark"] .canil-detail-drawer,
html[data-theme="dark"] .map-detail-panel,
html[data-theme="dark"] .lost-stat,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .landing-module-detail-card{
  background:rgba(19,44,31,.94)!important;
  border-color:rgba(165,216,189,.18)!important;
  color:#F2F9F5!important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .chat-input,
html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .map-ctrl-btn{
  background:#132C1F!important;
  color:#F2F9F5!important;
  border-color:rgba(165,216,189,.18)!important;
}

html[data-theme="dark"] .adoptions-title-row h2,
html[data-theme="dark"] .header-title,
html[data-theme="dark"] .detail-content h2,
html[data-theme="dark"] .profile-name h2,
html[data-theme="dark"] .landing-section h2,
html[data-theme="dark"] .landing-final h2,
html[data-theme="dark"] .auth-card h2,
html[data-theme="dark"] .caniles-header h2,
html[data-theme="dark"] .landing-module-detail-card h3{
  color:#F2F9F5!important;
}

html[data-theme="dark"] .landing-module-detail-card p,
html[data-theme="dark"] .landing-module-detail-card small{
  color:#92D0AF!important;
}

html[data-theme="dark"] .landing-detail-tags span{
  background:#1E4530!important;
  border-color:rgba(165,216,189,.18)!important;
  color:#BEDCC8!important;
}

/* La landing pública conserva una superficie clara incluso si la app quedó en dark. */
html[data-theme="dark"] .landing-page .landing-section h2,
html[data-theme="dark"] .landing-page .landing-section h3,
html[data-theme="dark"] .landing-page .landing-process h2,
html[data-theme="dark"] .landing-page .landing-process h3,
html[data-theme="dark"] .landing-page .landing-modules h3,
html[data-theme="dark"] .landing-page .landing-steps h3{
  color:#1B3A29!important;
  text-shadow:none!important;
}
html[data-theme="dark"] .landing-page .landing-stats strong{
  color:#3D8D62!important;
  text-shadow:none!important;
}
html[data-theme="dark"] .landing-page .landing-section p,
html[data-theme="dark"] .landing-page .landing-process p,
html[data-theme="dark"] .landing-page .landing-modules p,
html[data-theme="dark"] .landing-page .landing-steps p,
html[data-theme="dark"] .landing-page .landing-stats span{
  color:#4A6B59!important;
}
html[data-theme="dark"] .landing-page .landing-stats article,
html[data-theme="dark"] .landing-page .landing-modules article,
html[data-theme="dark"] .landing-page .landing-steps article{
  color:#1B3A29!important;
  background:#FBFDFC!important;
  border-color:rgba(42,93,66,.14)!important;
}

@media(max-width:900px){
  .landing-module-details{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:768px){
  .landing-module-details{grid-template-columns:1fr}
  .landing-module-detail-card{min-height:0}
}

/* Contextual flows, notification center and resilient connection states */
.chat-context-card{
  margin:.75rem 1rem 0;display:flex;align-items:center;gap:.8rem;width:calc(100% - 2rem);
  padding:.7rem;border:1px solid var(--border);border-radius:14px;background:var(--card);color:var(--foreground);
  text-align:left;cursor:pointer;box-shadow:var(--shadow);transition:transform .15s,border-color .15s;
}
.chat-context-card:hover{transform:translateY(-1px);border-color:var(--primary)}
.chat-context-card img{width:58px;height:52px;border-radius:10px;object-fit:cover}
.chat-context-card>span{display:grid;gap:.08rem;min-width:0;flex:1}
.chat-context-card small{color:var(--primary);font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.chat-context-card strong,.chat-context-card em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-context-card em{font-size:.75rem;color:var(--muted-fg);font-style:normal}
.chat-context-card>b{font-size:.72rem;color:var(--primary);white-space:nowrap}
.chat-context-label{display:block;color:var(--primary);font-size:.68rem;font-weight:800;margin:.1rem 0}
.chat-item{border:0;width:100%;text-align:left;color:inherit}
.msg-status--leido{color:#238A62}
.state-panel,.route-error-state{display:grid;place-items:center;text-align:center;gap:.65rem;padding:2.5rem;color:var(--muted-fg)}
.state-panel strong,.route-error-state h2{color:var(--foreground);margin:0}
.state-panel--error,.route-error-state{min-height:280px}

.notif-panel{width:min(430px,calc(100vw - 1rem));max-height:min(680px,calc(100dvh - 72px));display:flex;flex-direction:column}
.notif-filters{display:flex;gap:.35rem;padding:.65rem .75rem;overflow-x:auto;border-bottom:1px solid var(--border)}
.notif-filters button{border:1px solid var(--border);background:var(--muted);color:var(--foreground);border-radius:999px;padding:.38rem .65rem;font-size:.7rem;font-weight:800;white-space:nowrap;cursor:pointer}
.notif-filters .notif-filter--active{background:var(--primary);border-color:var(--primary);color:#fff}
.notif-mute-btn{margin:.55rem .75rem 0;border:0;background:transparent;color:var(--muted-fg);font-size:.72rem;text-align:left;cursor:pointer}
.notif-list{overflow-y:auto;overscroll-behavior:contain}
.notif-item{position:relative;width:100%;color:inherit;text-align:left;background:var(--card)}
.notif-copy{min-width:0;flex:1;padding-right:3.6rem}
.notif-actions{position:absolute;right:.55rem;top:.6rem;display:flex;gap:.25rem}
.notif-actions button{width:28px;height:28px;border:1px solid var(--border);border-radius:50%;background:var(--muted);color:var(--foreground);cursor:pointer}
.notif-empty{padding:2rem 1rem;text-align:center;color:var(--muted-fg);font-size:.82rem}
.action-btn--saved span,.action-btn--saved small{color:#7FCD72!important}
.pref-control--select select{min-width:150px;border:1px solid var(--border);border-radius:10px;padding:.55rem;background:var(--card);color:var(--foreground)}

.reconnect-modal{display:none;position:fixed;inset:0;z-index:10000;background:rgba(12,20,16,.58);backdrop-filter:blur(5px);align-items:flex-end;justify-content:center;padding:1rem}
.reconnect-modal.components-reconnect-show,.reconnect-modal.components-reconnect-failed,.reconnect-modal.components-reconnect-rejected{display:flex}
.reconnect-card{width:min(620px,100%);display:flex;align-items:center;gap:1rem;background:var(--card);color:var(--foreground);border:1px solid var(--border);border-radius:18px;padding:1rem 1.15rem;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.reconnect-card>div{flex:1}.reconnect-card strong{display:block}.reconnect-card p{margin:.2rem 0 0;color:var(--muted-fg);font-size:.82rem}
.reconnect-icon{font-size:1.8rem;color:var(--primary)}
.reconnect-failed,.reconnect-rejected,.components-reconnect-failed .reconnect-trying,.components-reconnect-rejected .reconnect-trying{display:none!important}
.components-reconnect-failed .reconnect-failed,.components-reconnect-rejected .reconnect-rejected{display:block!important}

html[data-theme="dark"] .notif-item,html[data-theme="dark"] .chat-context-card,html[data-theme="dark"] .reconnect-card{background:#17241D!important}
html[data-theme="dark"] .notif-item--unread{background:#1F3027!important}

@media(max-width:600px){
  .notif-panel{position:fixed!important;top:58px!important;right:.5rem!important;left:.5rem!important;width:auto!important;max-height:calc(100dvh - 126px)!important}
  .notif-header{flex-shrink:0}.notif-filters{flex-shrink:0}.notif-item{padding:.8rem .65rem}
  .notif-copy{padding-right:3.2rem}.notif-actions{right:.4rem}
  .chat-context-card{margin:.55rem .65rem 0;width:calc(100% - 1.3rem)}
  .chat-context-card>b{display:none}
  .reconnect-card{align-items:flex-start;flex-wrap:wrap}.reconnect-button{width:100%}
  .pref-control--select{align-items:flex-start;flex-direction:column}.pref-control--select select{width:100%}
}

/* Premium: identidad exclusivamente verde y con contraste alto */
.pet-card--premium{
  border:2px solid #16A34A!important;
  box-shadow:0 16px 38px rgba(22,163,74,.24)!important;
}

.pet-card--premium:hover{
  border-color:#15803D!important;
  box-shadow:0 20px 46px rgba(21,128,61,.32)!important;
}

.pet-card--premium::before{
  background:linear-gradient(180deg,#4ADE80 0%,#16A34A 50%,#047857 100%)!important;
  border-color:transparent!important;
}

.pet-card--premium .pet-card-body{
  background:linear-gradient(180deg,#ECFDF5 0%,#F0FDF4 100%)!important;
}

.pet-card--premium .pet-card-body h3{
  color:#14532D!important;
}

.premium-badge{
  background:linear-gradient(135deg,#16A34A 0%,#047857 100%)!important;
  border:1px solid #BBF7D0!important;
  color:#FFFFFF!important;
  box-shadow:0 10px 24px rgba(5,150,105,.42)!important;
}

.premium-badge--lost,
.premium-badge--detail{
  left:auto!important;
  right:.625rem!important;
}

.premium-badge--detail{
  top:.75rem!important;
}

.filter-chip--premium{
  background:#ECFDF5!important;
  border-color:#4ADE80!important;
  color:#166534!important;
}

.filter-chip--premium:hover{
  background:#DCFCE7!important;
  border-color:#22C55E!important;
  color:#14532D!important;
}

.filter-chip--premium.filter-chip--active{
  background:linear-gradient(135deg,#16A34A 0%,#047857 100%)!important;
  border-color:#16A34A!important;
  color:#FFFFFF!important;
  box-shadow:0 8px 20px rgba(22,163,74,.32)!important;
}

html[data-theme="dark"] .pet-card--premium{
  border-color:#4ADE80!important;
  box-shadow:0 16px 38px rgba(34,197,94,.22)!important;
}

html[data-theme="dark"] .pet-card--premium .pet-card-body{
  background:linear-gradient(180deg,#123524 0%,#102A20 100%)!important;
}

html[data-theme="dark"] .pet-card--premium .pet-card-body h3{
  color:#BBF7D0!important;
}

html[data-theme="dark"] .filter-chip--premium{
  background:#123524!important;
  border-color:#22C55E!important;
  color:#BBF7D0!important;
}

html[data-theme="dark"] .filter-chip--premium.filter-chip--active{
  background:linear-gradient(135deg,#22C55E 0%,#047857 100%)!important;
  color:#FFFFFF!important;
}

/* Filtros internos: compactos y plegables en teléfonos */
.mobile-filter-panel{
  display:contents;
}

/* Descubrir: feed continuo sin un final fijo */
.feed-position{
  position:absolute;
  top:3.55rem;
  left:1rem;
  z-index:6;
  padding:.32rem .58rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(0,0,0,.28);
  color:rgba(255,255,255,.88);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.02em;
  backdrop-filter:blur(10px);
}

.feed-loading-more{
  position:absolute;
  top:50%;
  left:50%;
  z-index:9;
  display:flex;
  align-items:center;
  gap:.55rem;
  transform:translate(-50%,-50%);
  padding:.7rem .9rem;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(12,18,15,.72);
  color:#fff;
  font-size:.76rem;
  font-weight:800;
  box-shadow:0 14px 35px rgba(0,0,0,.25);
  backdrop-filter:blur(12px);
}

.feed-mini-spinner{
  width:1rem;
  height:1rem;
  display:inline-block;
  border:2px solid rgba(255,255,255,.35);
  border-top-color:#fff;
  border-radius:50%;
  animation:feed-spin .7s linear infinite;
}

@keyframes feed-spin{
  to{transform:rotate(360deg)}
}

.mobile-filter-toggle{
  width:100%;
  min-height:2.75rem;
  align-items:center;
  justify-content:space-between;
  gap:.65rem;
  padding:.65rem .85rem;
  border:1px solid var(--border);
  border-radius:.9rem;
  background:#FBFDFC;
  color:var(--fg);
  font:inherit;
  font-size:.86rem;
  font-weight:800;
  cursor:pointer;
}

.mobile-filter-toggle>span:first-child{
  display:flex;
  align-items:center;
  gap:.5rem;
}

.mobile-filter-toggle strong{
  min-width:1.45rem;
  height:1.45rem;
  display:grid;
  place-items:center;
  margin-left:auto;
  border-radius:999px;
  background:var(--primary);
  color:#fff;
  font-size:.72rem;
}

.mobile-filter-toggle-chevron{
  font-size:1.05rem;
  line-height:1;
}

@media(max-width:768px){
  .mobile-filter-panel{
    display:none;
    padding-top:.65rem;
  }

  .mobile-filter-panel--open{
    display:block;
  }

  .mobile-filter-panel .filter-row{
    margin-bottom:.65rem;
  }

  .mobile-filter-panel .adoption-select-filters{
    margin-top:0!important;
  }

  .map-mobile-filter-toggle{
    width:calc(100% - 2rem);
    margin:.7rem 1rem .35rem;
  }

  .map-mobile-filter-panel{
    padding-top:.25rem;
  }

  .map-mobile-filter-panel .nearby-filters{
    padding-top:.55rem;
  }

  html[data-theme="dark"] .mobile-filter-toggle{
    background:#1C2A23;
    border-color:#3B5A49;
    color:#F4FAF7;
  }

  html[data-theme="dark"] .mobile-filter-toggle strong{
    background:#5FBB8A;
  }
}

/* Notificaciones: panel completo y utilizable en teléfonos */
@media(max-width:768px){
  .notif-panel{
    position:fixed!important;
    top:calc(3.5rem + env(safe-area-inset-top, 0px) + .5rem)!important;
    left:.75rem!important;
    right:.75rem!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100vh - 9rem)!important;
    max-height:calc(100dvh - 9rem - env(safe-area-inset-bottom, 0px))!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border-radius:1.1rem!important;
    z-index:1000!important;
    box-shadow:0 22px 55px rgba(24,55,38,.24)!important;
  }

  .notif-header{
    flex:0 0 auto;
    gap:.75rem;
    min-height:3.35rem;
    padding:.8rem .9rem!important;
  }

  .notif-header strong{
    min-width:0;
    font-size:.95rem;
  }

  .notif-header .link-btn{
    flex-shrink:0;
    white-space:nowrap;
    font-size:.76rem;
    padding:.35rem .15rem;
  }

  .notif-list{
    flex:1 1 auto;
    min-height:0;
    max-height:none!important;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .notif-item{
    align-items:flex-start;
    gap:.65rem;
    padding:.8rem .9rem!important;
  }

  .notif-item > div{
    flex:1;
    min-width:0;
  }

  .notif-item p{
    line-height:1.4;
    overflow-wrap:anywhere;
  }

  .notif-icon{
    font-size:1.25rem;
  }
}

@media(max-width:360px){
  .notif-panel{
    left:.5rem!important;
    right:.5rem!important;
  }

  .notif-header,
  .notif-item{
    padding-left:.75rem!important;
    padding-right:.75rem!important;
  }
}

/* ============================================================
   Dark mode system
   Capa final para que controles, filtros y estados interactivos
   no hereden superficies claras de las reglas de escritorio.
   ============================================================ */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0C120F;
  --fg:#F6FBF8;
  --card:#131E18;
  --primary:#4CB27C;
  --primary-fg:#FFFFFF;
  --secondary-bg:#1C2A23;
  --muted:#1F3027;
  --muted-fg:#ACC9BA;
  --border:rgba(233,246,239,.15);
  --accent:#5DB988;
  --accent-soft:rgba(93,185,136,.18);
  --green:#4ADE80;
  --blue:#60A5FA;
  --red:#FB7185;
  --input-bg:#15211B;
  --surface:#131E18;
  --surface-soft:#18261F;
  --surface-muted:#1F3027;
  --overlay-soft:rgba(19,30,24,.92);
  --text-soft:#C8E0D3;
  --shadow:0 12px 34px rgba(0,0,0,.34);
  --shadow-lg:0 28px 72px rgba(0,0,0,.48);
}

html[data-theme="dark"],
html[data-theme="dark"] body{
  background:#0C120F!important;
  color:var(--fg)!important;
}

html[data-theme="dark"] body::before{
  background:
    radial-gradient(circle at 10% 8%,rgba(76,178,124,.13),transparent 27rem),
    radial-gradient(circle at 92% 12%,rgba(74,222,128,.06),transparent 23rem),
    linear-gradient(180deg,#0E1712 0%,#0C120F 52%,#0D0A09 100%)!important;
}

html[data-theme="dark"] .app-shell,
html[data-theme="dark"] .content-area,
html[data-theme="dark"] .adoptions-page,
html[data-theme="dark"] .lost-page,
html[data-theme="dark"] .profile-wrap,
html[data-theme="dark"] .sub-page,
html[data-theme="dark"] .detail-page,
html[data-theme="dark"] .chats-layout,
html[data-theme="dark"] .map-layout,
html[data-theme="dark"] .caniles-page,
html[data-theme="dark"] .community-page,
html[data-theme="dark"] .admin-page,
html[data-theme="dark"] .demo-dashboard{
  background:
    radial-gradient(circle at 8% 8%,rgba(76,178,124,.08),transparent 24rem),
    linear-gradient(180deg,#0E1712 0%,#0C120F 100%)!important;
  color:var(--fg)!important;
}

html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .top-header,
html[data-theme="dark"] .mobile-nav,
html[data-theme="dark"] .notif-panel,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .adoptions-header,
html[data-theme="dark"] .chat-list-panel,
html[data-theme="dark"] .chat-list-header,
html[data-theme="dark"] .chat-convo-header,
html[data-theme="dark"] .chat-input-row,
html[data-theme="dark"] .emoji-picker,
html[data-theme="dark"] .modal-sheet,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .settings-sheet,
html[data-theme="dark"] .profile-tabs,
html[data-theme="dark"] .insta-profile-tabs,
html[data-theme="dark"] .community-post,
html[data-theme="dark"] .demo-panel,
html[data-theme="dark"] .demo-kpi-grid article,
html[data-theme="dark"] .admin-table,
html[data-theme="dark"] .profile-section-card,
html[data-theme="dark"] .contact-card,
html[data-theme="dark"] .canil-card,
html[data-theme="dark"] .caniles-side-panel,
html[data-theme="dark"] .canil-detail-drawer,
html[data-theme="dark"] .map-detail-panel,
html[data-theme="dark"] .nearby-panel,
html[data-theme="dark"] .pub-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .lost-stat,
html[data-theme="dark"] .chip{
  background:#131E18!important;
  border-color:var(--border)!important;
  color:var(--fg)!important;
}

html[data-theme="dark"] .sidebar-brand,
html[data-theme="dark"] .notif-header,
html[data-theme="dark"] .detail-header{
  background:linear-gradient(135deg,#16261D,#111A15)!important;
  border-color:var(--border)!important;
  color:var(--fg)!important;
}

html[data-theme="dark"] h1[tabindex="-1"]:focus,
html[data-theme="dark"] h2[tabindex="-1"]:focus{
  outline:none!important;
}

/* Navegación y menú superior */
html[data-theme="dark"] .nav-item,
html[data-theme="dark"] .mob-nav-btn{
  background:transparent!important;
  color:#ACC9BA!important;
  border-color:transparent!important;
  box-shadow:none!important;
}

html[data-theme="dark"] .nav-item:hover,
html[data-theme="dark"] .mob-nav-btn:hover{
  background:#1F3027!important;
  color:#F6FBF8!important;
}

html[data-theme="dark"] .nav-item--active{
  background:linear-gradient(135deg,#59B885,#347A55)!important;
  color:#FFFFFF!important;
  border-color:rgba(210,236,222,.18)!important;
  box-shadow:0 12px 28px rgba(52,122,85,.32)!important;
}

html[data-theme="dark"] .mob-nav-btn--active{
  background:rgba(89,184,133,.16)!important;
  color:#92D0AF!important;
}

html[data-theme="dark"] .nav-item--logout:hover{
  background:rgba(251,113,133,.13)!important;
  color:#FDA4AF!important;
}

html[data-theme="dark"] .icon-btn,
html[data-theme="dark"] .map-ctrl-btn,
html[data-theme="dark"] .input-btn,
html[data-theme="dark"] .emoji-btn,
html[data-theme="dark"] .org-mini-card button{
  background:#1C2A23!important;
  border:1px solid rgba(233,246,239,.16)!important;
  color:#E7F5EE!important;
  box-shadow:none!important;
}

html[data-theme="dark"] .icon-btn:hover,
html[data-theme="dark"] .map-ctrl-btn:hover,
html[data-theme="dark"] .emoji-btn:hover,
html[data-theme="dark"] .org-mini-card button:hover{
  background:#233A2E!important;
  border-color:rgba(146,208,175,.38)!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .theme-toggle{
  background:#183827!important;
  border-color:rgba(88,183,132,.28)!important;
  color:#ACDBC2!important;
}

html[data-theme="dark"] .notif-btn{
  background:#1C2A23!important;
  color:#D0EBDD!important;
}

html[data-theme="dark"] .avatar-btn,
html[data-theme="dark"] .brand-icon{
  background:linear-gradient(135deg,#59B885,#347A55)!important;
  color:#FFFFFF!important;
  border-color:rgba(255,255,255,.14)!important;
}

/* Botones generales */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .fab-main,
html[data-theme="dark"] .auth-tabs .auth-tab--active{
  background:linear-gradient(135deg,#59B885,#357B56)!important;
  border-color:transparent!important;
  color:#FFFFFF!important;
  box-shadow:0 12px 28px rgba(53,123,86,.30)!important;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .fab-main:hover{
  background:linear-gradient(135deg,#6FC196,#3B8B60)!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .privacy-option,
html[data-theme="dark"] .fab-label{
  background:#18261F!important;
  border-color:rgba(233,246,239,.16)!important;
  color:#E7F5EE!important;
}

html[data-theme="dark"] .btn-outline:hover,
html[data-theme="dark"] .privacy-option:hover{
  background:#20352A!important;
  border-color:rgba(146,208,175,.36)!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] button:disabled,
html[data-theme="dark"] input:disabled,
html[data-theme="dark"] select:disabled{
  opacity:.52!important;
  cursor:not-allowed!important;
}

/* Entradas, búsquedas y selectores */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .chat-input,
html[data-theme="dark"] .map-search-input,
html[data-theme="dark"] .adoption-select-filters select{
  background:#15211B!important;
  border-color:rgba(233,246,239,.16)!important;
  color:#F6FBF8!important;
  caret-color:#92D0AF!important;
}

html[data-theme="dark"] select option{
  background:#15211B!important;
  color:#F6FBF8!important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .chat-input::placeholder{
  color:#819F8F!important;
  opacity:1!important;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .chat-input:focus{
  background:#1A2A21!important;
  border-color:#59B885!important;
  box-shadow:0 0 0 3px rgba(89,184,133,.18)!important;
}

/* Filtros: normal, hover y activos por categoría */
html[data-theme="dark"] .filter-chip{
  background:#18261F!important;
  border-color:rgba(233,246,239,.18)!important;
  color:#D6EADF!important;
  box-shadow:none!important;
}

html[data-theme="dark"] .filter-chip:hover{
  background:#20352A!important;
  border-color:rgba(146,208,175,.34)!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .filter-chip--active{
  background:linear-gradient(135deg,#59B885,#357B56)!important;
  border-color:#59B885!important;
  color:#FFFFFF!important;
  box-shadow:0 8px 20px rgba(53,123,86,.24)!important;
}

html[data-theme="dark"] .filter-chip--lost:not(.filter-chip--active){
  border-color:rgba(251,113,133,.45)!important;
  color:#FDA4AF!important;
}

html[data-theme="dark"] .filter-chip--lost.filter-chip--active{
  background:#BE334B!important;
  border-color:#FB7185!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .filter-chip--found:not(.filter-chip--active){
  border-color:rgba(96,165,250,.48)!important;
  color:#93C5FD!important;
}

html[data-theme="dark"] .filter-chip--found.filter-chip--active{
  background:#2563A8!important;
  border-color:#60A5FA!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .filter-chip--adoption:not(.filter-chip--active){
  border-color:rgba(74,222,128,.45)!important;
  color:#86EFAC!important;
}

html[data-theme="dark"] .filter-chip--adoption.filter-chip--active,
html[data-theme="dark"] .filter-chip--premium.filter-chip--active{
  background:linear-gradient(135deg,#16A34A,#047857)!important;
  border-color:#4ADE80!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .filter-chip--premium:not(.filter-chip--active){
  background:#123524!important;
  border-color:#22C55E!important;
  color:#BBF7D0!important;
}

html[data-theme="dark"] .reward-filter.filter-chip--active{
  background:linear-gradient(135deg,#409668,#2B6446)!important;
  border-color:#63BC8D!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .count-label{
  background:#193928!important;
  color:#ADDCC3!important;
  border:1px solid rgba(99,188,141,.16)!important;
}

/* Tarjetas y acciones de adopción */
html[data-theme="dark"] .pet-card:not(.pet-card--premium),
html[data-theme="dark"] .lost-card{
  background:#131E18!important;
  border-color:var(--border)!important;
}

html[data-theme="dark"] .pet-card-body h3,
html[data-theme="dark"] .lost-card h3{
  color:#F6FBF8!important;
}

html[data-theme="dark"] .pet-card-body p,
html[data-theme="dark"] .pet-card-loc,
html[data-theme="dark"] .lost-card p{
  color:#ACC9BA!important;
}

html[data-theme="dark"] .like-btn{
  background:rgba(19,30,24,.92)!important;
  border:1px solid rgba(233,246,239,.18)!important;
  color:#F6FBF8!important;
}

html[data-theme="dark"] .like-btn:hover,
html[data-theme="dark"] .like-btn--liked{
  background:#3A2026!important;
  border-color:rgba(251,113,133,.42)!important;
  color:#FDA4AF!important;
}

html[data-theme="dark"] .premium-badge{
  background:linear-gradient(135deg,#16A34A,#047857)!important;
  border-color:#86EFAC!important;
  color:#FFFFFF!important;
}

/* Chats */
html[data-theme="dark"] .chat-messages,
html[data-theme="dark"] .chat-empty{
  background:
    radial-gradient(circle at 12% 12%,rgba(89,184,133,.06),transparent 18rem),
    #0B100D!important;
  color:#ACC9BA!important;
}

html[data-theme="dark"] .chat-item{
  background:transparent!important;
  border-color:rgba(233,246,239,.10)!important;
  color:#F6FBF8!important;
}

html[data-theme="dark"] .chat-item:hover{
  background:#1B2B22!important;
}

html[data-theme="dark"] .chat-item--unread{
  background:rgba(96,165,250,.10)!important;
}

html[data-theme="dark"] .chat-item--active,
html[data-theme="dark"] .chat-item--active.chat-item--unread{
  background:rgba(89,184,133,.20)!important;
  box-shadow:inset 4px 0 0 #6FC195!important;
}

html[data-theme="dark"] .chat-item-top strong,
html[data-theme="dark"] .chat-convo-header strong{
  color:#F6FBF8!important;
}

html[data-theme="dark"] .chat-item-top span,
html[data-theme="dark"] .chat-item-info p,
html[data-theme="dark"] .msg-meta{
  color:#9BB6A8!important;
}

html[data-theme="dark"] .msg--in .msg-bubble{
  background:#1B2821!important;
  border:1px solid rgba(233,246,239,.14)!important;
  color:#F6FBF8!important;
}

html[data-theme="dark"] .msg--out .msg-bubble{
  background:linear-gradient(135deg,#44A06F,#2E6B4A)!important;
  border:1px solid rgba(191,228,208,.20)!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .typing-bubble{
  background:#1B2821!important;
}

html[data-theme="dark"] .online-status{
  color:#86EFAC!important;
}

/* Pestañas, switches y acciones secundarias */
html[data-theme="dark"] .view-switch,
html[data-theme="dark"] .discover-feed-tabs,
html[data-theme="dark"] .auth-tabs{
  background:#16110F!important;
  border-color:rgba(233,246,239,.16)!important;
}

html[data-theme="dark"] .view-switch button,
html[data-theme="dark"] .discover-feed-tabs button,
html[data-theme="dark"] .auth-tabs button,
html[data-theme="dark"] .demo-tabs button,
html[data-theme="dark"] .insta-tab{
  background:transparent!important;
  color:#ACC9BA!important;
}

html[data-theme="dark"] .view-switch .view-switch--active,
html[data-theme="dark"] .discover-feed-tabs .discover-feed-tab--active,
html[data-theme="dark"] .auth-tabs .auth-tab--active{
  background:linear-gradient(135deg,#59B885,#357B56)!important;
  color:#FFFFFF!important;
  border-color:transparent!important;
}

html[data-theme="dark"] .demo-tabs .demo-tab--active,
html[data-theme="dark"] .insta-tab--active{
  background:rgba(89,184,133,.10)!important;
  border-color:#6FC195!important;
  color:#92D0AF!important;
}

html[data-theme="dark"] .community-actions button,
html[data-theme="dark"] .admin-actions button{
  background:#18261F!important;
  border:1px solid rgba(233,246,239,.14)!important;
  color:#D6EADF!important;
}

html[data-theme="dark"] .community-actions button:hover,
html[data-theme="dark"] .admin-actions button:hover{
  background:#20352A!important;
  color:#FFFFFF!important;
}

html[data-theme="dark"] .link-btn{
  color:#8DCEAB!important;
}

html[data-theme="dark"] .link-btn:hover{
  color:#B9E1CC!important;
}

html[data-theme="dark"] .slider{
  background:#314A3D!important;
}

html[data-theme="dark"] .toggle input:checked + .slider{
  background:#4CB27C!important;
}

@media(max-width:768px){
  html[data-theme="dark"] .top-header{
    background:rgba(19,30,24,.98)!important;
  }

  html[data-theme="dark"] .mobile-nav{
    background:rgba(15,24,19,.98)!important;
    border-color:rgba(233,246,239,.14)!important;
  }

  html[data-theme="dark"] .filter-row{
    scrollbar-color:#325A45 transparent;
  }
}

/* Profile publication detail — editorial layout */
.profile-post-overlay{
  padding:clamp(.75rem,2vw,1.5rem)!important;
  background:rgba(14,25,19,.68)!important;
  backdrop-filter:blur(10px);
}

.profile-post-detail{
  width:min(1080px,96vw)!important;
  height:min(720px,92dvh);
  max-height:min(760px,92dvh)!important;
  grid-template-columns:minmax(360px,.9fr) minmax(430px,1.1fr)!important;
  border:1px solid rgba(255,255,255,.72);
  border-radius:24px!important;
  background:#FBFDFC!important;
  box-shadow:0 32px 100px rgba(12,26,19,.42)!important;
}

.profile-post-close{
  top:1rem!important;
  right:1rem!important;
  width:2.4rem!important;
  height:2.4rem!important;
  background:rgba(22,37,29,.78)!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
  transition:transform .18s,background .18s;
}

.profile-post-close:hover{
  transform:rotate(8deg) scale(1.04);
  background:#1B3025!important;
}

.profile-post-media{
  min-height:0!important;
  height:100%;
  background:#12231A!important;
  overflow:hidden;
}

.profile-post-media img{
  object-position:center center;
  transition:transform .5s ease;
}

.profile-post-detail:hover .profile-post-media img{
  transform:scale(1.015);
}

.profile-post-media-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(9,20,14,.76) 100%);
  pointer-events:none;
}

.profile-post-media-caption{
  position:absolute;
  left:1.25rem;
  right:1.25rem;
  bottom:1.2rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  color:#fff;
}

.profile-post-media-caption small{
  color:rgba(255,255,255,.78);
  font-size:.72rem;
}

.profile-post-kind{
  position:static!important;
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  margin:0;
  padding:.48rem .78rem!important;
  background:rgba(255,255,255,.14)!important;
  border:1px solid rgba(255,255,255,.3);
  font-size:.75rem!important;
  letter-spacing:.02em;
}

.profile-post-info{
  padding:0!important;
  background:#FBFDFC;
  display:flex;
  flex-direction:column;
  overflow-y:auto!important;
}

.profile-post-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.35rem 1.6rem;
  border-bottom:1px solid rgba(62,111,85,.12);
}

.profile-post-author{
  margin:0!important;
}

.profile-post-avatar{
  width:2.8rem!important;
  height:2.8rem!important;
  background:linear-gradient(135deg,#285B40,#0F2218)!important;
  border:3px solid #fff;
  box-shadow:0 4px 14px rgba(21,48,34,.18);
}

.profile-post-author strong{
  font-size:.9rem;
}

.profile-post-author small{
  font-size:.72rem;
}

.profile-post-more{
  width:2.2rem;
  height:2.2rem;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--muted-fg);
  font-size:1.25rem;
  cursor:pointer;
}

.profile-post-more:hover{
  background:var(--pet-peach);
  color:var(--pet-coffee);
}

.profile-post-copy{
  padding:1.7rem 1.7rem .9rem;
}

.profile-post-eyebrow{
  display:inline-block;
  color:#3D8E63;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  margin-bottom:.55rem;
}

.profile-post-copy h3{
  margin:0 0 .65rem!important;
  color:#193325;
  font-family:"DM Serif Display",serif;
  font-size:clamp(1.75rem,3vw,2.25rem)!important;
  line-height:1.05;
}

.profile-post-copy p{
  margin:0;
  font-size:.92rem;
  line-height:1.62!important;
}

.profile-post-actions{
  display:flex;
  gap:.55rem;
  padding:.65rem 1.7rem 1.25rem;
}

.profile-post-actions button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  min-height:2.55rem;
  padding:.55rem .85rem;
  border:1px solid rgba(62,111,85,.16);
  border-radius:12px;
  background:#fff;
  color:#254A36;
  font-size:.76rem;
  font-weight:850;
  cursor:pointer;
  transition:transform .15s,border-color .15s,background .15s;
}

.profile-post-actions button:hover{
  transform:translateY(-1px);
  border-color:#48A975;
  background:#F4FAF7;
}

.profile-post-actions .profile-post-like{
  background:#1D3729;
  border-color:#1D3729;
  color:#fff;
}

.profile-post-actions .profile-post-like--active{
  background:#A64639;
  border-color:#A64639;
}

.profile-post-actions button:last-child{
  margin-left:auto;
}

.profile-post-metrics{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0!important;
  margin:0 1.7rem 1.15rem!important;
  padding:.85rem 0;
  border-top:1px solid rgba(62,111,85,.12);
  border-bottom:1px solid rgba(62,111,85,.12);
}

.profile-post-metrics div{
  display:grid;
  place-items:center;
  gap:.08rem;
  border-right:1px solid rgba(62,111,85,.12);
}

.profile-post-metrics div:last-child{
  border-right:0;
}

.profile-post-metrics strong{
  color:#1B3527;
  font-size:1rem;
}

.profile-post-metrics span{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--muted-fg)!important;
  font-size:.66rem!important;
  font-weight:650!important;
}

.profile-post-extra{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:.55rem!important;
  margin:0 1.7rem 1.15rem!important;
}

.profile-post-extra>div{
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.7rem!important;
  border:1px solid rgba(75,176,122,.16)!important;
  border-radius:12px!important;
  background:#F4FAF7!important;
  text-align:left!important;
}

.profile-post-extra>div>span{
  flex:0 0 auto;
  display:grid!important;
  place-items:center;
  width:1.8rem;
  height:1.8rem;
  margin:0!important;
  border-radius:9px;
  background:#CEEADB;
  color:#347A55!important;
  font-size:.78rem!important;
  font-weight:900;
}

.profile-post-extra p{
  min-width:0;
  margin:0!important;
  line-height:1.1!important;
}

.profile-post-extra small,
.profile-post-extra strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.profile-post-extra small{
  color:var(--muted-fg);
  font-size:.62rem;
  margin-bottom:.22rem;
}

.profile-post-extra strong{
  color:#234B36;
  font-size:.74rem!important;
}

.profile-post-comments{
  margin:0 1.7rem 1.5rem!important;
  padding:1rem 0 0!important;
}

.profile-post-comments header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:.75rem;
}

.profile-post-comments header strong{
  margin:0!important;
  color:#1F3B2C;
  font-size:.88rem;
}

.profile-post-comments header button{
  border:0;
  background:transparent;
  color:#3D8E63;
  font-size:.7rem;
  font-weight:850;
  cursor:pointer;
}

.profile-post-comments article{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  padding:.58rem 0;
}

.profile-post-comments article>span{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:2rem;
  height:2rem;
  border-radius:50%;
  background:#CEEADB;
  color:#2D6949;
  font-size:.7rem;
  font-weight:900;
}

.profile-post-comments article p{
  margin:0!important;
  color:#3A684F!important;
  font-size:.78rem!important;
}

.profile-post-comments article b{
  display:block;
  color:#1F3A2C;
  margin-bottom:.08rem;
}

.profile-post-comments article small{
  display:block;
  margin-top:.16rem;
  color:var(--muted-fg);
  font-size:.62rem;
}

html[data-theme="dark"] .profile-post-detail,
html[data-theme="dark"] .profile-post-info{
  background:#131E18!important;
  border-color:rgba(233,246,239,.14)!important;
}

html[data-theme="dark"] .profile-post-copy h3,
html[data-theme="dark"] .profile-post-metrics strong,
html[data-theme="dark"] .profile-post-extra strong,
html[data-theme="dark"] .profile-post-comments header strong,
html[data-theme="dark"] .profile-post-comments article b{
  color:#F4FAF7!important;
}

html[data-theme="dark"] .profile-post-actions button{
  background:#1C2A23;
  border-color:rgba(233,246,239,.14);
  color:#DDF0E6;
}

html[data-theme="dark"] .profile-post-actions .profile-post-like{
  background:#4BB07A;
  border-color:#4BB07A;
  color:#fff;
}

html[data-theme="dark"] .profile-post-extra>div,
html[data-theme="dark"] .profile-post-extra>div>span,
html[data-theme="dark"] .profile-post-comments article>span{
  background:#1F3027!important;
  border-color:rgba(233,246,239,.12)!important;
}

html[data-theme="dark"] .profile-post-comments article p{
  color:#B7D5C5!important;
}

@media(max-width:800px){
  .profile-post-overlay{
    padding:0!important;
    align-items:flex-end!important;
  }

  .profile-post-detail{
    width:100%!important;
    height:auto!important;
    max-height:94dvh!important;
    grid-template-columns:1fr!important;
    border-radius:22px 22px 0 0!important;
    overflow-y:auto!important;
  }

  .profile-post-media{
    min-height:0!important;
    height:38dvh;
    max-height:390px;
  }

  .profile-post-info{
    overflow:visible!important;
  }

  .profile-post-topbar{
    padding:1rem 1.1rem;
  }

  .profile-post-copy{
    padding:1.25rem 1.15rem .75rem;
  }

  .profile-post-actions{
    padding:.5rem 1.15rem 1rem;
    overflow-x:auto;
  }

  .profile-post-actions button{
    flex:0 0 auto;
  }

  .profile-post-actions button:last-child{
    margin-left:0;
  }

  .profile-post-metrics,
  .profile-post-extra,
  .profile-post-comments{
    margin-left:1.15rem!important;
    margin-right:1.15rem!important;
  }

  .profile-post-extra{
    grid-template-columns:1fr!important;
  }

  .profile-post-media-caption small{
    display:none;
  }
}

/* Accessible notice contrast */
.warning-card{
  display:flex!important;
  align-items:flex-start;
  gap:.8rem;
}

.warning-card-icon{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:2rem;
  height:2rem;
  border-radius:10px;
  background:#82CAA4;
  color:#1A3E2B;
  font-size:.9rem;
  font-weight:950;
}

.warning-card>div{min-width:0}
.warning-card strong{margin-bottom:.22rem!important}
.warning-card p{margin:0!important}

html[data-theme="dark"] .warning-card{
  background:#172B20!important;
  border-color:rgba(130,202,164,.42)!important;
  box-shadow:inset 3px 0 0 #57B784;
}

html[data-theme="dark"] .warning-card strong{color:#BFE3D0!important}
html[data-theme="dark"] .warning-card p{color:#BAE2CD!important}
html[data-theme="dark"] .warning-card-icon{background:#57B784!important;color:#0D1F15!important}

html[data-theme="dark"] .hint-box,
html[data-theme="dark"] .auth-demo-box{
  background:#172538!important;
  border-color:rgba(125,180,235,.38)!important;
  color:#D6EAFF!important;
}

html[data-theme="dark"] .hint-box code,
html[data-theme="dark"] .auth-demo-box code{
  background:#243B55!important;
  color:#EEF7FF!important;
}

html[data-theme="dark"] .alert-error{
  background:#351B1E!important;
  border:1px solid rgba(251,113,133,.38)!important;
  color:#FFD5DC!important;
}

/* Refuge detail — balanced two-column information card */
.caniles-content .canil-detail-drawer{
  width:min(980px,calc(100vw - 2rem))!important;
  max-height:min(88dvh,760px)!important;
  overflow:hidden!important;
}

.canil-detail-hero{
  min-height:118px;
  padding:1.25rem 1.5rem!important;
  padding-right:4rem!important;
  background:
    radial-gradient(circle at 88% 0%,rgba(131,151,85,.16),transparent 16rem),
    linear-gradient(135deg,#F0F8F4,#E2F2E9)!important;
}

.canil-detail-hero .canil-icon--large{
  width:4rem;
  height:4rem;
  border-radius:17px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(75,176,122,.13);
  box-shadow:0 8px 24px rgba(32,76,53,.08);
}

.canil-detail-hero strong{
  font-family:"DM Serif Display",serif;
  font-size:1.55rem!important;
  letter-spacing:-.015em;
}

.canil-detail-layout{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  gap:1.25rem;
  padding:1.35rem;
  overflow-y:auto;
}

.canil-detail-overview{
  min-width:0;
  padding:.2rem .25rem;
}

.canil-detail-eyebrow{
  display:block;
  margin-bottom:.5rem;
  color:#3E9064;
  font-size:.68rem;
  font-weight:950;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.canil-detail-layout .canil-detail-summary{
  margin:0 0 1rem!important;
  color:var(--foreground)!important;
  font-size:.96rem!important;
  line-height:1.65!important;
}

.canil-detail-layout .canil-detail-kpis{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.55rem;
  padding:0!important;
}

.canil-detail-layout .canil-detail-kpis>div{
  display:flex;
  align-items:center;
  gap:.55rem;
  min-width:0;
  padding:.7rem!important;
  border:1px solid rgba(69,120,93,.14)!important;
  border-radius:13px!important;
  background:#F7FCF9!important;
  text-align:left!important;
}

.canil-detail-layout .canil-detail-kpis>div>span{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:1.9rem;
  height:1.9rem;
  margin:0!important;
  border-radius:9px;
  background:#E8EFD8;
  color:#60763B;
  font-size:.74rem;
}

.canil-detail-layout .canil-detail-kpis p{
  min-width:0;
  margin:0!important;
}

.canil-detail-layout .canil-detail-kpis strong,
.canil-detail-layout .canil-detail-kpis small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.canil-detail-layout .canil-detail-kpis strong{
  font-size:.83rem!important;
}

.canil-detail-layout .canil-detail-kpis small{
  margin-top:.12rem;
  color:var(--muted-fg);
  font-size:.61rem;
  font-weight:800;
  text-transform:uppercase;
}

.canil-detail-services-block{
  margin-top:1.2rem;
  padding-top:1rem;
  border-top:1px solid var(--border);
}

.canil-detail-services-block h4{
  margin:0 0 .65rem!important;
  color:var(--foreground);
  font-size:.82rem!important;
}

.canil-detail-services-block .canil-services{
  margin:0!important;
}

.canil-detail-services-block .canil-services span{
  padding:.38rem .65rem;
  background:#EEF4DF!important;
  border-color:#DCE8BF!important;
  color:#526B31!important;
}

.canil-detail-layout .canil-detail-note{
  margin:1.15rem 0 0!important;
  padding:.85rem 1rem!important;
  border:0!important;
  border-left:3px solid #5AB886!important;
  border-radius:0 12px 12px 0!important;
  background:#F2F9F5!important;
}

.canil-detail-layout .canil-detail-note span{
  color:#3E9064;
  font-size:.65rem;
  letter-spacing:.06em;
}

.canil-detail-layout .canil-detail-note p{
  margin:0!important;
  color:#37654C!important;
  font-size:.8rem!important;
  line-height:1.5!important;
}

.canil-detail-side{
  align-self:start;
  min-width:0;
  padding:1rem;
  border:1px solid rgba(69,120,93,.14);
  border-radius:17px;
  background:#FAFDFB;
}

.canil-detail-layout .canil-detail-list{
  display:grid;
  gap:0;
  margin:0!important;
}

.canil-detail-layout .canil-detail-list>div{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
  padding:.78rem .15rem!important;
  border:0!important;
  border-bottom:1px solid rgba(69,120,93,.12)!important;
  border-radius:0!important;
  background:transparent!important;
}

.canil-detail-layout .canil-detail-list>div:first-child{padding-top:.15rem!important}
.canil-detail-layout .canil-detail-list>div:last-child{border-bottom:0!important}

.canil-detail-list-icon{
  flex:0 0 auto;
  display:grid!important;
  place-items:center;
  width:2rem;
  height:2rem;
  margin:0!important;
  border-radius:10px;
  background:#DAEFE4;
  color:#3C8C61!important;
  font-size:.72rem!important;
}

.canil-detail-layout .canil-detail-list p{
  min-width:0;
  margin:0!important;
}

.canil-detail-layout .canil-detail-list small,
.canil-detail-layout .canil-detail-list strong{
  display:block;
}

.canil-detail-layout .canil-detail-list small{
  margin:0 0 .22rem!important;
  color:var(--muted-fg);
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.canil-detail-layout .canil-detail-list strong{
  color:var(--foreground);
  font-size:.8rem!important;
  line-height:1.35;
}

.canil-detail-layout .canil-detail-actions{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:.55rem!important;
  margin:1rem 0 0!important;
  padding:1rem 0 0!important;
  border:0!important;
  border-top:1px solid rgba(69,120,93,.12)!important;
  background:transparent!important;
}

.canil-action-primary{
  display:flex!important;
  align-items:center;
  justify-content:flex-start!important;
  gap:.7rem;
  min-height:3.35rem;
  padding:.65rem .8rem!important;
  text-align:left;
}

.canil-action-primary>span{
  display:grid;
  place-items:center;
  width:2rem;
  height:2rem;
  border-radius:50%;
  background:rgba(255,255,255,.16);
}

.canil-action-primary strong,
.canil-action-primary small{
  display:block;
}

.canil-action-primary small{
  margin-top:.08rem;
  color:rgba(255,255,255,.72);
  font-size:.65rem;
  font-weight:650;
}

.canil-action-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.55rem;
}

.canil-action-row .btn,
.canil-detail-actions>.btn-outline{
  min-height:2.65rem;
  padding:.55rem .65rem!important;
  font-size:.75rem!important;
}

.canil-detail-links{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.25rem .1rem 0;
}

.canil-detail-links a,
.canil-detail-links button{
  border:0;
  background:transparent;
  color:#419769;
  font-size:.68rem;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}

html[data-theme="dark"] .canil-detail-hero{
  background:linear-gradient(135deg,#1A2D23,#17251E)!important;
}

html[data-theme="dark"] .canil-detail-layout .canil-detail-kpis>div,
html[data-theme="dark"] .canil-detail-side{
  background:#17241D!important;
  border-color:rgba(233,246,239,.12)!important;
}

html[data-theme="dark"] .canil-detail-services-block .canil-services span,
html[data-theme="dark"] .canil-detail-layout .canil-detail-kpis>div>span{
  background:#26301F!important;
  border-color:#3A4B2C!important;
  color:#B9D28F!important;
}

html[data-theme="dark"] .canil-detail-layout .canil-detail-note{
  background:#1A2D23!important;
}

html[data-theme="dark"] .canil-detail-layout .canil-detail-note p{
  color:#B7D8C6!important;
}

html[data-theme="dark"] .canil-detail-list-icon{
  background:#1D3327!important;
  color:#8BCDAA!important;
}

@media(max-width:760px){
  .caniles-content .canil-detail-drawer{
    width:100%!important;
    max-height:92dvh!important;
    top:auto!important;
    bottom:0!important;
    transform:translateX(-50%)!important;
    border-radius:22px 22px 0 0!important;
    overflow-y:auto!important;
  }

  .canil-detail-hero{
    min-height:104px;
    padding:1rem!important;
    padding-right:3.8rem!important;
  }

  .canil-detail-layout{
    grid-template-columns:1fr;
    gap:1rem;
    padding:1rem;
    overflow:visible;
  }

  .canil-detail-layout .canil-detail-kpis{
    grid-template-columns:1fr;
  }

  .canil-detail-side{
    padding:.85rem;
  }
}

/* Discover mobile composition: readable copy and collision-free actions */
@media(max-width:768px){
  .tiktok-container{
    min-height:0;
  }

  .tiktok-card{
    position:relative!important;
    border-radius:0!important;
  }

  .tiktok-info{
    width:auto!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    padding:1rem .9rem calc(1.15rem + env(safe-area-inset-bottom))!important;
    gap:.65rem!important;
  }

  .tiktok-info-left{
    margin-right:4.15rem!important;
    padding:1rem 1.05rem .95rem!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:18px!important;
    background:linear-gradient(135deg,rgba(26,60,42,.68),rgba(35,81,56,.48))!important;
    box-shadow:0 14px 36px rgba(8,20,14,.18)!important;
    backdrop-filter:blur(12px)!important;
  }

  .tiktok-author{
    gap:.65rem!important;
    margin-bottom:.75rem!important;
  }

  .tiktok-author>div{
    min-width:0;
  }

  .author-name,
  .author-meta{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .author-name{
    font-size:.82rem!important;
  }

  .author-meta{
    font-size:.66rem!important;
  }

  .author-avatar{
    width:2.55rem!important;
    height:2.55rem!important;
  }

  .btn-follow{
    flex:0 0 auto;
    margin-left:auto;
    padding:.32rem .72rem!important;
    font-size:.7rem!important;
  }

  .tiktok-desc{
    margin:.1rem 0 .55rem!important;
    color:#fff!important;
    font-size:.82rem!important;
    line-height:1.5!important;
    overflow-wrap:anywhere;
  }

  .link-btn--white{
    display:inline-flex;
    margin:-.15rem 0 .4rem;
    padding:0!important;
    font-size:.68rem!important;
  }

  .tiktok-hashtags{
    gap:.25rem .45rem!important;
    line-height:1.25;
  }

  .tiktok-hashtags .hashtag{
    padding:.08rem 0!important;
    font-size:.7rem!important;
  }

  .tiktok-actions{
    position:absolute!important;
    top:auto!important;
    left:auto!important;
    right:1.1rem!important;
    inset-inline-end:1.1rem!important;
    bottom:1.15rem!important;
    transform:none!important;
    gap:.45rem!important;
    width:3.05rem!important;
    max-width:3.05rem!important;
    box-sizing:border-box!important;
    align-items:stretch!important;
    z-index:6!important;
  }

  .tiktok-actions .action-btn{
    flex:0 0 3.05rem!important;
    min-width:3.05rem!important;
    max-width:3.05rem!important;
    width:3.05rem!important;
    height:3.05rem!important;
    padding:0!important;
    box-sizing:border-box!important;
    border-radius:15px!important;
    font-size:1.05rem!important;
  }

  .tiktok-actions .action-btn small{
    max-width:2.8rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.52rem!important;
  }

  .app-shell:has(.tiktok-container) .publish-fab{
    display:none!important;
  }

  .mobile-publish-header{
    flex:0 0 auto;
    width:2.35rem!important;
    height:2.35rem!important;
    border:1px solid rgba(76,177,123,.35)!important;
    border-radius:12px!important;
    background:rgba(76,177,123,.14)!important;
    color:#4CB27C!important;
    font-size:1.25rem!important;
    font-weight:900;
  }

  .mobile-nav{
    padding-bottom:env(safe-area-inset-bottom);
  }
}

@media(max-width:390px){
  .tiktok-info{
    padding-left:.7rem!important;
    padding-right:.7rem!important;
  }

  .tiktok-info-left{
    margin-right:4.05rem!important;
    padding:.85rem!important;
  }

  .tiktok-actions{
    right:.65rem!important;
    inset-inline-end:.65rem!important;
  }

  .tiktok-actions .action-btn{
    width:2.85rem!important;
    height:2.85rem!important;
  }
}

@media(max-width:768px) and (max-height:760px){
  .tiktok-nav-arrows{
    display:none!important;
  }

  .tiktok-actions{
    bottom:1rem!important;
    gap:.35rem!important;
  }

  .tiktok-actions .action-btn{
    width:2.85rem!important;
    height:2.85rem!important;
    border-radius:14px!important;
  }
}

@media(max-width:420px){
  .profile-post-media{
    height:32dvh;
  }

  .profile-post-copy h3{
    font-size:1.65rem!important;
  }

  .profile-post-actions{
    scrollbar-width:none;
  }
}

/* Shared popup language across MiMascota */
.modal-overlay,
.hashtag-item-overlay,
.hashtag-explore-overlay{
  background:rgba(14,25,19,.66)!important;
  backdrop-filter:blur(9px);
}

.modal-sheet{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:22px!important;
  background:var(--card)!important;
  box-shadow:0 28px 90px rgba(12,28,19,.38)!important;
  animation:popupEnter .22s cubic-bezier(.22,.8,.24,1)!important;
}

.modal-sheet--form,
.profile-edit-sheet,
.settings-sheet,
.adoption-request-sheet,
.canil-contact-sheet{
  width:min(620px,calc(100vw - 2rem))!important;
  max-width:620px!important;
}

.modal-header{
  position:sticky;
  top:0;
  z-index:5;
  display:grid!important;
  grid-template-columns:2.4rem minmax(0,1fr) 2.4rem;
  align-items:center;
  gap:.7rem;
  min-height:4.5rem;
  padding:.85rem 1rem!important;
  border-bottom:1px solid rgba(62,111,85,.12)!important;
  background:color-mix(in srgb,var(--card) 94%,transparent)!important;
  backdrop-filter:blur(14px);
}

.modal-header>strong,
.modal-header>span{
  color:var(--foreground);
  font-size:.96rem;
  font-weight:900;
  text-align:center;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.modal-header>.icon-btn:first-child{
  width:2.4rem!important;
  height:2.4rem!important;
  border:1px solid var(--border)!important;
  border-radius:50%!important;
  background:var(--muted)!important;
  color:var(--foreground)!important;
  font-size:1rem;
}

.modal-body{
  padding:1.35rem!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(61,141,98,.38) transparent;
}

.modal-body>.request-intro,
.modal-body>.video-selected-card{
  margin-bottom:1.15rem;
  padding:1rem!important;
  border:1px solid rgba(75,176,122,.18)!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,#F4FAF7,#D9EFE3)!important;
}

.modal-body .form-group label{
  color:var(--foreground);
  font-size:.76rem;
  font-weight:850;
  letter-spacing:.01em;
}

.modal-body .form-group input,
.modal-body .form-group textarea,
.modal-body .form-group select{
  border-radius:12px!important;
  border-color:rgba(62,111,85,.18)!important;
  background:var(--input-bg,var(--card))!important;
  transition:border-color .15s,box-shadow .15s;
}

.modal-body .form-group input:focus,
.modal-body .form-group textarea:focus,
.modal-body .form-group select:focus{
  border-color:#49AC77!important;
  box-shadow:0 0 0 3px rgba(73,172,119,.13)!important;
}

.modal-body>.btn:last-child,
.modal-body>.form-btn-row:last-child{
  margin-top:1.1rem;
}

.settings-sheet .profile-section-card{
  border-radius:16px!important;
  box-shadow:none!important;
  background:var(--surface-soft,var(--muted))!important;
}

.hashtag-item-detail{
  width:min(920px,94vw)!important;
  height:min(620px,88dvh);
  max-height:88dvh!important;
  grid-template-columns:minmax(340px,.95fr) minmax(380px,1.05fr)!important;
  border:1px solid rgba(255,255,255,.72);
  border-radius:24px!important;
  background:var(--card)!important;
  box-shadow:0 30px 95px rgba(11,25,18,.42)!important;
}

.hashtag-item-detail>img{
  min-height:0!important;
  height:100%!important;
  object-fit:cover;
}

.hashtag-item-detail>div{
  justify-content:center!important;
  padding:clamp(1.6rem,4vw,3rem)!important;
}

.hashtag-item-detail>div>span{
  align-self:flex-start;
  padding:.45rem .7rem!important;
  border:1px solid rgba(75,176,122,.2)!important;
  border-radius:999px;
  background:#EDF7F2!important;
  color:#3C8B61!important;
  font-size:.68rem!important;
  letter-spacing:.08em;
}

.hashtag-item-detail h3{
  margin:.85rem 0 .7rem!important;
  color:var(--foreground);
  font-family:"DM Serif Display",serif;
  font-size:clamp(1.8rem,3vw,2.35rem)!important;
  line-height:1.08;
}

.hashtag-item-detail p{
  font-size:.93rem;
  line-height:1.65!important;
}

.hashtag-item-detail>div>strong{
  margin-top:1.2rem;
  padding-top:1rem;
  border-top:1px solid var(--border);
}

.hashtag-explore-sheet{
  border-radius:24px!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 30px 100px rgba(0,0,0,.55)!important;
}

.hashtag-explore-head{
  min-height:4.6rem;
  padding:.8rem 1rem!important;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:rgba(10,13,17,.9);
  backdrop-filter:blur(14px);
}

.hashtag-explore-head .icon-btn{
  width:2.4rem!important;
  height:2.4rem!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
}

.map-detail-backdrop{
  background:rgba(16,30,23,.36)!important;
  backdrop-filter:blur(5px)!important;
}

.map-detail-panel,
.canil-detail-drawer{
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:24px!important;
  background:var(--card)!important;
  box-shadow:0 28px 90px rgba(13,31,21,.34)!important;
  animation:popupEnter .22s cubic-bezier(.22,.8,.24,1);
}

.map-detail-close,
.canil-detail-drawer>.profile-post-close{
  width:2.4rem!important;
  height:2.4rem!important;
  border:1px solid rgba(255,255,255,.28)!important;
  border-radius:50%!important;
  background:rgba(23,42,32,.8)!important;
  color:#fff!important;
  backdrop-filter:blur(10px);
}

html[data-theme="dark"] .modal-header{
  background:rgba(19,30,24,.94)!important;
}

html[data-theme="dark"] .modal-body>.request-intro,
html[data-theme="dark"] .modal-body>.video-selected-card,
html[data-theme="dark"] .hashtag-item-detail>div>span{
  background:#1F3027!important;
  border-color:rgba(233,246,239,.13)!important;
  color:#9AD4B5!important;
}

@keyframes popupEnter{
  from{opacity:0;transform:translateY(10px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(max-width:800px){
  .modal-overlay{
    align-items:flex-end!important;
    padding:0!important;
  }

  .modal-sheet,
  .modal-sheet--form,
  .profile-edit-sheet,
  .settings-sheet,
  .adoption-request-sheet,
  .canil-contact-sheet{
    width:100%!important;
    max-width:none!important;
    max-height:92dvh!important;
    border-radius:22px 22px 0 0!important;
    border-bottom:0!important;
  }

  .hashtag-item-overlay{
    align-items:flex-end!important;
    padding:0!important;
  }

  .hashtag-item-detail{
    width:100%!important;
    height:auto!important;
    max-height:94dvh!important;
    grid-template-columns:1fr!important;
    border-radius:22px 22px 0 0!important;
    overflow-y:auto!important;
  }

  .hashtag-item-detail>img{
    height:36dvh!important;
    max-height:360px;
  }

  .hashtag-item-detail>div{
    padding:1.4rem!important;
  }

  .hashtag-explore-overlay{
    padding:0!important;
  }

  .hashtag-explore-sheet{
    width:100%!important;
    height:94dvh!important;
    border-radius:22px 22px 0 0!important;
    align-self:flex-end;
  }

  .map-detail-panel{
    top:auto!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    height:88dvh;
    border-radius:22px 22px 0 0!important;
  }
}

.location-picker {
    display: grid;
    gap: .65rem;
    margin: .75rem 0 1rem;
}

.location-picker__search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: .55rem;
}

.location-picker__search input { min-width: 0; }

.location-map {
    width: 100%;
    height: 270px;
    border: 1px solid var(--border, #C7DFD2);
    border-radius: 16px;
    overflow: hidden;
    background: #E7EEE4;
    z-index: 0;
}

.location-picker__help { color: var(--text-muted, #5E7468); }
.location-picker__coordinates { color: #166534; font-size: .86rem; font-weight: 700; }
.location-picker__coordinates--pending { color: #b45309; }

@media (max-width: 720px) {
    .location-picker__search { grid-template-columns: 1fr; }
    .location-map { height: 235px; }
}
.insta-stats [role="button"] { cursor: pointer; }
.insta-stats [role="button"]:hover strong { color: var(--primary, #3C8D62); }
.social-network-modal { max-width: 520px; }
.social-network-list { display: grid; gap: .6rem; padding: 1rem; max-height: 65vh; overflow-y: auto; }
.social-network-user { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: .75rem; padding: .7rem; border: 1px solid var(--border, #CAE5D7); border-radius: 14px; }
.social-network-user img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.social-network-user div { display: grid; min-width: 0; }
.social-network-user span, .social-network-user small { color: var(--text-muted, #5E7468); }
.author-name, .community-author-link, .discover-suggestion-card a, .social-network-user a {
    color: inherit;
    text-decoration: none;
}
.author-name:hover, .community-author-link:hover, .discover-suggestion-card a:hover, .social-network-user a:hover {
    color: var(--primary, #3C8D62);
    text-decoration: underline;
}
.content-area:has(.public-user-profile) { overflow-y: auto !important; overscroll-behavior: contain; }
.public-user-profile { width: 100%; max-width: 1040px; height: auto !important; min-height: 100%; margin-inline: auto; overflow: visible !important; }
.public-user-profile .insta-avatar-ring img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.public-profile-notice { color: var(--text-muted, #5E7468); font-size: .86rem; }
.public-profile-tabs { grid-template-columns: 1fr !important; }
.public-profile-post { width: 100%; border: 0; padding: 0; cursor: pointer; text-align: left; font: inherit; color: inherit; }
.public-profile-post > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.public-profile-post-placeholder { display: grid; place-items: center; width: 100%; height: 100%; min-height: 230px; background: #DCEEE4; font-size: 3rem; }
.public-profile-post .insta-post-overlay { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
.public-profile-empty { margin: 4rem auto; max-width: 560px; }
.public-profile-detail-placeholder { display: grid; place-items: center; width: 100%; height: 100%; min-height: 420px; background: linear-gradient(145deg, #D6EDE1, #AAD8BF); color: #306F4D; font-size: 5rem; }
.public-profile-detail-actions { margin-top: auto; }
.public-profile-detail-actions button:last-child { margin-left: auto; }

.adoption-request-sheet .request-consent {
    display: grid !important;
    grid-template-columns: 1.2rem minmax(0, 1fr);
    align-items: start !important;
    gap: .75rem !important;
    padding: .8rem .9rem;
    margin: .75rem 0 .35rem !important;
    border: 1px solid var(--border, #CAE5D7);
    border-radius: 12px;
    background: rgba(246,251,248, .72);
    line-height: 1.45;
    cursor: pointer;
}
.adoption-request-sheet .request-consent input {
    width: 1.1rem;
    height: 1.1rem;
    margin: .12rem 0 0 !important;
    accent-color: var(--primary, #3D8D62);
    cursor: pointer;
}
.request-char-count { display: block; margin-top: .35rem; color: #a34a3d; font-size: .72rem; text-align: right; }
.request-char-count--valid { color: #4F762D; }
.request-field-error { display: block; margin-top: .32rem; color: #b42318; font-size: .75rem; font-weight: 700; }
.request-consent-error { margin: 0 0 .7rem .2rem; }
.request-submit-error { margin: .65rem 0; }
.adoption-request-sheet [aria-invalid="true"] { border-color: #d04a3a !important; box-shadow: 0 0 0 3px rgba(208,74,58, .1) !important; }
.adoption-request-sheet .btn:disabled { opacity: .62; cursor: wait; }
html[data-theme="dark"] .adoption-request-sheet .request-consent { background: #1C2A23; border-color: rgba(233,246,239, .14); }

@media (max-width: 800px) {
    .public-profile-detail-placeholder { min-height: 32dvh; }
    .public-profile-detail-actions { flex-wrap: wrap; }
    .public-profile-detail-actions button:last-child { margin-left: 0; }
}