:root {
  --pine: #173f35;
  --pine-2: #245c4c;
  --moss: #7c9b72;
  --cream: #f5f1e8;
  --paper: #fffdf8;
  --ink: #1f2925;
  --muted: #718078;
  --line: #dedfd7;
  --amber: #d89a42;
  --red: #b9584f;
}

html { scrollbar-gutter: stable; }
body { background: var(--cream); color: var(--ink); font-family: Inter, system-ui, -apple-system, sans-serif; }
a { color: var(--pine-2); }
.navbar-brand { font-family: Georgia, serif; letter-spacing: -.02em; }
.snt-sign { background:linear-gradient(145deg,#1f5b3b,#103b28); color:#fff; border:10px solid #e9dfbf; outline:2px solid #8c7545; border-radius:18px; padding:3rem 2rem; text-align:center; box-shadow:0 24px 55px rgba(18,62,42,.24); transform:rotate(1deg); }
.snt-sign span,.snt-sign small { display:block; text-transform:uppercase; letter-spacing:.12em; opacity:.78; }
.snt-sign strong { display:block; font:700 3.2rem/1.05 Georgia,serif; margin:1rem 0; }
.snt-plan { width:100%; height:auto; object-fit:contain; }
.interactive-map-scroll { overflow:auto; }
.interactive-map-canvas { min-width:1180px; position:relative; width:100%; }
.interactive-map-canvas > img { display:block; height:auto; width:100%; }
.map-hotspot,.map-hotspot-wrap { position:absolute; transform:translate(-50%,-50%); z-index:2; }
.map-hotspot { align-items:center; background:#176344; border:2px solid #fff; border-radius:50%; box-shadow:0 2px 8px rgba(0,0,0,.28); color:#fff; display:flex; font-size:.68rem; font-weight:800; height:28px; justify-content:center; line-height:1; min-width:28px; padding:0 4px; text-decoration:none; }
.map-hotspot:hover,.map-hotspot:focus { background:#0d422d; color:#fff; transform:translate(-50%,-50%) scale(1.15); z-index:4; }
.map-hotspot-wrap .map-hotspot { position:static; transform:none; }
.map-hotspot-wrap .map-hotspot:hover,.map-hotspot-wrap .map-hotspot:focus { transform:scale(1.15); }
.map-hotspot-status-active { background:#176344; }
.map-hotspot-status-debt { background:#b9463e; }
.map-hotspot-status-empty { background:#727b77; }
.map-hotspot-status-mixed { background:#c27a16; }
.map-hotspot.map-hotspot-selected { background:#7c3aed!important; border-color:#f3e8ff; box-shadow:0 0 0 5px rgba(124,58,237,.24),0 10px 28px rgba(76,29,149,.58); color:#fff; z-index:8; }
.btn-map-purple { background:#7c3aed; border-color:#7c3aed; color:#fff; box-shadow:0 4px 12px rgba(76,29,149,.22); }
.btn-map-purple:hover,.btn-map-purple:focus { background:#6d28d9; border-color:#6d28d9; color:#fff; box-shadow:0 5px 16px rgba(76,29,149,.34); }
.dashboard-problems > summary { cursor:pointer; list-style:none; }
.dashboard-problems > summary::-webkit-details-marker { display:none; }
.dashboard-problems-chevron { transition:transform .2s ease; }
.dashboard-problems[open] .dashboard-problems-chevron { transform:rotate(180deg); }
.map-hotspot-preview { background:#d13b31; pointer-events:none; z-index:5; }
.map-legend-dot { border:2px solid #fff; border-radius:50%; box-shadow:0 1px 4px rgba(0,0,0,.25); display:inline-block; height:14px; width:14px; }
.map-legend-active { background:#176344; }.map-legend-debt { background:#b9463e; }.map-legend-empty { background:#727b77; }.map-legend-mixed { background:#c27a16; }
.backup-delete-confirm { position:absolute; right:2rem; z-index:20; width:min(420px,80vw); box-shadow:0 12px 30px rgba(0,0,0,.15); }
.tariff-warning { color:#713b00; background:#fff0d6; border:1px solid #f0a33a; }
.calculation-breakdown { min-height:8.5rem; line-height:1.55; background:#f7f8f4 !important; }
.electricity-tabs { gap:.5rem; padding:.4rem; background:#ecefe8; border-radius:14px; width:max-content; max-width:100%; overflow-x:auto; flex-wrap:nowrap; }
.electricity-tabs .nav-link { color:#294d39; white-space:nowrap; border-radius:10px; }
.electricity-tabs .nav-link.active { background:#245c3e; color:#fff; }
.charge-badge { color:#713b00; background:#ffc56f; }
.tariff-base-badge { color:#713b00; background:#ffd18b; border:1px solid #e8a84d; }
.plot-quick-actions .btn { align-items:center; display:inline-flex; height:32px; justify-content:center; }
.plot-status-form .form-select, .plot-status-form .btn { height:31px; line-height:1.2; }
.plot-status-form .form-select { width:auto; min-width:145px; padding-top:.25rem; padding-bottom:.25rem; }
.comment-actions .btn { align-items:center; display:inline-flex; height:28px; }
.d-flex.gap-2.mt-1 > a.small, .d-flex.gap-2.mt-1 > form, .d-flex.gap-2.mt-1 > form .btn { align-items:center; display:inline-flex; height:28px; margin:0; }
.search-toolbar .form-control, .search-toolbar .form-select, .search-toolbar .btn { height:48px; }
.search-toolbar .btn { align-items:center; display:inline-flex; justify-content:center; }
.map-upload-control .form-control, .map-upload-control .map-upload-button { height:48px; }
.public-nav { background: rgba(245, 241, 232, .96); border-bottom: 1px solid rgba(23, 63, 53, .12); }
.public-nav .nav-link { border-radius:10px; padding-left:.75rem; padding-right:.75rem; }
.public-nav .nav-link.active { background:rgba(36,92,76,.12); color:var(--pine); font-weight:700; }
.public-page { min-height:calc(100vh - 178px); padding:5rem 0; }
.public-page-header { margin-bottom:3rem; }
.public-page-title { font-family:Georgia,serif; font-size:clamp(2.25rem,5vw,3.5rem); line-height:1.08; margin:0 0 .65rem; }
.public-page-subtitle { color:var(--muted); margin:0; max-width:48rem; }
.public-article { max-width:880px; }
.error-code { color:var(--pine-2); font-family:Georgia,serif; font-size:clamp(5rem,16vw,9rem); font-weight:700; letter-spacing:-.06em; line-height:.9; margin-bottom:1.5rem; }
.btn-pine { background: var(--pine); color: #fff; border-color: var(--pine); }
.btn-pine:hover { background: #0e3028; color: #fff; }
.btn-soft { background: #e8ece4; color: var(--pine); border: 0; }
.btn-soft:hover { background: #dbe3d7; color: var(--pine); }
.eyebrow { color: var(--pine-2); font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.display-title { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.7rem, 6vw, 5.8rem); letter-spacing: -.045em; line-height: .97; }
.hero { min-height: 670px; padding: 8rem 0 5rem; overflow: hidden; position: relative; }
.hero::after { background: var(--pine); border-radius: 51% 49% 47% 53%; content: ''; height: 540px; position: absolute; right: -100px; top: 70px; transform: rotate(-7deg); width: 560px; z-index: -1; }
.hero-plot { background: var(--paper); border: 8px solid rgba(255,255,255,.2); border-radius: 32px; box-shadow: 0 24px 70px rgba(15, 43, 35, .25); margin-left: auto; max-width: 440px; overflow: hidden; transform: rotate(2deg); }
.hero-map { background: #dce6d2; display: grid; gap: 5px; grid-template-columns: repeat(4, 1fr); height: 350px; padding: 28px; }
.mini-plot { align-items: center; background: #91ad7c; border: 2px solid #fff; color: #274336; display: flex; font-size: .72rem; font-weight: 800; justify-content: center; min-height: 62px; }
.mini-plot:nth-child(3n) { background: #c6d1a4; }
.mini-plot:nth-child(4n) { background: #e7be78; }
.section-pad { padding: 5rem 0; }
.feature-card, .panel-card { background: var(--paper); border: 1px solid var(--line); border-radius: 18px; }
.feature-card { height: 100%; padding: 1.6rem; }
.feature-icon { align-items: center; background: #e3eadf; border-radius: 13px; color: var(--pine); display: flex; font-size: 1.25rem; height: 46px; justify-content: center; width: 46px; }
.news-card { border-top: 1px solid var(--line); padding: 1.5rem 0; }
.news-card:last-child { border-bottom: 1px solid var(--line); }
.app-shell { display: flex; min-height: 100vh; }
.sidebar { background: var(--pine); color: #dce7e1; display:flex; flex: 0 0 300px; flex-direction:column; padding: 1.5rem 1rem; position: sticky; top: 0; height: 100vh; overflow-y:auto; }
.sidebar-brand { color: #fff; display: block; font-family: Georgia, serif; font-size: 1.35rem; padding: .6rem .75rem 1.8rem; text-decoration: none; }
.sidebar nav { flex:1 0 auto; }
.sidebar-version { color:rgba(220,231,225,.55); font-size:.7rem; letter-spacing:.04em; padding:1.5rem .75rem .25rem; }
.brand-tree { height:30px; margin-right:.55rem; vertical-align:middle; width:30px; }
.charge-brand { align-items:center; color:var(--pine); display:flex; font-family:Georgia,serif; font-size:1.05rem; margin-bottom:.35rem; }
.charge-brand .brand-tree { display:none; }
.charge-brand::before { color:var(--pine-2); content:"\f5e2"; font-family:"bootstrap-icons"!important; font-size:1.25rem; font-style:normal; font-weight:400!important; margin-right:.5rem; }
.sidebar .nav-link { border-radius: 10px; color: #bcd0c8; margin-bottom: .25rem; padding: .68rem .75rem; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: rgba(255,255,255,.1); color: #fff; }
.sidebar .nav-link i { margin-right: .7rem; width: 1.2rem; }
.app-main { flex: 1; min-width: 0; }
.app-topbar { align-items: center; background: rgba(245,241,232,.94); border-bottom: 1px solid var(--line); display: flex; height: 72px; justify-content: space-between; padding: 0 2rem; position: sticky; top: 0; z-index: 10; }
.app-content { padding: 2rem; }
.page-title { font-family: Georgia, serif; font-size: 2.15rem; letter-spacing: -.03em; }
.metric-card { background: var(--paper); border: 1px solid var(--line); border-radius: 16px; min-height: 150px; padding: 1.35rem; position: relative; }
.metric-card .metric { font-family: Georgia, serif; font-size: 2.2rem; }
.metric-card i { color: var(--moss); font-size: 1.4rem; position: absolute; right: 1.25rem; top: 1.3rem; }
.table-card { background: var(--paper); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.table-card .table { margin: 0; }
.table-card th { background: #f2f2eb; color: var(--muted); font-size: .73rem; letter-spacing: .06em; padding: .8rem 1rem; text-transform: uppercase; }
.table-card td { border-color: #ecece5; padding: .95rem 1rem; vertical-align: middle; }
.status-dot { border-radius: 50%; display: inline-block; height: 8px; margin-right: 7px; width: 8px; }
.status-active { background: #5e9b72; }.status-debt { background: var(--red); }.status-empty { background: #a3aaa5; }
.balance-negative { color: var(--red); }.balance-positive { color: #438157; }
.plot-map { background: #dbe4ce; border: 10px solid #fff; border-radius: 24px; box-shadow: 0 18px 50px rgba(23,63,53,.13); display: grid; gap: 8px; grid-template-columns: repeat(6, 1fr); padding: 28px; }
.plot-tile { align-items: center; aspect-ratio: 1.2; background: #95b17e; border: 2px solid rgba(255,255,255,.85); color: #173f35; display: flex; flex-direction: column; font-size: .72rem; font-weight: 700; justify-content: center; text-decoration: none; transition: .18s ease; }
.plot-tile:hover { color: #173f35; transform: translateY(-3px); }
.plot-tile.debt { background: #dfae72; }.plot-tile.empty { background: #b9c1ad; }
.form-card { background: var(--paper); border: 1px solid var(--line); border-radius: 20px; max-width: 780px; padding: 2rem; }
.form-label { font-size: .82rem; font-weight: 700; }
.form-label + .form-check-input { margin-left:.55rem; }
.form-control, .form-select { border-color: #d8dbd3; padding: .7rem .8rem; }
.form-control:focus, .form-select:focus { border-color: var(--moss); box-shadow: 0 0 0 .2rem rgba(124,155,114,.18); }
.localized-file-input { align-items:center; border:1px solid #d8dbd3; border-radius:.375rem; display:flex; min-height:48px; overflow:hidden; width:100%; }
.localized-file-button { align-items:center; align-self:stretch; border-radius:0; display:inline-flex; flex:0 0 auto; margin:0; }
.localized-file-status { color:var(--muted); min-width:0; overflow:hidden; padding:0 .8rem; text-overflow:ellipsis; white-space:nowrap; }
.localized-file-native { height:1px!important; left:-10000px!important; opacity:0!important; overflow:hidden!important; padding:0!important; position:absolute!important; width:1px!important; }
.detail-hero { background: var(--pine); border-radius: 20px; color: white; padding: 2rem; }
.detail-hero .muted { color: #bcd0c8; }
.empty-state { color: var(--muted); padding: 3.5rem 1rem; text-align: center; }
.pagination { --bs-pagination-color: var(--pine-2); --bs-pagination-hover-color: var(--pine); --bs-pagination-hover-bg: #e3eadf; --bs-pagination-focus-color: var(--pine); --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(36,92,76,.18); --bs-pagination-active-bg: var(--pine); --bs-pagination-active-border-color: var(--pine); }
.page-link { border-color: #cfd8d1; }
.page-size-select { min-width: 88px; padding-left: .7rem; padding-right: 2.25rem; }
.plot-tile small { font-size: .55rem; font-weight: 500; margin-top: .25rem; opacity: .8; }
.meter-card-good { border-left: 4px solid var(--moss); }
.meter-card-warning { border-left: 4px solid var(--amber); }
.meter-card-danger { border-left: 4px solid var(--red); }
.meter-status { border-radius: 999px; display: inline-block; font-size: .7rem; font-weight: 700; padding: .28rem .55rem; white-space: nowrap; }
.meter-status-available { background: #e1eee4; color: #347047; }
.meter-status-inside_house, .meter-status-inaccessible { background: #f7e7d2; color: #8b5b1d; }
.meter-attention { border-left: 5px solid var(--amber); }
.meter-empty-warning { background: #fff1df; border-radius: 10px; color: #85561d; font-size: .84rem; padding: .8rem; }
.electricity-state { border-radius: 999px; font-size: .6rem; margin-left: .3rem; padding: .15rem .35rem; }
.electricity-state-unknown { background: #e9ece9; color: #657169; }
.electricity-state-no_meter { background: #f7dfd9; color: #94483e; }
.electricity-state-not_connected { background: #f7e7d2; color: #8b5b1d; }
.electricity-state-no_plot { background: #e3e4e3; color: #555d58; }
.plot-entry-image { border: 1px solid var(--line); border-radius: 12px; display: block; max-height: 280px; max-width: 100%; object-fit: cover; }
.footer { border-top: 1px solid var(--line); padding: 2.5rem 0; }
@media (max-width: 991px) {
  .hero::after { opacity: .15; right: -250px; }
  .hero-plot { margin: 3rem auto 0; }
  .sidebar { display: none; }
  .app-content { padding: 1rem; }
  .plot-map { grid-template-columns: repeat(3, 1fr); padding: 14px; }
}
@media print { .sidebar,.app-topbar,.no-print { display:none!important; }.app-content{padding:0}.app-shell{display:block}body{background:white} }