.hor-sala {
  --hor-border:#75617165;
  --hor-ink:#f9eedc;
  --hor-body:#e3d8d8;
  --hor-muted:#cdbac5;
  --hor-gold:#f2ca8a;
  --hor-tint:#cf9164;
  color:var(--hor-ink);
  font-family:var(--sans,system-ui,sans-serif);
}
.hor-sala[data-element="Ar"]{--hor-tint:#b7cde7}
.hor-sala[data-element="Terra"]{--hor-tint:#c7d0a9}
.hor-sala[data-element="Água"]{--hor-tint:#a1caca}
.hor-sala *{box-sizing:border-box}
.hor-sala h1,.hor-sala h2,.hor-sala h3,.hor-sala h4,.hor-sala p,.hor-sala ol{margin:0}
.hor-banner{
  position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(166px,17vw,237px);
  padding:25px clamp(21px,4vw,56px);overflow:hidden;border:1px solid #92795170;
  border-radius:16px 16px 0 0;background:#21151f;
}
.hor-banner::before,.hor-banner::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1}
.hor-banner::before{
  left:25%;background:url('assets/horoscopo-zodiaco.webp') 55% 35% / cover no-repeat;opacity:.97;
  animation:hor-panorama 24s ease-in-out infinite alternate;
}
.hor-banner::after{
  background:linear-gradient(90deg,#171323 12%,#171323 25%,#181626d9 41%,#16152435 59%,transparent 80%),linear-gradient(0deg,#18142088,transparent 28%,transparent 86%,#16132338);
}
@keyframes hor-panorama{to{transform:scale(1.032)}}
.hor-banner-copy{max-width:34em}
.hor-sala .hor-date,.hor-sala .hor-element{
  color:var(--hor-gold);font:600 .69rem/1.45 var(--sans,system-ui,sans-serif);letter-spacing:.13em;text-transform:uppercase;
}
.hor-sala .hor-date{margin-bottom:8px}
.hor-sala .hor-title{
  max-width:13ch;font:500 clamp(41px,5vw,80px)/.99 var(--serif,Georgia,serif);
  letter-spacing:-.045em;text-wrap:balance;color:#fff1cf;text-shadow:0 2px 24px #170f13;
}
.hor-picker{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));background:#201a22;
  padding:9px 6px;border:1px solid var(--hor-border);border-top:0;border-radius:0 0 14px 14px}
.hor-sala .hor-sign{
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-width:0;min-height:60px;
  border:1px solid transparent;background:transparent;color:var(--hor-muted);
  padding:5px 1px;border-radius:8px;font:500 clamp(10px,.87vw,13px)/1.3 var(--sans,system-ui,sans-serif);
}
.hor-sala .hor-sign:hover,.hor-sala .hor-sign:focus-visible{color:#ffebc8;background:#3a2d35}
.hor-sala .hor-sign[aria-pressed=true]{
  color:#ffe3af;border-color:#b091577c;background:linear-gradient(145deg,#46342f,#34282f);
}
.hor-glyph,.hor-emblem{font-family:'Segoe UI Symbol','Noto Sans Symbols','Apple Symbols',serif;line-height:1}
.hor-glyph{font-size:24px;color:#d4b184}
.hor-sign[aria-pressed=true] .hor-glyph{color:#ffde9f}
.hor-transition{padding:10px 8px 0;color:var(--hor-muted);font-size:13px}
.hor-folio{margin-top:clamp(17px,2.2vw,32px);border:1px solid var(--hor-border);border-radius:16px;
  background:radial-gradient(ellipse at 100% 8%,#46303940,transparent 55%),#231c25;}
.hor-folio-head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:clamp(14px,2vw,26px) clamp(16px,2.6vw,38px);border-bottom:1px solid var(--hor-border)
}
.hor-sign-heading{display:flex;align-items:center;gap:12px;min-width:0}
.hor-emblem{
  display:grid;place-items:center;flex:none;width:clamp(43px,4.8vw,62px);aspect-ratio:1;
  font-size:clamp(27px,3.3vw,40px);border-radius:50%;border:1px solid #a5907466;color:var(--hor-tint);
  background:radial-gradient(ellipse at 40% 20%,#4e3e48,#2d242e 80%);
}
.hor-sala .hor-element{font-size:10px;color:var(--hor-tint)}
.hor-sala .hor-sign-title{font:500 clamp(29px,3.7vw,57px)/1.06 var(--serif,Georgia,serif);letter-spacing:-.035em}
.hor-controls{display:flex;gap:10px;align-items:center;justify-content:end;flex-wrap:wrap}
.hor-tabs{display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:30px;border:1px solid #826b755e;background:#19141b}
.hor-sala .hor-tab,.hor-year{
  font:550 .82rem/1.3 var(--sans,system-ui,sans-serif);border-radius:22px;padding:9px 15px;
  border:1px solid transparent;background:transparent;color:var(--hor-muted);white-space:nowrap;
}
.hor-sala .hor-tab:hover{color:#fff0d5}
.hor-sala .hor-tab[aria-selected=true]{background:#4a3737;color:#ffe1ae;border-color:#826644}
.hor-year{padding:8px 11px;border-color:#816e6b;background:#261c26;color:var(--hor-ink);cursor:pointer}
.hor-year option{background:#261c26;color:#f7e6d2}
.hor-panel{
  display:grid;grid-template-columns:minmax(0,1.65fr) minmax(195px,.85fr);align-items:start;
  padding:clamp(17px,2.5vw,37px);gap:clamp(17px,2.8vw,46px);min-height:180px;
}
.hor-reading,.hor-sky{min-width:0}
.hor-sala .hor-period-date{
  display:flex;gap:9px;align-items:center;font-size:13px;line-height:1.45;
  color:var(--hor-muted);font-weight:550;margin-bottom:16px
}
.hor-period-date::before{content:"";height:1px;width:22px;flex:none;background:#ae8956}
.hor-sala .hor-reading-title{
  font:500 clamp(26px,2.7vw,43px)/1.09 var(--serif,Georgia,serif);
  letter-spacing:-.025em;color:#fbe6bf;text-wrap:balance;
}
.hor-sala .hor-reading-intro,.hor-area p,.hor-event p{
  font:400 clamp(14px,1.04vw,16px)/1.68 var(--sans,system-ui,sans-serif);color:var(--hor-body);
  text-wrap:pretty;overflow-wrap:anywhere;
}
.hor-sala .hor-reading-intro{margin-top:10px;white-space:pre-line}
.hor-areas{display:grid;gap:14px;margin-top:20px}
.hor-area{position:relative;border-top:1px solid #8c697c3d;padding:12px 0 0}
.hor-area h4{font:550 1.05rem/1.4 var(--serif,Georgia,serif);color:#f1ce9d;margin-bottom:4px}
.hor-area p{font-size:14px}
.hor-sky{padding:18px clamp(14px,1.6vw,24px);border:1px solid #866b6f63;border-radius:12px;
  background:radial-gradient(ellipse at 100% 0,#51384490,transparent 56%),#201922;}
.hor-sala .hor-sky-title{font:500 clamp(21px,2vw,30px)/1.2 var(--serif,Georgia,serif);color:#f5d6a7;margin-bottom:12px}
.hor-sala .hor-events{list-style:none;padding:0}
.hor-event{position:relative;padding-left:16px;padding-bottom:14px}
.hor-event:before{content:"";position:absolute;width:6px;height:6px;background:#caa16d;transform:rotate(45deg);left:1px;top:.55em}
.hor-event:not(:last-child):after{content:"";position:absolute;width:1px;background:#8b70554f;left:3.5px;top:18px;bottom:0}
.hor-event time{display:block;color:#dfbf91;font-size:11px;line-height:1.7}
.hor-event strong{display:block;color:var(--hor-ink);font-size:14px;line-height:1.43}
.hor-sala .hor-event p{font-size:12.5px;line-height:1.55;margin-top:4px}
.hor-actions{margin-top:18px}
.hor-actions:empty{display:none}
.hor-sala .hor-save,.hor-sala .hor-retry{
  min-height:42px;border:1px solid #a3855b8f;border-radius:8px;padding:8px 15px;color:#ffe1b6;
  font:550 13px/1.4 var(--sans,system-ui,sans-serif);background:#3d2d32
}
.hor-sala .hor-save:disabled{cursor:default;opacity:.72}
.hor-sala .hor-loading,.hor-sala .hor-error{font-size:15px;color:var(--hor-muted);grid-column:1/-1}
.hor-sala .hor-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hor-sala :focus-visible{outline:2px solid #f0c992;outline-offset:2px}
@media(max-width:1100px) and (min-width:761px){
  .hor-picker{grid-template-columns:repeat(6,minmax(0,1fr));row-gap:2px}
  .hor-sala .hor-sign{flex-direction:row;gap:6px;font-size:11px;min-height:36px}
  .hor-glyph{font-size:19px}
}
@media(max-width:760px){
  .hor-banner{min-height:149px;padding:18px}
  .hor-banner::before{left:16%;background-position:56% 34%}
  .hor-title{font-size:44px}
  .hor-picker{grid-template-columns:repeat(6,minmax(0,1fr));row-gap:2px}
  .hor-sala .hor-sign{min-height:42px;gap:2px;font-size:10.5px}
  .hor-glyph{font-size:19px}
  .hor-panel{grid-template-columns:1fr}
  .hor-sky{padding:15px}
  .hor-areas{gap:7px}
}
@media(max-width:540px){
  .hor-picker{grid-template-columns:repeat(4,minmax(0,1fr));padding:5px;gap:1px}
  .hor-sala .hor-sign{font-size:11px;min-height:38px;flex-direction:row;gap:3px}
  .hor-glyph{font-size:16px}
  .hor-folio-head{align-items:start;flex-direction:column;gap:11px;padding:15px}
  .hor-controls{justify-content:start}
  .hor-sala .hor-tab{font-size:12px;padding:8px 13px}
  .hor-year{font-size:12px;padding:6px 7px}
  .hor-sala .hor-period-date{margin-bottom:12px}
}
@media(max-width:350px){.hor-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.hor-sala .hor-sign{min-height:35px}}
@media(prefers-reduced-motion:reduce){.hor-banner::before{animation:none}}