.sky-readouts{display:none}
.sky-readout-dialog{width:min(560px,calc(100vw - 24px));max-height:88svh;margin:auto;padding:20px;border:1px solid #c3a56c80;border-radius:14px;background:#081321f5;color:#dbe5ed;box-shadow:0 24px 100px #000a;overflow:auto}
.sky-readout-dialog::backdrop{background:#010714b8;backdrop-filter:blur(5px)}
.readout-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;top:-20px;background:#081321;z-index:1;padding:10px 0}
.readout-dialog-header h2{font-size:calc(24px * var(--sky-text-scale,1));font-weight:400;margin:0;color:#ebd5a4;line-height:1.4}
.readout-dialog-header button{flex:none;font-size:24px;min-width:44px;min-height:44px;padding:2px}
.readout-context,.readout-note{font-size:calc(13px * var(--sky-text-scale,1));line-height:1.8;color:#a5b8cc;overflow-wrap:anywhere}
.readout-hero{font-size:calc(30px * var(--sky-text-scale,1));font-variant-numeric:tabular-nums;color:#eedab2;line-height:1.5;margin:14px 0}
.readout-values{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin:24px 0}
.readout-values>div{min-width:0;border-bottom:1px solid #bbd1ea20;padding-bottom:12px}
.readout-values dt{font-size:calc(12px * var(--sky-text-scale,1));color:#99b1c9;line-height:1.6}
.readout-values dd{font-size:calc(19px * var(--sky-text-scale,1));margin:5px 0 0;line-height:1.5;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.readout-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-top:12px}
.readout-choices button{font-size:calc(15px * var(--sky-text-scale,1));min-height:44px;padding:8px 4px}.readout-choices button[aria-pressed=true]{border-color:#d6b674;color:#ffe1a5;background:#bda56819}
@media(max-width:600px),(max-height:800px){
 .phone-sky .observatory.has-readouts:not(.clock-view):not(.launching) .sky-readouts{display:block;position:absolute;left:14px;right:14px;bottom:var(--mobile-footer-height,86px);z-index:5;background:linear-gradient(180deg,#091421a8,#081320f5);border-top:1px solid #b6c9dc26;padding-top:4px}
 .phone-sky .observatory.has-readouts:not(.clock-view):not(.launching) #viewport{bottom:calc(var(--mobile-footer-height,86px) + var(--sky-readouts-height,86px))}
 .readout-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#8fa9bf;line-height:1.4;font-size:calc(9px * var(--sky-text-scale,1));padding:0 3px 3px}
 .readout-heading .readout-expand{font-size:calc(9px * var(--sky-text-scale,1));line-height:1.4;min-height:20px;border:0;padding:0 2px;color:#b9c9dc}
 .readout-grid{display:grid;grid-template-columns:repeat(var(--readout-columns,5),minmax(0,1fr));gap:3px}
 .readout-grid .readout-cell{border-color:#afc8e716;border-radius:3px;background:#14243760;padding:3px 2px;min-width:0;min-height:31px;line-height:1.35;text-align:left;overflow:hidden}
 .readout-grid .readout-cell[aria-pressed=true]{border-color:#d6b67475;background:#bba46e13}
 .readout-name{display:block;font-size:calc(9px * var(--sky-text-scale,1));font-weight:400;color:#9fb3c6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .readout-number{display:block;font:400 calc(10px * var(--sky-text-scale,1))/1.5 ui-monospace,"Segoe UI Symbol",monospace;color:#e1d0aa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
 .phone-sky .observatory:not(.clock-view):not(.launching) #viewport .star-label:not([hidden]){display:block!important;pointer-events:auto;cursor:pointer;font-size:calc(9px * var(--sky-text-scale,1));line-height:1.4;letter-spacing:0;min-height:0;padding:2px 4px;white-space:nowrap;color:#a8bed3;background:#0715248c;border:1px solid #aac6e21c;max-width:130px;overflow:hidden;text-overflow:ellipsis}
 .phone-sky .observatory #viewport .star-label.selected{color:#f4db9e!important;border-color:#d6b87985!important;background:#142432d9!important}
 .phone-sky .star-label.bilingual-label::after{display:none}
}
@media(min-width:601px) and (max-height:800px){.readout-grid{grid-template-columns:repeat(10,minmax(0,1fr))}.sky-readouts:not([data-mode=chart]):not([data-mode=solar]):not([data-mode=map]) .readout-grid{grid-template-columns:repeat(var(--readout-columns,4),minmax(0,1fr))}}
@media(max-width:360px){.readout-name{font-size:calc(8px * var(--sky-text-scale,1))}.readout-number{font-size:calc(9px * var(--sky-text-scale,1))}.sky-readout-dialog{padding:16px}.readout-values{gap:14px 10px}.readout-values dd{font-size:calc(17px * var(--sky-text-scale,1))}}
