:root{
  --bg: #ffffff;
  --side: #f7fafc;
  --ink: #0b1220;
  --accent: #0ea5e9;
}

body{background:var(--bg); color:var(--ink);}
.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;}

.areas{min-height:100vh; display:grid; grid-template-areas: "header header" "aside main" "bar bar"; grid-template-columns: 320px minmax(0,1fr); grid-template-rows: auto 1fr auto;}
.areas__header{grid-area:header; border-bottom:1px solid rgba(0,0,0,.06);}
.areas__aside{grid-area:aside; background:var(--side); border-right:1px solid rgba(0,0,0,.06);}
.areas__main{grid-area:main; min-width:0;}
.areas__bar{grid-area:bar; display:flex; gap:.5rem; align-items:center; padding:.6rem 1rem; background:#fff; border-top:1px solid rgba(0,0,0,.06); position:sticky; bottom:0;}

#logo a{font-weight:900; color:var(--accent); text-decoration:none;}

.areas.is-aside-collapsed{grid-template-areas: "header" "main" "bar"; grid-template-columns: 1fr;}
.areas.is-aside-collapsed .areas__aside{display:none;}

@media (max-width: 980px){
  .areas{grid-template-areas: "header" "main" "bar"; grid-template-columns: 1fr;}
  .areas__aside{display:none;}
}

html[data-pulse="1"] body{background:linear-gradient(180deg, rgba(14,165,233,.08), transparent), var(--bg);}

#footer{background:#fff; border-top:1px solid rgba(0,0,0,.06);}
#footer .container{max-width:1100px; margin:0 auto; padding:1.2rem;}
