/* The birthday room is an ink-and-gold celestial atlas within the archive. */
#birthday-room, .sky-dialog { --atlas-ink: #101d2b; --atlas-gold: #efd19a; --atlas-teal: #a1d7d2; --atlas-line: rgba(239,209,154,.27); --gold-light: #efd19a; --cream: #fff6e8; }
#birthday-room { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 30px 48px; margin-top: 24px; padding: clamp(22px,3vw,42px); border: 1px solid var(--atlas-line); background-color: var(--atlas-ink); background-image: radial-gradient(1px 1px at 17% 9%, #f7dfb5 90%, transparent), radial-gradient(1px 1px at 71% 4%, #f7dfb5 90%, transparent), radial-gradient(1px 1px at 92% 18%, #a1d7d2 90%, transparent), linear-gradient(135deg, #162a37, #111a2a 60%); scroll-margin-top: 22px; }
#birthday-room .birthday-intro { align-self: center; }
.celestial-emblem { display: grid; place-items: center; width: 62px; height: 62px; margin-bottom: 24px; border: 1px solid var(--atlas-line); border-radius: 50%; outline: 1px solid var(--atlas-line); outline-offset: -7px; color: var(--atlas-gold); font: 43px/1 "Segoe UI Symbol", serif; }
#birthday-room .birthday-intro h3 { max-width: 330px; margin-top: 13px; font-size: clamp(34px,3.5vw,48px); font-weight: 600; line-height: 1.06; }
#birthday-room .birthday-intro > p:last-child { margin-top: 17px; font-size: 14px; line-height: 1.65; color: #bfcbd3; }
#birthday-room .birthday-form { position: relative; z-index: 4; align-self: center; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 14px; }
#birthday-room .birthday-form label { gap: 9px; font-size: 10px; }
#birthday-room .birthday-form label small { font-size: 10px; color: #aebcc6; }
#birthday-room .birthday-form input { height: 50px; padding: 0 12px; border-color: rgba(239,209,154,.35); color-scheme: dark; font-size: 16px; background: rgba(255,250,244,.045); }
#birthday-room .birthday-form input::placeholder { color: #aebcc6; }
#birthday-room .birthday-button { min-height: 48px; padding: 11px 24px; font-size: 14px; color: #142331; }
.birthplace-field { grid-column: 1 / -1; min-width: 0; }
.birthplace-field label { margin-bottom: 9px; }
.city-input-wrap { position: relative; }
.city-suggestions[hidden] { display: none; }
.city-suggestions { position: absolute; z-index: 20; inset-inline: 0; top: calc(100% + 5px); max-height: 330px; overflow-y: auto; padding: 5px; border: 1px solid var(--atlas-gold); background: #fff6e8; box-shadow: 0 18px 42px rgba(0,0,0,.4); }
.city-suggestions button { display: block; width: 100%; min-height: 61px; padding: 10px 12px; text-align: left; border: 0; border-bottom: 1px solid #e0d7c9; background: transparent; color: #142331; }
.city-suggestions button:last-child { border-bottom: 0; }
.city-suggestions button strong { display: block; font-size: 15px; font-weight: 600; }
.city-suggestions button span { display: block; margin-top: 4px; font-size: 12px; line-height: 1.4; color: #4d5b63; }
.city-suggestions button:hover, .city-suggestions button[aria-selected="true"] { background: #e4c78f; }
.city-search-status { min-height: 31px; margin-top: 8px; color: #bfcbd3; font-size: 11px; line-height: 1.4; }
.city-attribution { color: #aebcc6; font-size: 10px; line-height: 1.5; }
.city-attribution a { color: var(--atlas-gold); text-underline-offset: 3px; }
#birthday-room .birthday-output { min-width: 0; }
#birthday-room .birthday-navigation { gap: 8px; margin: 6px 0 28px; padding-bottom: 18px; border-color: var(--atlas-line); }
#birthday-room .birthday-navigation button { min-height: 47px; padding: 12px 20px; color: #dce4e8; font-size: 14px; border-color: var(--atlas-line); }
#birthday-room .birthday-navigation button[aria-pressed="true"] { color: #142331; background: var(--atlas-gold); }
#birthday-room .birthday-navigation button:hover { border-color: var(--atlas-gold); }
#birthday-room .sky-summary { display: block; }
#birthday-room .sky-summary[hidden] { display: none; }
.celestial-portrait { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 36px; padding: 12px 0 32px; }
#birthday-room .sky-chart-wrap { display: block; padding: 0; min-height: 0; border: 0; background: none; overflow: visible; }
#birthday-room .sky-chart-wrap::before, #birthday-room .sky-chart-wrap::after { display: none; }
.sky-chart-launch { display: block; width: 100%; padding: 0; border: 0; background: transparent; color: var(--atlas-gold); cursor: zoom-in; }
.sky-chart-launch:focus-visible { outline: 2px solid var(--atlas-teal); outline-offset: 7px; }
.zodiac-wheel { display: block; width: 100%; height: auto; aspect-ratio: 1; overflow: visible; }
.zodiac-wheel text { text-anchor: middle; pointer-events: none; }
.wheel-edge, .wheel-ring { fill: none; stroke: var(--atlas-gold); stroke-width: 1; opacity: .5; }
.wheel-edge { opacity: .75; }
.wheel-tick { stroke: var(--atlas-gold); stroke-width: 1; opacity: .5; }
.wheel-tick.major { stroke-width: 1.5; opacity: .9; }
.wheel-sector-fill { fill: rgba(255,246,232,.025); stroke: rgba(239,209,154,.24); stroke-width: 1; }
.wheel-sign-glyph { fill: #e9dfca; font: 27px "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols 2", serif; }
.wheel-sign-name { fill: #d8e2e5; font: 13px "DM Sans", sans-serif; }
.wheel-sector.birth-sign .wheel-sector-fill { fill: rgba(239,209,154,.24); stroke: var(--atlas-gold); stroke-width: 1.7; }
.wheel-sector.birth-sign .wheel-sign-glyph, .wheel-sector.birth-sign .wheel-sign-name { fill: #ffdfa0; }
.wheel-birth-dot { fill: var(--atlas-gold); }
.wheel-geometry { fill: none; stroke: var(--atlas-teal); opacity: .22; stroke-width: 1; }
.wheel-inner { fill: var(--atlas-ink); stroke: var(--atlas-line); }
.wheel-center-label { fill: var(--atlas-teal); font: 10px "DM Mono", monospace; letter-spacing: 2px; }
.wheel-center-glyph { fill: var(--atlas-gold); font: 95px "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols 2", serif; }
.wheel-center-name { fill: #fff3dc; font: 600 25px "Playfair Display", serif; }
.wheel-center-element { fill: #becfd2; font: 9px "DM Mono", monospace; letter-spacing: .8px; }
.wheel-spark { fill: none; stroke: var(--atlas-gold); stroke-width: 1; }
.sky-chart-launch:hover .wheel-edge { stroke-width: 2; opacity: 1; }
.sky-chart-invitation { display: inline-flex; align-items: center; justify-content: center; gap: 14px; margin-top: 17px; padding: 11px 18px; border: 1px solid var(--atlas-gold); font: 500 13px "DM Sans", sans-serif; }
.sky-chart-invitation > span:first-child { font-size: 22px; line-height: 1; }
.sky-chart-caption { margin-top: 12px; text-align: center; color: #aabfc8; font-size: 11px; line-height: 1.6; }
#birthday-room .horoscope-card { grid-column: auto; display: block; padding: 0; border: 0; background: none; }
#birthday-room .horoscope-card h4 { margin: 16px 0 0; font: 600 clamp(38px,4.6vw,66px)/1.04 "Playfair Display", serif; letter-spacing: -.035em; overflow-wrap: anywhere; }
#birthday-room .horoscope-card .reading-label { font-size: 10px; line-height: 1.5; color: var(--atlas-teal); }
#birthday-room .horoscope-card .zodiac-line { margin-top: 17px; color: #ccd7dc; font-size: 13px; line-height: 1.7; }
.sky-traits { display: flex; flex-wrap: wrap; gap: 8px; margin: 21px 0; }
.sky-traits span { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--atlas-line); padding: 7px 10px; color: var(--atlas-gold); font-size: 11px; }
.sky-traits i { font-size: 16px; font-style: normal; }
#birthday-room .horoscope-copy { max-width: 38ch; color: #e1e7e6; font-size: 16px; line-height: 1.8; }
.sky-mantra { display: flex; align-items: center; gap: 22px; margin-top: 23px; padding-top: 19px; border-top: 1px solid var(--atlas-line); color: var(--atlas-gold); font: italic 28px "Playfair Display", serif; }
.sky-mantra span { font: 20px serif; color: var(--atlas-teal); }
#birthday-room .sky-facts { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 26px; margin-top: 4px; }
#birthday-room .sky-fact { position: relative; min-height: 143px; padding: 23px 0 23px 49px; border: 0; border-top: 1px solid var(--atlas-line); background: none; }
#birthday-room .sky-fact dt { font: 10px/1.5 "DM Mono", monospace; letter-spacing: .08em; }
.sky-fact-symbol { position: absolute; top: 22px; left: 0; color: var(--atlas-teal); font: 33px/1 "Segoe UI Symbol", "Apple Symbols", serif; }
#birthday-room .sky-fact dd { margin-top: 10px; font: 600 22px/1.25 "Playfair Display", serif; }
#birthday-room .sky-fact dd small { margin-top: 7px; color: #b4c6ce; font: 12px/1.6 "DM Sans", sans-serif; }
#birthday-room .horoscope-lenses { gap: 25px; margin-top: 14px; padding: 26px 0 4px; border-top: 1px solid var(--atlas-line); }
.horoscope-lenses article { display: flex; align-items: start; gap: 13px; }
.lens-ornament { color: var(--atlas-gold); font: 28px/1 "Segoe UI Symbol", serif; }
#birthday-room .horoscope-lenses h5 { margin: 0 0 10px; font-size: 14px; }
#birthday-room .horoscope-lenses p { color: #d1dfe1; font-size: 13px; line-height: 1.8; }
#birthday-room .birthday-privacy { margin-top: 20px; color: #afc1cc; }
#birthday-room .insight-method { border-color: var(--atlas-line); }
#birthday-room .insight-method summary { font-size: 12px; }
#birthday-room .animal-seal { background: #162c39; }
#birthday-room .number-study { gap: 40px; }
.sky-dialog { width: min(1220px,calc(100% - 32px)); max-width: none; height: min(880px,calc(100dvh - 32px)); max-height: none; margin: auto; padding: 0; border: 1px solid var(--atlas-gold); background: var(--atlas-ink); color: var(--cream); box-shadow: 0 28px 100px #0008; }
.sky-dialog[open] { display: flex; flex-direction: column; }
.sky-dialog::backdrop { background: rgba(5,10,19,.82); backdrop-filter: blur(6px); }
.sky-dialog-header { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 28px; border-bottom: 1px solid var(--atlas-line); }
.sky-dialog-header .section-kicker { color: var(--atlas-teal); }
.sky-dialog-header h2 { margin: 6px 0 0; font: 600 30px/1.1 "Playfair Display", serif; }
.sky-dialog button { color: var(--atlas-gold); background: transparent; border: 1px solid var(--atlas-line); }
.sky-dialog button:hover { border-color: var(--atlas-gold); background: rgba(239,209,154,.1); }
.sky-dialog button:focus-visible, .sky-zoom-viewport:focus-visible { outline: 2px solid var(--atlas-teal); outline-offset: 3px; }
.sky-dialog-header button { width: 46px; height: 46px; font-size: 27px; }
.sky-dialog-layout { flex: 1 1 auto; min-height: 0; overflow: hidden; display: grid; grid-template-columns: minmax(0,1fr) 310px; grid-template-rows: minmax(0,1fr); gap: 26px; padding: 22px 26px 26px; }
.sky-explorer-chart { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.sky-zoom-controls { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 12px; }
.sky-zoom-controls button { min-width: 44px; height: 44px; padding: 7px 12px; font-size: 20px; }
.sky-zoom-controls button[data-sky-zoom="fit"] { margin-left: 9px; font-size: 12px; }
.sky-zoom-controls button:disabled { opacity: .35; cursor: default; }
.sky-zoom-controls output { min-width: 47px; text-align: center; color: var(--atlas-teal); font: 12px "DM Mono", monospace; }
.sky-zoom-viewport { width: 100%; flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; background: #0d1723; border: 1px solid rgba(239,209,154,.15); }
.sky-zoom-canvas { margin-inline: auto; aspect-ratio: 1; }
.natal-wheel { display: block; width: 100%; height: auto; aspect-ratio: 1; }
.natal-full-row, .natal-settings { grid-column: 1 / -1; }
#birth-fold-field[hidden], .natal-manual-fields[hidden], .natal-report-panel[hidden], .sky-aspect-toggle[hidden], .sky-zoom-controls button[hidden] { display: none; }
#birthday-room .birthday-form select { width: 100%; min-width: 0; height: 46px; padding: 0 10px; border: 1px solid var(--atlas-line); border-radius: 0; background: #152a39; color: var(--cream); color-scheme: dark; font: 14px "DM Sans", sans-serif; }
.natal-settings { border-block: 1px solid var(--atlas-line); padding-block: 2px; }
.natal-settings summary { min-height: 44px; padding: 13px 0; color: var(--atlas-gold); cursor: pointer; font-size: 12px; }
.natal-settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px 12px; padding-bottom: 17px; }
#birthday-room label.natal-manual-toggle { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; font: 12px/1.5 "DM Sans", sans-serif; letter-spacing: 0; text-transform: none; color: #d0e0e3; }
#birthday-room .natal-manual-toggle input { width: 18px; height: 18px; accent-color: var(--atlas-gold); }
.natal-manual-fields { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px 12px; min-width: 0; margin: 0; padding: 15px 0 0; border: 0; border-top: 1px solid var(--atlas-line); }
.natal-manual-fields legend { color: var(--atlas-teal); font-size: 12px; padding-right: 10px; }
.natal-notice { margin: 0 0 24px; padding: 17px 19px; border-left: 2px solid var(--atlas-gold); background: rgba(239,209,154,.06); color: #d1e0e4; font-size: 13px; line-height: 1.7; }
.natal-notice strong { display: block; margin-bottom: 5px; color: var(--atlas-gold); font-weight: 500; }
.natal-big-three { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; margin-bottom: 24px; }
.natal-big-three button { min-width: 0; text-align: left; padding: 17px 20px; border: 1px solid var(--atlas-line); background: rgba(161,215,210,.045); color: var(--cream); }
.natal-big-three button:hover { border-color: var(--atlas-gold); background: rgba(239,209,154,.08); }
.natal-big-three span { display: block; color: var(--atlas-teal); font: 10px "DM Mono", monospace; text-transform: uppercase; letter-spacing: .1em; }
.natal-big-three strong { display: block; margin-top: 10px; font: 600 23px/1.3 "Playfair Display","Segoe UI Symbol",serif; }
.natal-big-three small { display: block; margin-top: 6px; color: var(--atlas-gold); font: 11px "DM Mono", monospace; }
.natal-report { margin-top: 35px; padding-top: 28px; border-top: 1px solid var(--atlas-line); min-width: 0; }
.natal-report > header { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.natal-report > header h4 { margin: 9px 0 0; color: var(--cream); font: 600 34px/1.15 "Playfair Display", serif; }
.natal-report > header button { min-height: 44px; padding: 10px 13px; background: transparent; color: var(--atlas-gold); border: 1px solid var(--atlas-line); font-size: 12px; }
.natal-calculation-line, .natal-panel-hint { margin: 15px 0; color: #b8cdd5; font-size: 12px; line-height: 1.7; }
.natal-report-nav { display: flex; flex-wrap: wrap; gap: 7px; margin: 22px 0; }
.natal-report-nav button { min-height: 44px; padding: 10px 18px; border: 1px solid var(--atlas-line); background: transparent; color: var(--cream); font-size: 13px; }
.natal-report-nav button[aria-pressed="true"] { background: var(--atlas-teal); border-color: var(--atlas-teal); color: #132833; }
.natal-report button:focus-visible, .natal-big-three button:focus-visible, .natal-report select:focus-visible, .natal-settings summary:focus-visible { outline: 2px solid var(--atlas-teal); outline-offset: 3px; }
.natal-table-scroll { overflow: auto; max-width: 100%; }
.natal-table-scroll:focus-visible { outline: 2px solid var(--atlas-teal); }
.natal-report table { width: 100%; min-width: 510px; border-collapse: collapse; text-align: left; font-size: 13px; }
.natal-report thead th { padding: 12px 12px; color: var(--atlas-teal); font: 10px "DM Mono", monospace; letter-spacing: .05em; text-transform: uppercase; }
.natal-report tbody tr { border-top: 1px solid rgba(239,209,154,.17); }
.natal-report tbody th, .natal-report td { padding: 12px; color: #d4e3e5; font-weight: 400; }
.natal-report tbody th button { display: flex; align-items: center; gap: 11px; min-height: 42px; padding: 0; background: transparent; border: 0; color: var(--cream); text-align: left; font-size: 14px; }
.natal-report tbody th button:hover { color: var(--atlas-gold); }
.natal-report tbody th button span { width: 26px; color: var(--atlas-gold); font: 24px "Segoe UI Symbol",serif; }
.natal-report td small { display: block; margin-top: 5px; color: var(--atlas-gold); font: 11px "DM Mono",monospace; }
.natal-house-grid, .natal-aspect-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 25px; }
.natal-house-grid button, .natal-aspect-grid button { display: flex; align-items: center; gap: 17px; min-height: 90px; padding: 18px 0; border: 0; border-bottom: 1px solid var(--atlas-line); background: transparent; color: var(--cream); text-align: left; }
.natal-house-grid button:hover strong, .natal-aspect-grid button:hover strong { color: var(--atlas-gold); }
.natal-house-grid strong, .natal-aspect-grid strong { display: block; font-size: 14px; font-weight: 500; }
.natal-house-grid small, .natal-aspect-grid small { display: block; margin-top: 8px; color: #b9d0d7; font-size: 11px; line-height: 1.6; }
.house-number { min-width: 34px; color: var(--atlas-gold); font: 34px "Playfair Display",serif; }
.aspect-mark { min-width: 34px; color: var(--atlas-teal); font: 31px "Segoe UI Symbol",serif; }
.aspect-mark.hard { color: #ecaaa2; }
.natal-aspect-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; color: var(--atlas-gold); font-size: 12px; }
.natal-aspect-filter select { min-height: 44px; padding: 9px 12px; border: 1px solid var(--atlas-line); background: #152a39; color: var(--cream); font: 13px "DM Sans",sans-serif; }
.natal-balance-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 38px; }
.natal-balance-grid h5 { color: var(--atlas-gold); font: 24px "Playfair Display",serif; margin: 12px 0 24px; }
.natal-balance-row { display: grid; grid-template-columns: 70px minmax(0,1fr) 35px; gap: 13px; align-items: center; margin-bottom: 20px; font-size: 12px; color: #d5e4e5; }
.natal-balance-row strong { font: 11px "DM Mono",monospace; color: var(--atlas-gold); }
.natal-balance-row meter { width: 100%; height: 13px; accent-color: var(--atlas-teal); }
.natal-balance-row meter::-webkit-meter-bar { background: #273a47; border: 0; border-radius: 0; }
.natal-balance-row meter::-webkit-meter-optimum-value { background: var(--atlas-teal); }
.sky-zoom-controls { flex-wrap: wrap; }
.sky-zoom-controls [data-natal-export] { font-size: 12px; }
.sky-aspect-toggle { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 0 0 13px; color: #bdd4dc; font-size: 12px; }
.sky-aspect-toggle input { width: 17px; height: 17px; accent-color: var(--atlas-gold); }
.natal-detail-sign { color: var(--atlas-gold); font-size: 27px; }
.sky-sign-detail .natal-detail-theme { margin-top: 13px; color: var(--atlas-teal); font-size: 12px; }
.natal-aspect-symbol { color: var(--atlas-teal); }
.natal-detail-picker { display: grid; gap: 8px; margin: 0 0 22px; color: var(--atlas-teal); font: 11px/1.5 "DM Sans",sans-serif; }
.natal-detail-picker select { width: 100%; min-width: 0; min-height: 45px; padding: 8px 9px; color: var(--cream); background: #1c3543; border: 1px solid var(--atlas-line); font: 13px "DM Sans",sans-serif; }
.natal-detail-picker select:focus-visible { outline: 2px solid var(--atlas-teal); outline-offset: 2px; }
.sky-dialog .wheel-sector { cursor: pointer; }
.sky-dialog .wheel-sector:hover .wheel-sector-fill, .sky-dialog .wheel-sector.selected-sign .wheel-sector-fill { fill: rgba(161,215,210,.16); stroke: var(--atlas-teal); stroke-width: 2; }
.sky-dialog .wheel-sector.birth-sign .wheel-sector-fill { fill: rgba(239,209,154,.24); stroke: var(--atlas-gold); }
.sky-dialog .wheel-sector:focus { outline: none; }
.sky-dialog .wheel-sector:focus-visible .wheel-sector-fill { stroke: #fff6e8; stroke-width: 3; }
.sky-chart-legend { margin-top: 14px; color: #bfd0d8; text-align: center; font-size: 12px; line-height: 1.7; }
.sky-chart-legend span { color: var(--atlas-gold); }
.sky-sign-detail { min-width: 0; min-height: 0; overflow: auto; padding: 13px 0 0 26px; border-left: 1px solid var(--atlas-line); }
.sky-sign-detail .reading-label { color: var(--atlas-teal); font: 10px/1.6 "DM Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.sky-sign-detail h3 { margin-top: 13px; font: 600 36px/1.15 "Playfair Display", serif; }
.sky-sign-detail .sky-sign-dates { margin-top: 10px; color: var(--atlas-gold); font-size: 11px; }
.sky-sign-detail dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 14px; padding: 22px 0; border-block: 1px solid var(--atlas-line); margin: 22px 0; }
.sky-sign-detail dt { color: var(--atlas-gold); font: 10px "DM Mono", monospace; text-transform: uppercase; }
.sky-sign-detail dd { margin: 7px 0 0; color: #fff3dc; font: 20px/1.35 "Playfair Display", serif; }
.sky-sign-detail p { color: #d0dee3; font-size: 14px; line-height: 1.8; }
.sky-explorer-prompt { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--atlas-line); }
.sky-explorer-prompt strong { display: block; margin-bottom: 9px; color: var(--atlas-teal); font-size: 12px; }
.sky-explorer-note { flex: 0 0 auto; margin: 0; padding: 13px 26px; border-top: 1px solid var(--atlas-line); color: #b2c5d0; font-size: 11px; line-height: 1.6; }
@media (max-width: 1000px) {
  #birthday-room { grid-template-columns: 1fr; gap: 27px; padding: 26px; }
  #birthday-room .birthday-intro { position: relative; padding-left: 82px; }
  .celestial-emblem { position: absolute; left: 0; top: 5px; }
  #birthday-room .birthday-intro h3 { max-width: none; }
  #birthday-room .birthday-intro > p:last-child { max-width: 650px; }
  .celestial-portrait { gap: 25px; }
  #birthday-room .sky-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sky-dialog-layout { grid-template-columns: minmax(0,1fr) 265px; gap: 18px; padding-inline: 18px; }
  .sky-sign-detail { padding-left: 18px; }
}
@media (max-width: 700px) {
  #birthday-room { margin-inline: -5px; padding: 20px 14px; }
  #birthday-room .birthday-intro { padding-left: 0; }
  .celestial-emblem { position: static; width: 52px; height: 52px; margin-bottom: 18px; font-size: 34px; }
  #birthday-room .birthday-intro h3 { font-size: 36px; }
  #birthday-room .birthday-form { gap: 17px 10px; }
  #birthday-room .birthday-form input { padding-inline: 8px; }
  #birthday-room .birthday-button { grid-column: 1 / -1; }
  #birthday-room .birthday-navigation { gap: 6px; margin-bottom: 19px; }
  #birthday-room .birthday-navigation button { padding: 10px 11px; font-size: 12px; }
  .celestial-portrait { grid-template-columns: 1fr; gap: 30px; padding-top: 0; }
  #birthday-room .horoscope-card h4 { font-size: clamp(40px,10vw,58px); }
  #birthday-room .horoscope-copy { font-size: 15px; }
  #birthday-room .sky-facts { grid-template-columns: 1fr; gap: 0; }
  #birthday-room .sky-fact { min-height: 0; padding-block: 22px; padding-left: 53px; }
  #birthday-room .sky-fact dd { font-size: 23px; }
  #birthday-room .horoscope-lenses { grid-template-columns: 1fr; gap: 25px; }
  .sky-dialog { width: calc(100% - 16px); height: calc(100dvh - 16px); }
  .sky-dialog-header { padding: 17px; }
  .sky-dialog-header h2 { font-size: 25px; }
  .sky-dialog-layout { display: block; overflow: auto; padding: 16px; }
  .sky-explorer-chart { height: min(68vh,560px); }
  .sky-zoom-viewport { min-height: 230px; }
  .sky-sign-detail { overflow: visible; margin-top: 24px; padding: 22px 0 0; border-left: 0; border-top: 1px solid var(--atlas-line); }
  .sky-sign-detail h3 { font-size: 35px; }
  .sky-explorer-note { padding: 11px 17px; font-size: 10px; }
  .natal-big-three { gap: 7px; }
  .natal-big-three button { padding: 13px 9px; }
  .natal-big-three strong { font-size: 16px; overflow-wrap: anywhere; }
  .natal-big-three small { font-size: 10px; }
  .natal-report > header { align-items: start; flex-direction: column; gap: 16px; }
  .natal-report > header h4 { font-size: 28px; }
  .natal-report-nav { gap: 5px; }
  .natal-report-nav button { padding: 9px 11px; font-size: 12px; }
  .natal-house-grid, .natal-aspect-grid, .natal-balance-grid { grid-template-columns: 1fr; }
  .natal-balance-grid { gap: 14px; }
}
@media (max-width: 480px) {
  #birthday-room .birthday-form { grid-template-columns: 1fr; }
  .natal-settings-grid, .natal-manual-fields { grid-template-columns: 1fr; }
  .natal-big-three { grid-template-columns: 1fr; }
  .natal-big-three button { display: grid; grid-template-columns: 53px minmax(0,1fr) 50px; align-items: center; gap: 9px; min-height: 65px; }
  .natal-big-three strong, .natal-big-three small { margin: 0; }
  .natal-big-three strong { font-size: 21px; }
}
@media print {
  @page { margin: 14mm; }
  body, .shell, .reading-room, #birthday-room { margin: 0 !important; padding: 0 !important; background: #fff !important; box-shadow: none !important; border: 0 !important; display: block !important; }
  .grain, .masthead, .brand-lockup, .reading-intro, .reading-deck-picker, .reading-controls, .reading-output, .ishtar-library, .reading-note, .toolbar, .gallery-head, .gallery, .footer, .birthday-intro, .birthday-form, .birthday-navigation, .birthday-privacy, #birthday-chinese, #birthday-numbers, .detail-dialog, .sky-dialog, .natal-report-nav, .natal-report > header > button, .natal-aspect-filter, .sky-chart-invitation, .sky-chart-caption, #birthday-room .insight-method { display: none !important; }
  #birthday-sky, .natal-report-panel[hidden] { display: block !important; }
  #birthday-room { --atlas-gold: #604310; --atlas-teal: #235364; --atlas-line: #b5a991; --cream: #151c23; color: #151c23 !important; }
  #birthday-room p, #birthday-room th, #birthday-room td, #birthday-room button, #birthday-room small, #birthday-room strong, #birthday-room h4 { color: #151c23 !important; }
  .natal-big-three button, .sky-chart-launch { background: transparent !important; }
  .celestial-portrait { grid-template-columns: 1fr 1fr; gap: 20px; break-inside: avoid; }
  #birthday-room .horoscope-card h4 { font-size: 35px; }
  #birthday-room .horoscope-copy { font-size: 11px; }
  .natal-big-three { grid-template-columns: repeat(3,1fr); }
  .natal-big-three button { display: block; }
  .natal-big-three strong { font-size: 18px; }
  #birthday-room .sky-facts { grid-template-columns: repeat(3,1fr); }
  .natal-report-panel { margin-top: 25px; }
  .natal-table-scroll { overflow: visible; }
  .natal-report table { min-width: 0; }
  .natal-report tr, .natal-house-grid button, .natal-aspect-grid button { break-inside: avoid; }
  .natal-house-grid, .natal-aspect-grid, .natal-balance-grid { grid-template-columns: repeat(2,1fr); }
  .reading-room::before, .reading-room::after { display: none !important; }
}
