.ma-room {
  --ma-gold:#f2d596; --ma-line:#c6a26e75; --ma-paper:#fcf1e2;
  width:min(1330px,96vw); max-width:96vw; max-height:94dvh; margin:auto; padding:0;
  border:1px solid #ba956b; border-radius:20px; overflow:auto; overscroll-behavior:contain;
  background-color:#21142c;
  background-image:linear-gradient(180deg,#190e2570,transparent 32%,#140a2288 91%),linear-gradient(120deg,#9c67d0,#694288 48%,#aa63b6),url(assets/capa-universo-ritual.webp);
  background-size:cover;background-position:center 50%;background-attachment:fixed;background-blend-mode:normal,color,normal;
  color:var(--ma-paper); font:400 15px/1.48 var(--sans,sans-serif); color-scheme:dark;
  box-shadow:0 35px 120px #08030bea,inset 0 0 55px #180b24;
}
.ma-room::backdrop{background:#0c0711d9;backdrop-filter:blur(5px)}
.ma-room :is(h2,h3,p,dl){margin:0}
.ma-room button,.ma-room a,.ma-room summary,.ma-room input,.ma-room select{font-family:inherit}
.ma-room button,.ma-room summary{cursor:pointer}
.ma-room :focus-visible{outline:2px solid #fee3a1;outline-offset:3px}
.ma-room [hidden]{display:none!important}
.ma-heading{text-align:center;position:relative;padding:20px 45px 12px;background:linear-gradient(#170c20c9,transparent)}
.ma-heading>span{font:22px Georgia,serif;color:#e4bd79;letter-spacing:.24em}
.ma-heading h2{font:500 clamp(42px,5.2vw,82px)/1.04 var(--serif,Georgia,serif);letter-spacing:.025em;color:#ffe2a7}
.ma-heading p{font:500 clamp(10px,1.3vw,15px)/1.5 var(--sans,sans-serif);letter-spacing:.14em;text-transform:uppercase;margin:7px 0;color:#f4debc}
.ma-close{position:absolute;right:16px;top:16px;display:grid;place-items:center;padding:0;border:1px solid var(--ma-line);border-radius:50%;width:38px;height:38px;background:#190f23dc;color:var(--ma-paper);font-size:24px}
.ma-layout{display:grid;grid-template-columns:minmax(180px,.92fr) minmax(255px,1.9fr) minmax(180px,.92fr);gap:clamp(10px,1.4vw,24px);align-items:center;padding:4px clamp(14px,2vw,36px) 22px;background:radial-gradient(ellipse at 50% 52%,#823da644,transparent 66%)}
.ma-left,.ma-right{min-width:0;display:grid;gap:12px}
.ma-card,.ma-form,.ma-detail{min-width:0;border:1px solid var(--ma-line);border-radius:13px;background:linear-gradient(130deg,#301d3aef,#211326ef 60%,#322139ed);box-shadow:inset 0 1px 0 #ffe8bd26,0 5px 22px #1008188a}
.ma-card,.ma-form{padding:clamp(13px,1.3vw,23px)}
.ma-card h3,.ma-detail summary{font:500 clamp(18px,1.8vw,25px)/1.15 var(--serif,Georgia,serif);color:var(--ma-gold)}
.ma-lead{display:block;font:500 clamp(17px,1.6vw,23px)/1.2 var(--serif,Georgia,serif);margin:9px 0;color:#fff5e8}
.ma-card p{font-size:clamp(12px,.96vw,15px);line-height:1.45;color:#e8dce6;margin-top:8px}
.ma-instrument{min-width:0;position:relative;align-self:center;display:grid;place-items:center}
.ma-wheel{display:block;width:100%;max-width:620px;height:auto;aspect-ratio:1;overflow:visible;filter:drop-shadow(0 0 8px #e7a64d70)}
.ma-disc{fill:url(#ma-enamel);stroke:url(#ma-brass);stroke-width:2}
.ma-ring{fill:none;stroke:#eac789;stroke-width:1.05}.ma-ring:nth-child(3n){stroke:#c790cc;stroke-width:.8}
.ma-sector{cursor:pointer;outline:none}.ma-sector path{fill:#381d3b5e;stroke:#d2aa71;stroke-width:.8}
.ma-sector:nth-of-type(even) path{fill:#251b3c88}
.ma-sector:is(.selected,:hover,:focus-visible) path{fill:#98623975;stroke:#ffdc99;stroke-width:1.8}
.ma-wheel text{text-anchor:middle;dominant-baseline:central;fill:#ffe1a5;pointer-events:none;font-family:Georgia,'Segoe UI Symbol','Noto Sans Symbols',serif}
.ma-zodiac{font-size:23px}.ma-sign-name{font-size:8.5px}.ma-house{font-size:12px}.ma-body{font-size:21px;paint-order:stroke;stroke:#22112c;stroke-width:3px}
.ma-radial,.ma-leader{stroke:#c39b68;stroke-width:.72}.ma-tick{stroke:#e8bd79;stroke-width:.7}
.ma-aspect{stroke-width:1.65;opacity:.96}.ma-glint{fill:#fff5c7;filter:drop-shadow(0 0 5px #ffc264)}.ma-center path{fill:#ffde9f;filter:drop-shadow(0 0 8px #f5ae63)}.ma-center circle,.ma-pin{fill:#fff1c9}
.ma-axis{fill:#38202e;stroke:#f0c88a;stroke-width:1}.ma-axis-label{font:10px/1 Georgia!important}
.ma-caption{min-height:26px;text-align:center;color:#ffe7c2;font-size:12px;letter-spacing:.045em;margin:3px 0;background:#201124cb;border-radius:12px;padding:3px 13px}
.ma-room[data-phase=playing] .ma-wheel{animation:ma-orbit 1.5s ease-in-out both}
.ma-room[data-phase=result] .ma-card{animation:ma-emerge .35s ease-out backwards}
.ma-room[data-phase=result] .ma-card:nth-child(2){animation-delay:.06s}
@keyframes ma-orbit{0%{transform:rotate(0) scale(1)}54%{transform:rotate(110deg) scale(.94);filter:drop-shadow(0 0 21px #f5c075)}100%{transform:rotate(360deg) scale(1)}}
@keyframes ma-emerge{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.ma-step{display:flex;align-items:center;justify-content:space-between;gap:5px;font:600 11px/1.4 var(--sans,sans-serif);color:#edcf9c}
.ma-step>span{color:#d3bfcf}.ma-form h3{font:500 clamp(24px,2.1vw,36px)/1.1 var(--serif,Georgia,serif);margin:10px 0 15px}
.ma-form label{display:block;margin-top:10px;color:#f9e6c7;font-weight:600;font-size:13px}
.ma-form label small{font-weight:400;color:#cdbdca}
.ma-form input,.ma-form select{display:block;padding:8px 9px;border-radius:6px;border:1px solid #b69c8970;background:#170e1edb;width:100%;min-width:0;box-sizing:border-box;color:#fff4e6;margin-top:5px;font:400 max(16px,.98vw)/1.3 var(--sans,sans-serif)}
.ma-form .ma-hint,.ma-error,.ma-matches{font-size:12px;color:#e6d2df;margin-top:9px}
.ma-error:not(:empty){padding:8px 0;color:#ffdba8}.ma-room .ma-gold{width:100%;margin-top:16px;padding:11px 12px;border:1px solid #f5d198;background:linear-gradient(140deg,#ffe2a4,#d9aa65);border-radius:9px;color:#281922;font:650 14px var(--sans,sans-serif)}
.ma-gold span{margin-left:5px}.ma-back,.ma-manual,.ma-redo{border:none;background:none;color:#efc98d;text-decoration:underline;text-underline-offset:3px;padding:0}.ma-back{font-size:11px}.ma-manual{font-size:12px;padding:4px 0}
.ma-matches:empty,.ma-error:empty{display:none}.ma-matches button{display:block;width:100%;padding:8px;margin:0;text-align:left;background:#28192f;color:#f5e6dc;border:0;border-bottom:1px solid #95744d60;font-size:12px}
.ma-matches button:hover,.ma-matches button:focus{background:#51304f}
.ma-details{padding:0 clamp(14px,2vw,36px);display:flex;justify-content:center;align-items:start;gap:10px;flex-wrap:wrap}
.ma-detail{flex:1 1 160px}.ma-detail summary{cursor:pointer;padding:13px 15px;font-size:19px}
.ma-detail dl{display:grid;grid-template-columns:minmax(64px,.9fr) minmax(95px,1.5fr);gap:6px;padding:0 14px 12px;font-size:12px}
.ma-detail dt{color:#f6daaa}.ma-detail dd{margin:0}.ma-redo{font-size:13px;align-self:center;padding:8px}
@media(max-width:920px){.ma-layout{grid-template-columns:minmax(190px,.85fr) minmax(260px,1.25fr);align-items:center}.ma-right{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.ma-heading{padding-top:16px}}
@media(max-width:600px){
 .ma-room{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border-radius:0;border:0;background-attachment:scroll}
 .ma-heading{padding:12px 43px 9px}.ma-heading>span{font-size:16px}.ma-heading h2{font-size:41px}.ma-heading p{font-size:9px}
 .ma-close{right:10px;top:10px}.ma-layout{display:flex;flex-direction:column;gap:12px;padding:0 14px 15px}
 .ma-instrument{width:min(100%,350px);order:0}.ma-room[data-phase=intake] .ma-instrument{width:min(68%,242px)}.ma-room[data-phase=playing] .ma-instrument{width:min(78%,280px)}
 .ma-left,.ma-right{width:100%;order:1}.ma-room[data-phase=intake] .ma-right{grid-template-columns:repeat(2,minmax(0,1fr))}.ma-room[data-phase=result] .ma-right{grid-template-columns:1fr}
 .ma-card,.ma-form{padding:14px}.ma-caption{min-height:0;font-size:10px}.ma-form h3{margin-bottom:10px;font-size:23px}
 .ma-details{display:grid;grid-template-columns:1fr}.ma-redo{justify-self:center}
}
@media(prefers-reduced-motion:reduce){.ma-room *{animation-duration:.001ms!important;animation-delay:0s!important}}
/* The instrument stays aligned with the natal positions. Only its lighting,
   the sky behind the glass and the illustrated surface of the selected body move. */
.ma-room{background:#121123 url(assets/mapa-observatorio.webp) center center / cover fixed no-repeat;background-blend-mode:normal}
.ma-layout{position:relative;isolation:isolate;padding-top:12px}.ma-layout::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:0;background:radial-gradient(ellipse 34% 45% at 49% 55%,#9a69c344,transparent 100%)}
.ma-heading{padding-block:16px 7px;background:linear-gradient(180deg,#0d0a17c9,transparent)}
.ma-heading h2{text-shadow:0 2px 8px #150c07,0 0 30px #ffd58c44;color:#ffe5ae}.ma-heading>span{color:#ffce83;text-shadow:0 0 12px #ffc681}
.ma-card,.ma-form{background:linear-gradient(135deg,#26182aeb,#18131ff2 72%,#362632eb);border-color:#d3a86992;box-shadow:inset 0 1px 0 #ffe4aa30,0 8px 25px #07050cb0}
.ma-instrument::before{content:"";position:absolute;inset:2% 0 7%;border-radius:100%;box-shadow:0 0 22px #dca8e63d,inset 0 0 25px #f4c9814a;pointer-events:none}
.ma-wheel{filter:drop-shadow(0 12px 10px #07020c99) drop-shadow(0 0 3px #ffd68399)}
.ma-nebula{opacity:.42;transform-origin:260px 260px;animation:ma-breathe 21s ease-in-out infinite alternate}
.ma-glint path{animation:ma-sparkle 3.8s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.ma-glint:nth-of-type(2n) path{animation-delay:-2.2s}
.ma-aspect{transition:opacity .28s,stroke-width .28s}.ma-aspect.muted{opacity:.17}.ma-room[data-phase=result] .ma-aspect{stroke-dasharray:1;animation:ma-trace .9s ease-out both}.ma-astro-hit{cursor:pointer}.ma-astro-lens{fill:transparent;stroke:transparent}.ma-astro-hit:is(:focus-visible,:hover,[aria-pressed=true]) .ma-astro-lens{fill:#63354ad9;stroke:#ffe3a6;stroke-width:1.3}
.ma-observer{display:grid;grid-template-columns:55px minmax(0,1fr);align-items:center;gap:2px 12px;border-top-color:#f1c37d}.ma-astro-select{width:100%;min-width:0;font:500 25px var(--serif)!important;background:#271c2c;color:#ffdc9a;border:1px solid #79624d;border-radius:6px;padding:3px 6px}
.ma-observation{grid-column:1/-1}.ma-planet{position:relative;display:block;width:50px;height:50px;border-radius:50%;background-position:center;background-size:200% 100%;box-shadow:inset -11px -5px 13px #080616d9,inset 2px 2px 4px #ffe6bc99,0 0 12px #bb85b866;animation:ma-surface 65s linear infinite}.ma-planet[data-planet=Sun]{box-shadow:inset -7px -4px 8px #8a421855,0 0 9px #ffd38c,0 0 28px #fa853988}.ma-planet[data-planet=Pluto]{background-size:cover;animation:none}.ma-planet[data-planet=Saturn]::after{position:absolute;content:"";inset:30% -18%;border:3px double #dbc5a5;border-radius:50%;transform:rotate(-20deg)}
.ma-question-result{margin:0 clamp(14px,2vw,36px) 14px}.ma-reading-status,.ma-observation .ma-house-focus,.ma-observation .ma-aspect-focus{font:500 12px/1.4 var(--sans);color:#e3c49d}
@keyframes ma-breathe{to{transform:scale(1.08) rotate(3deg);opacity:.62}}@keyframes ma-sparkle{from{opacity:.45;transform:scale(.65)}to{opacity:1;transform:scale(1.15)}}@keyframes ma-trace{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes ma-surface{from{background-position:0 50%}to{background-position:200% 50%}}
@media(max-width:600px){.ma-room{background-attachment:scroll;background-size:auto max(90vh,610px);background-position:center top;background-color:#171023}.ma-layout{background:linear-gradient(180deg,transparent 200px,#191121 580px)}.ma-left,.ma-right{gap:8px}}
@media(prefers-reduced-motion:reduce){.ma-room *,.ma-room *::before,.ma-room *::after{animation:none!important;transition:none!important}}
/* Reading notebook under the instrument. */
.ma-open-report,.ma-atlas-head>button,.ma-atlas-pane>button{appearance:none;border:1px solid #deb97a;border-radius:999px;background:linear-gradient(140deg,#ffe1a2,#d6a164);color:#24151e;padding:10px 20px;font-weight:650;box-shadow:0 4px 20px #11101f66}
.ma-open-report{margin-top:8px;z-index:1}
.ma-read-astro{grid-column:1/-1;justify-self:start;padding:3px 0;border:0;background:none;color:#edca91;text-decoration:underline;text-underline-offset:3px}
.ma-details:has(.ma-atlas){display:block;padding-bottom:14px}
.ma-details>.ma-redo{display:block;margin:10px auto 0}
.ma-atlas{box-sizing:border-box;width:100%;scroll-margin-top:12px;padding:clamp(16px,2.4vw,30px);border:1px solid #b58b60;border-radius:16px;background:linear-gradient(132deg,#26182bfa,#19111ff7 61%,#332435f7);box-shadow:inset 0 1px 0 #eac79444,0 12px 30px #0c08167a}
.ma-atlas-head,.ma-atlas-menu,.ma-atlas-picker{display:flex;align-items:center;gap:8px}
.ma-atlas-head{justify-content:space-between;gap:14px;flex-wrap:wrap}
.ma-atlas-head h3{font:500 clamp(28px,3.5vw,47px)/1.05 var(--serif,Georgia);color:#ffe4b6;letter-spacing:-.02em}
.ma-atlas-head>button{font-size:13px;padding:8px 15px}
.ma-atlas-menu{flex-wrap:wrap;margin:18px 0 15px;padding-bottom:12px;border-bottom:1px solid #ae8c633d}
.ma-atlas-menu button,.ma-atlas-picker button,.ma-atlas-picker select{border:1px solid #856848;background:#251b2c;border-radius:8px;color:#f4dbad;font:550 14px/1.3 var(--sans,sans-serif);padding:8px 12px}
.ma-atlas-menu button[aria-pressed=true]{background:#583f48;color:#ffebc8;border-color:#e4bd7c;box-shadow:inset 0 -2px #d7ae75}
.ma-atlas-picker{justify-content:center;max-width:540px;margin:0 auto 12px}
.ma-atlas-picker select{min-width:0;flex:1;width:100%;font-size:16px}.ma-atlas-picker button{font-size:19px;line-height:1;min-width:40px}.ma-atlas-picker button:disabled{opacity:.4;cursor:default}
.ma-atlas-paper{position:relative;isolation:isolate;border:1px solid #96704e83;border-radius:12px;background:radial-gradient(ellipse at 5% 0,#5f39465c,transparent 57%),#201725;padding:clamp(16px,2.5vw,32px);overflow:hidden}
.ma-atlas-planet{float:right;width:clamp(54px,8vw,107px);aspect-ratio:1;border-radius:50%;background-position:center;background-size:cover;box-shadow:inset -11px -6px 18px #0c081cbd,inset 3px 2px 4px #ffe4bc54,0 0 24px #f6c5832e;margin:1px 1px 12px 20px}
.ma-atlas-paper h4{margin:0 0 16px;color:#ffdda5;font:500 clamp(23px,2.8vw,36px)/1.13 var(--serif,Georgia)}
.ma-atlas-paper>p{max-width:86ch;color:#ede1e7;line-height:1.6;margin-top:8px}
.ma-atlas-paper .ma-atlas-facts{display:flex;flex-wrap:wrap;gap:9px 17px;margin:0 0 14px;padding:0;min-width:0}
.ma-atlas-facts div{min-width:76px;padding-left:9px;border-left:1px solid #a97e53}
.ma-atlas-facts dt{font:500 11px/1.45 var(--sans,sans-serif);color:#cdb8c8}
.ma-atlas-facts dd{margin:2px 0 0;font-size:14px;font-weight:600;color:#ffe3b9}
.ma-atlas-empty{padding:12px 0 18px}
@media(max-width:600px){.ma-atlas-menu{gap:5px}.ma-atlas-menu button{font-size:12px;padding:8px 9px}.ma-atlas-facts div{min-width:min(100%,82px)}.ma-atlas-paper>p{font-size:14px}.ma-atlas-head>button{min-height:38px}.ma-atlas-planet{margin-left:5px}.ma-atlas-picker select{max-width:calc(100% - 96px)}}
