:root{
  color-scheme:dark;
  --bg:#06111d;--panel:#081a2c;--card:#0b2842;--card2:#0a2238;
  --border:#0f6093;--text:#f6f9fc;--muted:#91a7bb;
  --cyan:#23d9ef;--cyan2:#55e7f5;--red:#ff3448;--nav:#061727;
}
*{box-sizing:border-box}
html,body{margin:0;background:linear-gradient(180deg,#051323,#06111d 100%);color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{min-height:100vh}
button{font:inherit;-webkit-tap-highlight-color:transparent}
#app{max-width:900px;margin:0 auto;min-height:100vh;padding-bottom:88px}
.topbar{display:flex;align-items:center;padding:18px 18px 12px;background:#061727}
.brand{display:flex;gap:11px;align-items:center}.brand-icon{width:50px;height:50px;border-radius:14px}
.brand-name{font-size:22px;font-weight:760;line-height:1.05}.brand-sub{font-size:13px;color:#b6c6d4;margin-top:3px}
main{padding:0 14px 20px}.view{display:none}.view.active{display:block}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.hotel-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:10px 0 9px}
.hotel-tab{min-width:0;height:66px;padding:7px 8px;border-radius:15px;border:1px solid #155c8d;background:#0a2036;color:#e8eef5;
  display:flex;align-items:center;justify-content:center;gap:7px;line-height:1.05}
.hotel-tab svg{width:26px;height:26px;flex:0 0 26px;fill:currentColor}
.hotel-tab span{font-size:12px;font-weight:580;white-space:normal;text-align:left}
.hotel-tab.active{border-color:var(--cyan);box-shadow:0 0 0 1px rgba(35,217,239,.5),0 0 16px rgba(35,217,239,.28);color:var(--cyan2);background:#0b2b45}
.hotel-tab:active{transform:scale(.985)}

.hotel-hero{margin:0;border-radius:17px;overflow:hidden;border:1px solid rgba(21,96,141,.8);background:#081c2f}
.hotel-hero img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}

.control-section{padding:18px 0 2px}.control-section h2{font-size:24px;line-height:1.15;margin:0 0 14px;font-weight:780}
.module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.module-card{position:relative;min-width:0;min-height:142px;padding:16px 42px 13px 16px;border-radius:18px;border:1px solid #0e6097;
  background:linear-gradient(145deg,#0b2b48,#09213a);color:var(--text);display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;text-align:left}
.module-icon{width:50px;height:50px;border:2px solid var(--cyan);border-radius:14px;display:grid;place-items:center;
  color:var(--cyan2);box-shadow:inset 0 0 14px rgba(35,217,239,.12),0 0 14px rgba(35,217,239,.18)}
.module-icon svg{width:29px;height:29px;fill:currentColor}
.module-label{font-size:17px;margin-top:10px;white-space:nowrap}
.chevron{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:39px;line-height:1;color:var(--cyan)}
.incident-card{border-color:#a12838;background:linear-gradient(145deg,#2b1220,#111f32)}
.module-icon.incident{border-color:var(--red);color:var(--red);box-shadow:inset 0 0 18px rgba(255,52,72,.18),0 0 17px rgba(255,52,72,.25)}
.incident-arrow{color:var(--red)}
.module-card:active{transform:scale(.985)}

.card{background:linear-gradient(180deg,#102437,#0b1b2b);border:1px solid #20394f;border-radius:18px;padding:15px}
.eyebrow{font-size:11px;letter-spacing:.13em;color:var(--muted);font-weight:700;margin-top:18px}
h1{font-size:28px;margin:6px 0 15px}h2{font-size:18px}.section{margin-top:22px}.muted{color:var(--muted);font-size:13px}
.row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;font-size:14px}.row+.row{border-top:1px solid #20394f}.row strong{text-align:right}
.stack{display:flex;flex-direction:column;gap:10px}.device{padding:14px;border-radius:18px;border:1px solid #20394f;background:#102437}
.device-head{display:flex;justify-content:space-between;gap:8px}.device-name{font-weight:700}.status-dot{font-size:12px;color:#44d17a}

.banner{margin:10px 0;padding:11px 13px;border-radius:14px;background:#273d19;color:#d7f7c5;font-size:13px}.hidden{display:none!important}
.toast{position:fixed;z-index:50;left:50%;bottom:100px;transform:translateX(-50%);max-width:calc(100vw - 40px);
  background:#0c263d;border:1px solid #23618b;color:#f4f8fb;padding:11px 14px;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.35);font-size:13px}

.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:20;max-width:900px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);
  padding:7px 10px max(7px,env(safe-area-inset-bottom));background:rgba(6,23,39,.98);border-top:1px solid #174363}
.nav-item{min-height:62px;background:transparent;border:0;color:#91a7bb;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.nav-item svg{width:25px;height:25px;fill:currentColor}.nav-item small{font-size:11px}.nav-item.active{color:var(--cyan)}
.nav-item.active::after{content:"";width:45px;height:3px;border-radius:3px;background:var(--cyan);margin-top:3px}
@media(min-width:700px){
  .topbar{padding-inline:24px}.hotel-tab span{font-size:14px}.module-grid{grid-template-columns:repeat(3,1fr)}
  .module-card{min-height:150px}
}
@media(max-width:365px){
  .brand-name{font-size:20px}.hotel-tab{height:62px;padding-inline:5px}.hotel-tab span{font-size:10px}.hotel-tab svg{width:22px;height:22px;flex-basis:22px}
  .module-icon{width:46px;height:46px}.module-icon svg{width:27px;height:27px}.module-label{font-size:15px}
}

/* HC-COMPACT-CONTROL-v0.2.3 START */
/* Scope intentionally limited to the six cards below Control del hotel. */
.control-section .module-grid{
  gap:8px;
}

.control-section .module-card{
  min-height:108px;
  padding:11px 34px 10px 12px;
  border-radius:15px;
}

.control-section .module-icon{
  width:48px;
  height:48px;
  border-width:2px;
  border-radius:13px;
}

.control-section .module-icon svg{
  width:28px;
  height:28px;
}

.control-section .module-label{
  font-size:15px;
  margin-top:7px;
}

.control-section .chevron{
  right:12px;
  font-size:31px;
}

@media(max-width:365px){
  .control-section .module-card{
    min-height:102px;
    padding:10px 31px 9px 11px;
  }

  .control-section .module-icon{
    width:44px;
    height:44px;
    border-radius:12px;
  }

  .control-section .module-icon svg{
    width:26px;
    height:26px;
  }

  .control-section .module-label{
    font-size:14px;
    margin-top:6px;
  }

  .control-section .chevron{
    right:10px;
    font-size:29px;
  }
}
/* HC-COMPACT-CONTROL-v0.2.3 END */

/* HC-WAREHOUSE-v0.2.4 START */
.warehouse-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.back-button{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:13px;
  border:1px solid #155c8d;
  background:#0a2036;
  color:var(--cyan2);
  display:grid;
  place-items:center;
  font-size:25px;
  line-height:1;
}

.warehouse-title-block{
  min-width:0;
}

.warehouse-title-block h1{
  margin:3px 0 3px;
  font-size:28px;
}

.warehouse-hotel-name{
  color:var(--cyan2);
  font-size:14px;
  font-weight:650;
}

.warehouse-menu{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:14px;
}

.warehouse-option{
  width:100%;
  min-height:78px;
  padding:11px 12px;
  border-radius:16px;
  border:1px solid #155c8d;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  color:var(--text);
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  text-align:left;
}

.warehouse-option:active{
  transform:scale(.99);
}

.warehouse-option-icon{
  width:44px;
  height:44px;
  border:2px solid var(--cyan);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan2);
}

.warehouse-option-icon svg{
  width:25px;
  height:25px;
  fill:currentColor;
}

.warehouse-option-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.warehouse-option-copy strong{
  font-size:16px;
  line-height:1.15;
}

.warehouse-option-copy small{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

.warehouse-option-arrow{
  color:var(--cyan);
  font-size:30px;
  line-height:1;
  text-align:right;
}

.warehouse-readonly-note{
  margin-top:16px;
  padding:12px 13px;
  border-radius:14px;
  border:1px solid #294a63;
  background:#0a1c2d;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.warehouse-readonly-note strong{
  color:#c5d4df;
  font-size:12px;
}

.warehouse-readonly-note span{
  color:var(--muted);
  font-size:11px;
}
/* HC-WAREHOUSE-v0.2.4 END */

/* HC-INVENTORY-v0.2.5 START */
.inventory-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.inventory-title-block{
  min-width:0;
}

.inventory-title-block h1{
  margin:3px 0 3px;
  font-size:28px;
}

.inventory-menu{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:14px;
}

.inventory-category{
  width:100%;
  min-height:78px;
  padding:11px 12px;
  border-radius:16px;
  border:1px solid #155c8d;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  color:var(--text);
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  text-align:left;
}

.inventory-category:active{
  transform:scale(.99);
}

.inventory-category-icon{
  width:44px;
  height:44px;
  border:2px solid var(--cyan);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan2);
}

.inventory-category-icon svg{
  width:25px;
  height:25px;
  fill:currentColor;
}

.inventory-category-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.inventory-category-copy strong{
  font-size:16px;
  line-height:1.15;
}

.inventory-category-copy small{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

.inventory-category-arrow{
  color:var(--cyan);
  font-size:30px;
  line-height:1;
  text-align:right;
}
/* HC-INVENTORY-v0.2.5 END */

/* HC-STOCK-DEMO-v0.2.6 START */
.inventory-stock-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.inventory-stock-title-block{
  min-width:0;
}

.inventory-stock-title-block h1{
  margin:3px 0 3px;
  font-size:27px;
}

.inventory-stock-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin:12px 0 10px;
}

.inventory-stock-summary > div{
  border:1px solid #155c8d;
  border-radius:14px;
  background:#0a2036;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.inventory-stock-summary strong{
  color:var(--cyan2);
  font-size:21px;
}

.inventory-stock-summary span{
  color:var(--muted);
  font-size:11px;
}

.inventory-demo-banner{
  border:1px solid #675928;
  background:#2b2816;
  border-radius:13px;
  padding:10px 12px;
  margin-bottom:11px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.inventory-demo-banner strong{
  color:#f5d66d;
  font-size:12px;
}

.inventory-demo-banner span{
  color:#d3c792;
  font-size:11px;
  line-height:1.3;
}

.inventory-stock-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.stock-row{
  width:100%;
  min-height:55px;
  padding:9px 11px;
  border-radius:13px;
  border:1px solid #184b6e;
  background:linear-gradient(145deg,#0a243c,#081e32);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}

.stock-product{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
}

.stock-index{
  width:25px;
  height:25px;
  flex:0 0 25px;
  border-radius:8px;
  background:#0d3552;
  color:var(--cyan2);
  display:grid;
  place-items:center;
  font-size:10px;
  font-weight:700;
}

.stock-name{
  color:var(--text);
  font-size:14px;
  line-height:1.2;
}

.stock-qty{
  min-width:63px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid #1f6e8f;
  background:#0c3248;
  color:#bdf5ff;
  font-size:13px;
  font-weight:750;
  text-align:center;
  white-space:nowrap;
}

.stock-qty.low{
  border-color:#9e7728;
  background:#352a12;
  color:#ffd66b;
}

.stock-qty.out{
  border-color:#b63545;
  background:#3a1720;
  color:#ff7785;
}
/* HC-STOCK-DEMO-v0.2.6 END */

/* HC-INCIDENTS-v0.2.7 START */
.incident-card{
  overflow:visible;
}

.incident-count-badge{
  position:absolute;
  top:9px;
  right:9px;
  min-width:24px;
  height:24px;
  padding:0 6px;
  border-radius:999px;
  background:#ff263c;
  color:#fff;
  border:2px solid #7e1521;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:850;
  line-height:1;
  box-shadow:0 0 12px rgba(255,38,60,.42);
  z-index:3;
}

.incident-count-badge.hidden-count{
  display:none;
}

.incident-card.has-incidents{
  animation:incidentCardPulse 3.2s ease-in-out infinite;
}

.incident-card.has-incidents .module-icon.incident{
  animation:incidentIconPulse 3.2s ease-in-out infinite;
}

@keyframes incidentCardPulse{
  0%,100%{
    border-color:#a12838;
    box-shadow:0 0 0 rgba(255,52,72,0);
    background:linear-gradient(145deg,#2b1220,#111f32);
  }
  50%{
    border-color:#ff4255;
    box-shadow:0 0 20px rgba(255,52,72,.34), inset 0 0 14px rgba(255,52,72,.08);
    background:linear-gradient(145deg,#3b1724,#14243a);
  }
}

@keyframes incidentIconPulse{
  0%,100%{
    color:#ff3448;
    border-color:#ff3448;
    box-shadow:inset 0 0 18px rgba(255,52,72,.18),0 0 17px rgba(255,52,72,.25);
    filter:brightness(1);
  }
  50%{
    color:#ff6b79;
    border-color:#ff6170;
    box-shadow:inset 0 0 20px rgba(255,52,72,.28),0 0 25px rgba(255,52,72,.55);
    filter:brightness(1.24);
  }
}

.incidents-head{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:start;
  gap:12px;
  padding:16px 0 8px;
}

.incidents-title-block{
  min-width:0;
}

.incidents-title-block h1{
  margin:3px 0 3px;
  font-size:28px;
}

.incidents-total-badge{
  min-width:34px;
  height:34px;
  padding:0 9px;
  border-radius:999px;
  background:#ff263c;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:15px;
  font-weight:850;
  margin-top:15px;
  box-shadow:0 0 15px rgba(255,38,60,.35);
}

.incidents-demo-banner{
  border:1px solid #675928;
  background:#2b2816;
  border-radius:13px;
  padding:10px 12px;
  margin:11px 0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.incidents-demo-banner strong{
  color:#f5d66d;
  font-size:12px;
}

.incidents-demo-banner span{
  color:#d3c792;
  font-size:11px;
  line-height:1.3;
}

.incidents-list{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.incident-row{
  border:1px solid #8f3040;
  border-radius:15px;
  background:linear-gradient(145deg,#251521,#111f31);
  padding:12px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:10px;
  align-items:start;
}

.incident-row-icon{
  width:36px;
  height:36px;
  border-radius:11px;
  border:2px solid #ff4255;
  color:#ff5d6d;
  display:grid;
  place-items:center;
  box-shadow:0 0 13px rgba(255,52,72,.24);
}

.incident-row-icon svg{
  width:21px;
  height:21px;
  fill:currentColor;
}

.incident-row-copy{
  min-width:0;
}

.incident-row-title{
  font-size:15px;
  font-weight:750;
  line-height:1.2;
  margin-bottom:5px;
}

.incident-row-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px 10px;
  color:var(--muted);
  font-size:11px;
}

.incident-row-severity{
  color:#ff7c89;
  font-weight:700;
}

@media(prefers-reduced-motion:reduce){
  .incident-card.has-incidents,
  .incident-card.has-incidents .module-icon.incident{
    animation:none;
  }
}
/* HC-INCIDENTS-v0.2.7 END */

/* HC-CHECKLIST-v0.2.8 START */
.checklist-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.checklist-title-block{
  min-width:0;
}

.checklist-title-block h1{
  margin:3px 0 3px;
  font-size:26px;
  line-height:1.12;
}

.checklist-demo-banner{
  border:1px solid #675928;
  background:#2b2816;
  border-radius:13px;
  padding:10px 12px;
  margin:11px 0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.checklist-demo-banner strong{
  color:#f5d66d;
  font-size:12px;
}

.checklist-demo-banner span{
  color:#d3c792;
  font-size:11px;
  line-height:1.3;
}

.checklist-folders{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:13px;
}

.checklist-folder{
  width:100%;
  min-height:82px;
  padding:11px 12px;
  border-radius:16px;
  border:1px solid #155c8d;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  color:var(--text);
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  text-align:left;
}

.checklist-folder-icon{
  width:44px;
  height:44px;
  border:2px solid var(--cyan);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan2);
}

.checklist-folder-icon svg{
  width:25px;
  height:25px;
  fill:currentColor;
}

.checklist-folder-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.checklist-folder-copy strong{
  font-size:15px;
  line-height:1.18;
}

.checklist-folder-copy small{
  color:var(--muted);
  font-size:11px;
  line-height:1.25;
}

.checklist-folder-arrow{
  color:var(--cyan);
  font-size:30px;
}

.checklist-progress-card{
  border:1px solid #155c8d;
  border-radius:15px;
  background:#0a2036;
  padding:11px 12px;
  margin:12px 0 10px;
}

.checklist-progress-card > div:first-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.checklist-progress-card strong{
  color:var(--cyan2);
  font-size:20px;
}

.checklist-progress-card span{
  color:var(--muted);
  font-size:11px;
}

.checklist-progress-track{
  height:6px;
  background:#081725;
  border-radius:99px;
  margin-top:9px;
  overflow:hidden;
}

.checklist-progress-track span{
  display:block;
  width:0%;
  height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,#159dd0,#23d9ef);
  transition:width .18s ease;
}

.room-check-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.room-check-row{
  min-height:56px;
  border:1px solid #184b6e;
  border-radius:13px;
  background:linear-gradient(145deg,#0a243c,#081e32);
  padding:9px 11px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  align-items:center;
  gap:10px;
}

.room-check-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.room-check-copy strong{
  font-size:14px;
}

.room-check-copy small{
  color:var(--muted);
  font-size:11px;
}

.hc-check{
  appearance:none;
  -webkit-appearance:none;
  width:28px;
  height:28px;
  border-radius:8px;
  border:2px solid #247ba4;
  background:#081725;
  display:grid;
  place-items:center;
  cursor:pointer;
}

.hc-check:checked{
  background:#19b8cf;
  border-color:#41e1ee;
}

.hc-check:checked::after{
  content:"";
  width:10px;
  height:6px;
  border-left:3px solid #03101b;
  border-bottom:3px solid #03101b;
  transform:rotate(-45deg) translateY(-1px);
}

.technical-room-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.technical-room-card{
  border:1px solid #184b6e;
  border-radius:15px;
  background:linear-gradient(145deg,#0a243c,#081e32);
  overflow:hidden;
}

.technical-room-header{
  padding:11px 12px;
  background:#0b2a43;
  border-bottom:1px solid #184b6e;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.technical-room-header strong{
  font-size:15px;
}

.technical-room-room-progress{
  color:var(--cyan2);
  font-size:11px;
  font-weight:700;
}

.technical-checks{
  display:flex;
  flex-direction:column;
}

.technical-check-row{
  min-height:52px;
  padding:8px 11px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 31px;
  align-items:center;
  gap:10px;
}

.technical-check-row + .technical-check-row{
  border-top:1px solid rgba(24,75,110,.55);
}

.technical-check-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.technical-check-group{
  color:var(--cyan2);
  font-size:9px;
  letter-spacing:.08em;
  font-weight:750;
  text-transform:uppercase;
}

.technical-check-name{
  font-size:12px;
  line-height:1.25;
}
/* HC-CHECKLIST-v0.2.8 END */

/* HC-MAINTENANCE-DOCS-v0.2.9 START */
.maintenance-head,
.maintenance-pdf-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.maintenance-title-block,
.maintenance-pdf-title-block{
  min-width:0;
}

.maintenance-title-block h1,
.maintenance-pdf-title-block h1{
  margin:3px 0 3px;
  font-size:26px;
  line-height:1.12;
}

.maintenance-library-intro{
  border:1px solid #155c8d;
  border-radius:14px;
  background:#0a2036;
  padding:10px 12px;
  margin:10px 0 13px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.maintenance-library-intro strong{
  color:var(--cyan2);
  font-size:13px;
}

.maintenance-library-intro span{
  color:var(--muted);
  font-size:11px;
}

.maintenance-folders{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.maintenance-folder{
  width:100%;
  min-height:82px;
  padding:11px 12px;
  border-radius:16px;
  border:1px solid #155c8d;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  color:var(--text);
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  text-align:left;
}

.maintenance-folder-icon{
  width:44px;
  height:44px;
  border:2px solid var(--cyan);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan2);
}

.maintenance-folder-icon svg{
  width:25px;
  height:25px;
  fill:currentColor;
}

.maintenance-folder-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.maintenance-folder-copy strong{
  font-size:15px;
  line-height:1.18;
}

.maintenance-folder-copy small{
  color:var(--muted);
  font-size:11px;
  line-height:1.28;
}

.maintenance-folder-arrow{
  color:var(--cyan);
  font-size:30px;
}

.maintenance-document-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}

.maintenance-document-card{
  border:1px solid #155c8d;
  border-radius:16px;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  padding:12px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}

.maintenance-document-icon{
  width:40px;
  height:46px;
  border-radius:9px;
  background:#e9f5f8;
  color:#0d6282;
  display:grid;
  place-items:center;
  font-weight:850;
  font-size:11px;
}

.maintenance-document-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.maintenance-document-copy strong{
  font-size:14px;
  line-height:1.2;
}

.maintenance-document-copy small{
  color:var(--muted);
  font-size:10px;
}

.maintenance-document-button{
  border:1px solid var(--cyan);
  border-radius:10px;
  background:#0c3048;
  color:var(--cyan2);
  padding:8px 9px;
  font-size:11px;
  font-weight:750;
}

.maintenance-pdf-warning{
  border:1px solid #675928;
  background:#2b2816;
  border-radius:13px;
  padding:10px 12px;
  margin:10px 0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.maintenance-pdf-warning strong{
  color:#f5d66d;
  font-size:12px;
}

.maintenance-pdf-warning span{
  color:#d3c792;
  font-size:11px;
  line-height:1.3;
}

.maintenance-pdf-shell{
  width:100%;
  min-height:58vh;
  border:1px solid #155c8d;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}

.maintenance-pdf-shell iframe{
  width:100%;
  height:64vh;
  border:0;
  display:block;
  background:#fff;
}

.maintenance-pdf-open{
  margin-top:10px;
  min-height:44px;
  border-radius:12px;
  border:1px solid var(--cyan);
  background:#0b3049;
  color:var(--cyan2);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-size:13px;
  font-weight:750;
}
/* HC-MAINTENANCE-DOCS-v0.2.9 END */

/* HC-PDF-ICON-v0.2.10 START */
.maintenance-document-icon{
  width:42px;
  height:48px;
  border-radius:0;
  background:transparent;
  color:inherit;
  display:grid;
  place-items:center;
}

.maintenance-document-icon svg{
  width:42px;
  height:48px;
  overflow:visible;
}

.maintenance-document-icon .pdf-sheet{
  fill:#f5f7fa;
  stroke:#d6dde5;
  stroke-width:1.5;
}

.maintenance-document-icon .pdf-fold{
  fill:none;
  stroke:#c7d0d9;
  stroke-width:1.5;
}

.maintenance-document-icon .pdf-band{
  fill:#e53935;
  stroke:#ff6b66;
  stroke-width:1;
}

.maintenance-document-icon .pdf-text{
  fill:#ffffff;
  font-size:10px;
  font-family:Arial,sans-serif;
  font-weight:800;
}
/* HC-PDF-ICON-v0.2.10 END */

/* HC-GAS-OCCUPANCY-v0.2.11 START */
.consumption-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 0 8px;
}

.consumption-title-block{
  min-width:0;
}

.consumption-title-block h1{
  margin:3px 0 3px;
  font-size:27px;
  line-height:1.12;
}

.consumption-folders{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:14px;
}

.consumption-folder{
  width:100%;
  min-height:82px;
  padding:11px 12px;
  border-radius:16px;
  border:1px solid #155c8d;
  background:linear-gradient(145deg,#0b2b48,#09213a);
  color:var(--text);
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  text-align:left;
}

.consumption-folder-icon{
  width:44px;
  height:44px;
  border:2px solid var(--cyan);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan2);
}

.consumption-folder-icon svg{
  width:25px;
  height:25px;
  fill:currentColor;
}

.consumption-folder-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.consumption-folder-copy strong{
  font-size:15px;
  line-height:1.18;
}

.consumption-folder-copy small{
  color:var(--muted);
  font-size:11px;
  line-height:1.25;
}

.consumption-folder-arrow{
  color:var(--cyan);
  font-size:30px;
}

.gas-demo-banner{
  border:1px solid #675928;
  background:#2b2816;
  border-radius:13px;
  padding:10px 12px;
  margin:10px 0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.gas-demo-banner strong{
  color:#f5d66d;
  font-size:12px;
}

.gas-demo-banner span{
  color:#d3c792;
  font-size:11px;
  line-height:1.3;
}

.gas-metric-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:10px 0;
}

.gas-metric-card{
  min-width:0;
  border:1px solid #155c8d;
  border-radius:14px;
  background:#0a2036;
  padding:10px 11px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.gas-metric-card > span{
  color:var(--muted);
  font-size:10px;
}

.gas-metric-card strong{
  color:var(--cyan2);
  font-size:20px;
  line-height:1.1;
}

.gas-metric-card small{
  color:var(--muted);
  font-size:9px;
  line-height:1.2;
}

.gas-loss-card{
  border-color:#8e3442;
  background:#291723;
}

.gas-loss-card strong{
  color:#ff6473;
}

.gas-chart-card{
  border:1px solid #184b6e;
  border-radius:16px;
  background:linear-gradient(180deg,#0b2238,#081a2b);
  padding:11px;
  margin-top:10px;
}

.gas-chart-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}

.gas-chart-toolbar > div:first-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.gas-chart-toolbar strong{
  font-size:14px;
}

.gas-chart-toolbar small{
  color:var(--muted);
  font-size:10px;
}

.gas-year-filters{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
}

.gas-year-filter{
  min-height:32px;
  padding:5px 9px;
  border-radius:9px;
  border:1px solid #33546d;
  background:#0a1826;
  color:#8296a7;
  font-size:10px;
  font-weight:750;
  opacity:.55;
}

.gas-year-filter.active{
  opacity:1;
}

.gas-year-filter.y2024.active{
  border-color:#29cfe7;
  color:#70ebf7;
  background:#0b3447;
}

.gas-year-filter.y2025.active{
  border-color:#73d48c;
  color:#a3ebb4;
  background:#173525;
}

.gas-year-filter.y2026.active{
  border-color:#ff4d61;
  color:#ff8793;
  background:#3a1720;
}

.gas-chart-legend{
  display:flex;
  gap:13px;
  flex-wrap:wrap;
  margin:10px 0 3px;
  color:var(--muted);
  font-size:10px;
}

.gas-chart-legend span{
  display:flex;
  align-items:center;
  gap:5px;
}

.gas-chart-legend i{
  width:8px;
  height:8px;
  border-radius:50%;
  display:inline-block;
}

.legend-2024 i{background:#23d9ef}
.legend-2025 i{background:#69d588}
.legend-2026 i{background:#ff465a}

.gas-scatter-wrap{
  width:100%;
  overflow:hidden;
  border-radius:12px;
}

.gas-scatter-wrap svg{
  width:100%;
  height:auto;
  min-height:260px;
  display:block;
  touch-action:manipulation;
}

.gas-grid-line{
  stroke:#173b55;
  stroke-width:1;
}

.gas-axis-line{
  stroke:#47738f;
  stroke-width:1.2;
}

.gas-axis-label{
  fill:#8da7ba;
  font-size:11px;
  font-family:Arial,sans-serif;
}

.gas-axis-title{
  fill:#adc1cf;
  font-size:12px;
  font-family:Arial,sans-serif;
  font-weight:700;
}

.gas-trend{
  fill:none;
  stroke-width:2.2;
  stroke-dasharray:7 5;
  opacity:.75;
  pointer-events:none;
}

.gas-point{
  stroke:#06111d;
  stroke-width:1.7;
  cursor:pointer;
  transition:r .12s ease, opacity .12s ease, stroke-width .12s ease;
}

.gas-point.selected{
  r:9;
  stroke:#ffffff;
  stroke-width:3;
}

.gas-point.hidden-series,
.gas-trend.hidden-series{
  display:none;
}

.gas-point-detail{
  margin-top:8px;
  min-height:52px;
  border:1px solid #244d69;
  border-radius:12px;
  background:#091b2b;
  padding:9px 11px;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.gas-point-detail strong{
  font-size:13px;
}

.gas-point-detail span{
  color:var(--muted);
  font-size:11px;
  line-height:1.3;
}

.gas-analysis-note{
  margin-top:10px;
  border:1px solid #80303d;
  background:#271720;
  border-radius:13px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.gas-analysis-note strong{
  color:#ff7885;
  font-size:12px;
}

.gas-analysis-note span{
  color:#d5aeb4;
  font-size:11px;
  line-height:1.35;
}

@media(max-width:390px){
  .gas-metric-card strong{
    font-size:18px;
  }

  .gas-chart-card{
    padding:9px 7px;
  }
}
/* HC-GAS-OCCUPANCY-v0.2.11 END */
