@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{color-scheme:dark;--bg:#091524;--panel:#112238;--line:#29415a;--gold:#deb879;--muted:#a4b3c3;--text:#f7f4ec;font-family:'DM Sans',sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 78% 5%,#193651 0%,transparent 35%),var(--bg);color:var(--text);min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}.app-shell{max-width:1240px;margin:auto;padding:0 34px}.topbar{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff1a}.brand{display:flex;align-items:center;gap:12px;font-size:20px;letter-spacing:-.03em}.brand strong{color:var(--gold);font-weight:600}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--gold);border-radius:50%;color:var(--gold);font-size:25px}.header-actions{display:flex;align-items:center;gap:25px}.eyebrow,.overline{font-size:12px;font-weight:700;letter-spacing:.24em;color:var(--gold)}.text-button{background:transparent;border:1px solid var(--line);border-radius:9px;padding:9px 13px;color:var(--text)}.intro{display:flex;align-items:center;justify-content:space-between;min-height:290px;overflow:hidden}.intro h1{font-family:'Playfair Display',serif;font-size:clamp(37px,5.2vw,70px);line-height:1.1;letter-spacing:-.04em;margin:14px 0 15px;font-weight:500}.intro h1 em{display:block;color:var(--gold);font-weight:500}.intro-copy{color:var(--muted);font-size:17px;margin:0}.orb{width:260px;height:260px;flex:0 0 260px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#b58045 0%,#3b453f 24%,#183049 55%,transparent 70%);position:relative;opacity:.9}.orb-ring{position:absolute;width:222px;height:222px;border:1px solid #deb87977;border-radius:50%;box-shadow:0 0 70px #d6a66333}.orb-core{font-size:85px;color:#f1cb8a;text-shadow:0 0 50px #d9a75d}.controls{display:flex;align-items:end;gap:14px;padding:18px;background:#14273c;border:1px solid var(--line);border-radius:16px}.controls label{display:flex;flex-direction:column;gap:9px;flex:1}.controls label span,.card-top,.solar-card p{font-size:12px;font-weight:700;letter-spacing:.15em;color:var(--muted)}.controls select,.controls input{background:#0b1c2d;color:var(--text);border:1px solid #385069;border-radius:9px;height:48px;padding:0 14px;width:100%;min-width:0}.today-button{height:48px;padding:0 24px;background:var(--gold);border:0;border-radius:9px;font-weight:700;color:#152234}.status{min-height:25px;color:#e6b4a2}.overview{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;margin-top:6px}.current-card,.solar-card{border:1px solid var(--line);border-radius:18px;min-height:216px;background:linear-gradient(135deg,#1a3551,#11263d)}.current-card{padding:24px 28px}.card-top{display:flex;justify-content:space-between;align-items:center}.live-badge{font-size:11px;color:#9cdbbd;letter-spacing:.07em}.current-main{display:flex;align-items:center;gap:22px;margin:16px 0}.planet-symbol{font-size:40px;width:68px;height:68px;display:grid;place-items:center;background:#d9b2701e;border:1px solid #d9b27055;border-radius:50%;color:var(--gold)}.current-name{font-family:'Playfair Display',serif;font-size:31px;margin:0}.current-range,.current-note{color:var(--muted);margin:6px 0 0}.current-note{font-size:14px}.solar-card{display:flex;align-items:center;justify-content:space-evenly;background:#101f32}.solar-card>div:not(.solar-divider){text-align:center}.solar-icon{font-size:35px;color:var(--gold)}.sunset-icon{color:#b3bbdf}.solar-card p{margin:11px 0 8px}.solar-card strong{font-size:30px;font-weight:500}.solar-divider{width:1px;height:75px;background:var(--line)}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-top:44px}.section-heading h2{font-family:'Playfair Display',serif;font-size:36px;font-weight:500;margin:5px 0 15px}.section-heading>p{color:var(--muted);font-size:14px}.tabs{display:flex;gap:10px;border-bottom:1px solid var(--line);margin-bottom:18px}.tabs button{border:0;background:transparent;color:var(--muted);padding:15px 18px;font-size:15px;border-bottom:2px solid transparent}.tabs button.active{color:var(--gold);border-bottom-color:var(--gold)}.hours-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.hour-card{background:#102238;border:1px solid var(--line);border-radius:13px;padding:18px;min-height:137px}.hour-card.current{border-color:var(--gold);box-shadow:inset 0 0 0 1px #deb87955}.hour-top{display:flex;justify-content:space-between;color:var(--muted);font-size:13px}.hour-number{color:var(--gold)}.hour-card h3{font-family:'Playfair Display',serif;font-size:24px;margin:15px 0 7px;font-weight:500}.hour-card p{color:var(--muted);font-size:14px;margin:0;line-height:1.45}.hour-card details{margin-top:12px}.hour-card summary{color:var(--gold);font-size:13px;cursor:pointer}.hour-card details p{padding-top:8px}.ad-slot{margin:40px auto;border:1px dashed #58718a;border-radius:13px;text-align:center;max-width:750px;padding:25px;color:var(--muted)}.ad-slot span{font-size:11px;letter-spacing:.22em}.ad-slot p{margin:8px 0 0;font-size:14px}footer{border-top:1px solid var(--line);padding:26px 0 40px;display:flex;justify-content:space-between;gap:30px;color:var(--muted);font-size:13px}footer span{color:var(--gold);font-weight:700}footer p{margin:0;max-width:580px;text-align:right}
@media(max-width:800px){.app-shell{padding:0 18px}.intro{min-height:240px}.orb{width:150px;height:150px;flex-basis:150px}.orb-ring{width:140px;height:140px}.orb-core{font-size:50px}.overview{grid-template-columns:1fr}.hours-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.topbar{height:70px}.header-actions .eyebrow{display:none}.intro{min-height:220px}.intro h1{font-size:40px}.intro-copy{font-size:15px;max-width:260px}.orb{position:absolute;right:-45px;top:100px;opacity:.28;pointer-events:none}.controls{display:grid;grid-template-columns:1fr 1fr;gap:12px}.controls label:first-child{grid-column:1/-1}.today-button{width:100%}.section-heading{align-items:start}.section-heading h2{font-size:30px}.section-heading>p{max-width:110px;text-align:right}.hours-grid{grid-template-columns:1fr}.hour-card{min-height:125px}.solar-card{min-height:170px}.solar-card strong{font-size:25px}footer{display:block}footer p{text-align:left;margin-top:10px}}

/* The working surface is a celestial clock built from dark iron and aged brass. */
:root{--bg:#120f0d;--panel:#241b17;--line:#69513b;--gold:#d9b474;--muted:#b9aa91;--text:#f5e9d3}
body{background:radial-gradient(ellipse at 50% 15%,#3b2a1d 0%,#171310 48%,#0d0c0b 100%);color:var(--text)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.19;background-image:repeating-linear-gradient(0deg,transparent 0 3px,#aa764322 4px 5px);mix-blend-mode:screen}
.topbar{height:73px;border-bottom:1px solid #8a6b4166}.brand-mark{background:#37291a;box-shadow:inset 0 0 0 3px #120e0a,0 0 13px #d1a45b33}.text-button{border-color:#967148;color:var(--gold);background:#2a2119}.intro{min-height:166px;overflow:visible;align-items:end;padding-bottom:24px}.intro h1{font-size:clamp(36px,4.6vw,60px);margin:7px 0 0}.intro h1 em{display:inline}.intro-date{color:var(--muted);white-space:nowrap;padding-bottom:8px}.controls{position:relative;z-index:2;background:linear-gradient(145deg,#32251b,#211a15);border-color:#96754a;box-shadow:inset 0 2px 3px #cfad7650,0 12px 20px #0006}.controls select,.controls input{background:#171410;border-color:#7c6042;color:var(--text)}.today-button{background:linear-gradient(#e7cc93,#ae8048);box-shadow:inset 0 1px #fff7;color:#24170c}.status{margin-bottom:0}
.clock-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(500px,650px) minmax(0,1fr);align-items:center;gap:18px;margin:4px auto 40px}.clock-side{min-width:0;text-align:center;color:var(--muted)}.gear-symbol{display:block;font-size:93px;line-height:1;color:#a37849;text-shadow:2px 3px #090706,0 0 16px #dcae6330;opacity:.65;margin-bottom:26px}.secondary-gear{font-size:120px;transform:rotate(15deg)}.solar-reading{padding:18px 4px}.solar-reading span,.side-title{display:block;font-size:11px;letter-spacing:.18em;font-weight:700;color:#c09c67}.solar-reading strong{display:block;font-family:'Playfair Display',serif;color:#f3d6a0;font-size:28px;font-weight:500;margin-top:6px}.side-rule{height:1px;background:linear-gradient(90deg,transparent,#ad875a,transparent)}.side-copy{font-family:'Playfair Display',serif;font-size:17px;line-height:1.55}.side-ornament{font-size:70px;color:#a58251}
.clock-frame{width:100%;aspect-ratio:1;display:grid;place-items:center;filter:drop-shadow(0 25px 20px #0009)}.clock-rim{width:100%;aspect-ratio:1;border-radius:50%;padding:5.6%;background:radial-gradient(circle at 50% 50%,transparent 69%,#51361e 70%,#bb8c4e 73%,#3b2b20 76%,#1a140f 79%,#b58852 82%,#583f27 84%,#1a130f 86%);box-shadow:inset 0 0 0 2px #d9ba7b,inset 0 0 20px 10px #080604,0 0 0 2px #49321f,0 0 0 5px #a6763b,0 0 0 8px #211710}.clock-face{height:100%;width:100%;border-radius:50%;position:relative;overflow:hidden;background:radial-gradient(circle at 48% 45%,#51402b 0%,#2b211a 38%,#191511 67%,#100e0c 100%);border:2px solid #bb9559;box-shadow:inset 0 0 55px #000b,inset 0 0 0 4px #332415,inset 0 0 0 8px #a9814a}.clock-face::before{content:"";position:absolute;inset:5%;border-radius:50%;border:1px solid #b6955855;box-shadow:0 0 0 19px #ba89470e,inset 0 0 0 1px #f0ca7f33;pointer-events:none}.clock-face::after{content:"✦";position:absolute;inset:47%;font-size:18px;color:#b38951;text-align:center;pointer-events:none}.clock-ticks{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from -1deg,#f0c784 0 1deg,transparent 1deg 15deg);mask:radial-gradient(circle,transparent 0 81%,#000 82% 83%,transparent 84%);pointer-events:none}.clock-hours{position:absolute;inset:0;z-index:3}.clock-hour{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:45px;height:55px;border:1px solid #97724788;border-radius:22px 22px 13px 13px;background:linear-gradient(#3b2d20,#181411);color:#d0b17d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;box-shadow:inset 0 1px #e8bd7040,0 2px 5px #000b;padding:2px;z-index:2}.clock-hour img{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 1px 2px #000)}.clock-hour span{font-size:10px;letter-spacing:.05em;line-height:1}.clock-hour.night-hour{background:linear-gradient(#282737,#15131c);border-color:#a7a0b066}.clock-hour.active{border:2px solid #f9d999;background:linear-gradient(#805a30,#332318);box-shadow:0 0 0 4px #cba36844,0 0 19px #f4be66aa;z-index:5}.clock-hour:focus-visible{outline:3px solid #fff;outline-offset:3px}.clock-hand{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;filter:drop-shadow(1px 3px 3px #000)}.clock-hand line{stroke:#f5d59a;stroke-width:9;stroke-linecap:round}.clock-hand circle{fill:#f5d59a;stroke:#60401c;stroke-width:4}.clock-hand.historical line{stroke:#ae9775;stroke-dasharray:15 13}.clock-hand.historical circle{fill:#ae9775}.clock-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:43%;aspect-ratio:1;border-radius:50%;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6% 4%;background:radial-gradient(circle at 50% 30%,#3c2b20 0%,#1b1612 70%);border:3px double #dfb975;box-shadow:0 0 0 5px #1b130d,0 0 0 7px #7c5933,inset 0 0 30px #000b,0 10px 20px #000c}.clock-center::before{content:"";position:absolute;inset:5px;border:1px solid #b58a4f88;border-radius:50%;pointer-events:none}.clock-center img{width:27%;max-height:27%;object-fit:contain;filter:drop-shadow(0 0 12px #f9cb7b55)}.clock-center .live-badge{font-size:clamp(8px,.8vw,11px);letter-spacing:.12em;color:#e3c182;margin-bottom:3%}.clock-center .current-name{font-size:clamp(20px,2.4vw,31px);line-height:1.15;margin:2% 0;color:#ffe3ac}.clock-center .current-range{font-size:clamp(11px,1.2vw,15px);margin:0;color:#eee0c3}.clock-center .current-note{font-size:clamp(10px,1vw,13px);color:#d4ad75;text-transform:uppercase;letter-spacing:.11em;margin:3% 0 0}.current-description{font-size:clamp(9px,.95vw,12px);line-height:1.35;margin:3% 0 0;color:#d4c5ac;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:95%}
.section-heading{margin-top:30px}.section-heading>p{max-width:280px;line-height:1.5}.hour-card{background:linear-gradient(145deg,#312319,#191512);border-color:#765638;box-shadow:inset 0 1px #d0a46722}.hour-card.current{border-color:#e6bd7e;box-shadow:inset 0 0 0 1px #deb87955,0 0 18px #bf8a4940}.tabs{border-color:#7a5b3b}.ad-slot{border-color:#70583d;color:#bba990}footer{border-color:#715438}
@media(max-width:1080px){.clock-section{grid-template-columns:1fr;max-width:680px}.clock-side{display:none}.clock-frame{max-width:650px;margin:auto}.intro{min-height:140px}}
@media(max-width:650px){.intro{display:block;min-height:0;padding:29px 0 18px}.intro h1{font-size:39px}.intro-date{display:block;font-size:13px;margin:8px 0 0}.clock-section{margin:14px -7px 24px}.clock-rim{padding:5.5%}.clock-hour{width:clamp(24px,7vw,40px);height:clamp(31px,9vw,50px);border-radius:14px 14px 8px 8px}.clock-hour img{width:clamp(17px,5vw,25px);height:clamp(17px,5vw,25px)}.clock-hour span{font-size:8px}.clock-center{width:45%;padding:5% 3%}.clock-center .current-name{font-size:clamp(16px,4.5vw,26px)}.clock-center .current-range{font-size:clamp(9px,2.7vw,13px)}.clock-center .current-note{font-size:9px}.current-description{font-size:clamp(8px,2vw,11px);-webkit-line-clamp:2}.clock-center .live-badge{font-size:8px}.section-heading{margin-top:20px}}
.clock-rim{background:radial-gradient(circle at 19% 27%,#8f482750,transparent 9%),radial-gradient(circle at 81% 65%,#9c4d2c66,transparent 12%),radial-gradient(circle at 62% 11%,#612e1b88,transparent 10%),radial-gradient(circle at 50% 50%,transparent 69%,#51361e 70%,#bb8c4e 73%,#3b2b20 76%,#1a140f 79%,#b58852 82%,#583f27 84%,#1a130f 86%)}
.current-description{-webkit-line-clamp:2}

/* A winding crown changes the visible twelve-hour face. */
.controls .secondary{background:linear-gradient(#3b2d22,#211912);color:#e8cb96;border:1px solid #92704b;box-shadow:inset 0 1px #d7a97144}
.clock-assembly{width:100%;position:relative;display:flex;flex-direction:column;align-items:center}
.crown-row{height:86px;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:17px;position:relative;z-index:8;margin-bottom:-18px}
.crown-side{display:flex;flex-direction:column;align-items:center;gap:0;width:58px;padding-bottom:25px;color:#857767;font-family:'Playfair Display',serif;font-size:31px;line-height:1;transition:color .35s,text-shadow .35s,transform .35s}
.crown-side small{font-family:'DM Sans',sans-serif;font-size:10px;letter-spacing:.17em;margin-top:8px;font-weight:700}
.clock-assembly[data-face="night"] .night-side,.clock-assembly[data-face="day"] .day-side{color:#f3d39a;text-shadow:0 0 22px #e5b96a9e;transform:translateY(-3px)}
.watch-crown{width:100px;height:100px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 0 9px;border:0;background:transparent;position:relative;cursor:pointer;filter:drop-shadow(0 5px 5px #000b)}
.watch-crown:focus-visible{outline:2px solid #ffe0a0;outline-offset:2px;border-radius:16px}
.watch-crown:disabled{cursor:default}
.crown-cap{width:67px;height:37px;border-radius:18px 18px 7px 7px;position:relative;z-index:3;border:2px solid #d2a464;background:repeating-linear-gradient(90deg,#3a281a 0 4px,#b0874e 4px 7px,#5d3b20 7px 10px);box-shadow:inset 0 5px 6px #f1ce8c9c,inset 0 -6px 4px #140d08,0 0 0 3px #20160f}
.crown-cap::before{content:"✦";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:32px;height:27px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#a77a42,#3c291a);border:1px solid #e0bb7d;color:#f5dba6;font-size:16px;text-shadow:0 1px #000}
.crown-neck{width:35px;height:18px;background:linear-gradient(90deg,#302012,#b88b50,#402613);border-left:2px solid #d0a461;border-right:2px solid #d0a461;box-shadow:inset 0 2px 4px #000b;z-index:2}
.crown-base{width:78px;height:16px;border-radius:20px 20px 4px 4px;background:linear-gradient(#9a6d3c,#352314);border:2px solid #c49558;box-shadow:inset 0 2px #e4bd79;z-index:1}
.clock-rim{position:relative}.clock-ticks{background:repeating-conic-gradient(from -1deg,#f0c784 0 1.3deg,transparent 1.3deg 30deg)}
.gear-train{position:absolute;inset:0;border-radius:50%;overflow:hidden;z-index:1;pointer-events:none;background:linear-gradient(135deg,transparent 36%,#98704416 37% 39%,transparent 40% 58%,#b08a5218 59% 61%,transparent 62%)}
.gear-train::before,.gear-train::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#ebcb87 15%,#5f3c1f 25%,#100c09 70%);box-shadow:0 0 0 2px #ac7c42;z-index:1}
.gear-train::before{left:24%;top:23%}.gear-train::after{right:24%;bottom:22%}
.mechanical-gear{position:absolute;opacity:.68;filter:drop-shadow(2px 4px 3px #000c);transform-origin:center;animation:gearTurn 28s linear infinite}
.gear-one{width:27%;left:12%;top:19%}.gear-two{width:23%;right:11%;top:25%;animation-direction:reverse;animation-duration:22s}.gear-three{width:19%;left:25%;bottom:11%;animation-duration:18s}
.gear-teeth{fill:#75512d;stroke:#b98e52;stroke-width:1.8}.gear-well{fill:#2e2118;stroke:#d2a364;stroke-width:5}.gear-spoke{stroke:#a9783b;stroke-width:5;stroke-linecap:round}.gear-axle{fill:#19130f;stroke:#e0b678;stroke-width:4}
.hour-card.selected:not(.current){border-color:#b99255;box-shadow:inset 0 0 0 1px #b9925544}
.clock-assembly.is-switching .clock-rim{animation:clockTurn 860ms cubic-bezier(.34,.04,.25,1) both}
.clock-assembly.is-switching .watch-crown{animation:crownPress 860ms ease-in-out both}
.clock-assembly.is-switching .clock-hours,.clock-assembly.is-switching .clock-center,.clock-assembly.is-switching .clock-hand{animation:faceVanish 860ms ease-in-out both}
.clock-assembly.is-switching .mechanical-gear{animation-duration:1.2s}
@keyframes gearTurn{to{transform:rotate(360deg)}}
@keyframes crownPress{0%,100%{transform:translateY(0)}32%,56%{transform:translateY(19px)}}
@keyframes clockTurn{0%{transform:rotate(0) scale(1)}49%{transform:rotate(178deg) scale(.96)}100%{transform:rotate(360deg) scale(1)}}
@keyframes faceVanish{0%,32%,100%{opacity:1}47%,56%{opacity:0}}
@media(max-width:560px){.controls label{grid-column:1/-1}.controls button{width:100%;padding:0 9px}.crown-row{height:78px;margin-bottom:-16px;gap:7px}.watch-crown{width:81px;transform-origin:center bottom}.crown-side{width:52px;font-size:25px;padding-bottom:26px}.crown-cap{width:60px}}
@media(prefers-reduced-motion:reduce){.mechanical-gear,.clock-assembly.is-switching .clock-rim,.clock-assembly.is-switching .watch-crown,.clock-assembly.is-switching .clock-hours,.clock-assembly.is-switching .clock-center,.clock-assembly.is-switching .clock-hand{animation:none!important}html{scroll-behavior:auto}}

/* The joined day and night faces form one figure-eight watch. */
.twin-clock-section{display:block;max-width:1240px;margin:8px auto 26px;overflow:visible}
.data-source{margin:15px 0 0;color:#d2b885;font-size:12px;letter-spacing:.04em}
.solar-strip{display:flex;justify-content:center;gap:38px;color:#d5b77f;font-size:12px;font-weight:700;letter-spacing:.12em;margin:0 0 6px;text-align:center}
.solar-strip strong{font-family:'Playfair Display',serif;font-size:19px;font-weight:500;color:#ffe1a6;margin-left:6px;letter-spacing:0}
.twin-assembly{position:relative;display:block;padding-top:76px}
.twin-crown{position:absolute;top:0;left:calc(50% - 50px);z-index:12}
.twin-dials{display:flex;align-items:flex-start;justify-content:center;isolation:isolate}
.dial-block{position:relative;width:calc(50% + 26px);min-width:0;flex:none;text-align:center}
.dial-block+.dial-block{margin-left:-52px}
.day-dial{z-index:2}.night-dial{z-index:1}
.dial-title{font-size:12px;font-weight:700;letter-spacing:.23em;color:#e7c892;margin:0 0 16px;text-shadow:0 2px 5px #000}
.night-dial .dial-title{color:#c4c0da}
.twin-dials .clock-frame{max-width:none;filter:drop-shadow(0 18px 18px #000c)}
.night-dial .clock-rim{background:radial-gradient(circle at 21% 20%,#77748b52,transparent 12%),radial-gradient(circle at 50% 50%,transparent 69%,#333246 70%,#aa9a87 73%,#38313a 76%,#14131c 79%,#8e8077 82%,#3f3540 84%,#16131a 86%);box-shadow:inset 0 0 0 2px #d4c3ae,inset 0 0 25px 10px #080604,0 0 0 2px #514956,0 0 0 5px #9b8779,0 0 0 8px #221d24}
.night-dial .clock-face{background:radial-gradient(circle at 48% 45%,#3d3847 0%,#272430 42%,#111116 75%,#08080c 100%);border-color:#b9a99c}
.infinity-bridge{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#a87b43 0 19%,#2b2018 22% 49%,#c3a06b 52% 56%,#211915 60%);border:3px double #d8b77c;color:#ffe2a3;font-size:17px;box-shadow:0 0 0 4px #251a14,0 6px 15px #000b;z-index:6;pointer-events:none}
.twin-dials .clock-hour{width:clamp(53px,5.2vw,72px);height:clamp(58px,5.6vw,76px);border-radius:18px 18px 12px 12px;gap:0}
.twin-dials .clock-hour img{width:clamp(25px,2.5vw,34px);height:clamp(25px,2.5vw,34px)}
.twin-dials .clock-hour span{font-size:10px;line-height:1;font-weight:700}
.twin-dials .clock-hour small{font-size:clamp(7px,.7vw,10px);line-height:1.2;white-space:nowrap;color:#f0d4aa;font-variant-numeric:tabular-nums}
.twin-dials .clock-hour.live-hour{background:linear-gradient(#b88b4f,#49321e);border:2px solid #ffe5a9;box-shadow:0 0 0 4px #f7cc7955,0 0 23px #f3c675b3;z-index:7;transform:translate(-50%,-50%) scale(1.15)}
.twin-dials .clock-hour.live-hour img{width:clamp(34px,3.4vw,48px);height:clamp(34px,3.4vw,48px)}
.twin-dials .clock-center{width:38%;padding:4% 2%;border-width:2px;z-index:4}
.twin-dials .clock-center img{width:38%;max-height:38%}
.twin-dials .clock-center.is-current{box-shadow:0 0 0 5px #1b130d,0 0 0 8px #f0c174,0 0 32px #eec27588,inset 0 0 30px #000b}
.twin-dials .clock-center .current-name{font-size:clamp(18px,2vw,27px)}
.twin-dials .clock-center .current-range{font-size:clamp(10px,1vw,14px);font-variant-numeric:tabular-nums}
.twin-dials .clock-center .live-badge{font-size:clamp(7px,.65vw,10px)}
.twin-dials .gear-train{opacity:.43}
.hours-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.twin-clock-section{overflow-x:auto;overflow-y:hidden;scrollbar-color:#aa8250 #19120e}.twin-assembly{min-width:850px}.twin-dials .clock-hour{width:58px;height:65px}.twin-dials .clock-hour small{font-size:8px}.hours-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.solar-strip{min-width:850px;gap:24px}.twin-assembly{min-width:850px}.hours-grid{grid-template-columns:1fr}.twin-clock-section{margin-left:-18px;margin-right:-18px}.twin-clock-section::after{content:'← Saatleri görmek için kaydırın →';display:block;text-align:center;color:#d4b783;font-size:11px;letter-spacing:.08em;padding:8px}}

/* Celestial panorama and interactive hour details. */
body{background:#080b10}
.app-shell{max-width:1760px;min-height:100vh;position:relative;isolation:isolate}
.app-shell::before{content:"";position:absolute;z-index:-2;inset:0 0 auto;height:min(1050px,88vw);background:linear-gradient(180deg,#080b10 0%,#080b1020 15%,#080b1000 65%,#080b10 100%),url('art/celestial-horizon.png') center top/cover no-repeat;pointer-events:none}
.app-shell::after{content:"";position:absolute;z-index:-1;inset:0 0 auto;height:min(1050px,88vw);background:linear-gradient(90deg,#05080ac9 0%,transparent 23% 77%,#05080ac9 100%);pointer-events:none}
.topbar{margin:0 -34px;padding:0 34px;background:#080c10e9;border:1px solid #a67a4166;box-shadow:0 4px 17px #000a;position:relative;z-index:20}
.brand{font-family:'Playfair Display',serif;letter-spacing:.16em;text-transform:uppercase;font-size:20px}.brand strong{color:#f3ce88}.brand small{display:block;font-family:'DM Sans',sans-serif;font-size:9px;color:#b99b6a;letter-spacing:.2em;margin-top:3px}.brand-mark{font-size:29px;width:45px;height:45px}
.intro{min-height:100px;justify-content:center;text-align:center;padding:15px 0 5px}.intro h1{font-size:clamp(29px,3.4vw,48px);margin:0;color:#ffe3aa;text-shadow:0 3px 9px #000}.intro .overline{margin:0 0 3px}.intro-date{position:absolute;right:38px;top:91px;font-size:12px;color:#f4ddb2;text-shadow:0 2px 4px #000}
.controls{max-width:850px;margin:0 auto;background:#110e0cdd;border-radius:4px;padding:10px 12px;backdrop-filter:blur(8px)}.controls select,.controls input{height:41px;border-radius:3px}.controls .today-button{height:41px;border-radius:3px}.status,.data-source{text-align:center}.data-source{margin:3px auto 0;text-shadow:0 2px 3px #000}
.twin-clock-section{max-width:1710px;margin:0 auto 0;display:grid;grid-template-columns:minmax(185px,250px) minmax(0,1fr) minmax(185px,250px);gap:10px;align-items:center}
.solar-strip{grid-column:1/-1;margin:3px 0 -5px;text-shadow:0 2px 5px #000}
.hero-copy{grid-column:1;grid-row:2;text-align:center;align-self:center;color:#f5e8ce;text-shadow:0 2px 6px #000;padding:0 7px 35px}.hero-sun{font-size:72px;line-height:1;color:#ffd27e;text-shadow:0 0 18px #f4a947,0 0 50px #ed9039}.hero-copy h2{font-family:'Playfair Display',serif;font-size:clamp(27px,2.6vw,42px);line-height:1.12;font-weight:500;margin:9px 0 15px}.hero-copy h2 em{color:#fbd18c;font-weight:500}.hero-copy p{font-size:13px;line-height:1.7;color:#f1dcc2}.ornament-line{display:block;color:#eac486;font-size:25px;margin:8px}.ornate-link{display:inline-flex;justify-content:space-between;gap:15px;border:1px solid #a87b45;color:#f9db9b;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:12px;background:#130e0bce;box-shadow:inset 0 0 0 2px #2e2216,0 4px 10px #0008}
.twin-assembly{grid-column:2;grid-row:2;min-width:0;padding-top:58px}.twin-dials .clock-hour{width:clamp(39px,4.1vw,66px);height:clamp(45px,4.8vw,72px)}.twin-dials .clock-hour img{width:clamp(23px,2.9vw,39px);height:clamp(23px,2.9vw,39px)}.twin-dials .clock-hour.live-hour img{width:clamp(30px,3.6vw,49px);height:clamp(30px,3.6vw,49px)}.twin-dials .clock-hour small{font-size:clamp(6px,.6vw,9px)}.twin-dials .clock-center{cursor:pointer}.twin-dials .clock-center:focus-visible{outline:3px solid #fff;outline-offset:8px}.twin-dials .clock-center img{width:43%;max-height:43%}
.current-panel{grid-column:3;grid-row:2;align-self:center;background:#0c1014e8;border:1px solid #a67843;color:#f8e9ce;box-shadow:inset 0 0 0 3px #21180f,0 6px 25px #000b;padding:17px;text-align:center;margin-bottom:25px;min-width:0}.panel-flourish{display:block;color:#e2ba75;font-size:24px}.panel-label{font-size:11px;letter-spacing:.17em;color:#e9c385;margin:7px 0 8px;font-weight:700}.current-panel img{width:66px;height:66px;object-fit:contain}.current-panel h2,.current-panel h3{font-family:'Playfair Display',serif;font-weight:500;margin:5px 0;font-size:24px}.current-panel h3{font-size:19px}.panel-range{font-size:15px;color:#f7dba3;margin:4px}.panel-separator{margin:16px auto 10px;border-top:1px solid #8d6a43;color:#e6c17e;line-height:0;width:85%}.panel-separator::first-letter{background:#0c1014}
.under-clock{display:flex;align-items:center;justify-content:center;gap:25px;text-align:center;color:#d7b881;font-size:11px;letter-spacing:.17em;max-width:900px;margin:0 auto;padding:8px 0 16px}.under-clock p{margin:0;color:#f6e1b6}.ad-slot{margin-top:20px;background:#0a0d10dc}
.under-clock a{color:#f3c77f;text-underline-offset:3px;letter-spacing:.04em}.under-clock a[hidden]{display:none}
.hour-dialog{position:fixed;margin:auto;max-width:min(510px,calc(100vw - 28px));width:100%;max-height:calc(100dvh - 30px);overflow:auto;border:1px solid #e0b675;border-radius:4px;background:radial-gradient(circle at 50% 0,#493322,#171312 62%,#0e1115);color:#f8ead0;padding:28px 30px 30px;box-shadow:inset 0 0 0 4px #2b2119,0 20px 80px #000e}.hour-dialog::backdrop{background:#030507c9;backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:13px;top:10px;border:1px solid #a67d4b;background:#1a1513;color:#f5d9a0;border-radius:50%;width:35px;height:35px;font-size:25px;line-height:1}.dialog-heading{display:flex;align-items:center;gap:17px;border-bottom:1px solid #8c6a45;padding:9px 0 18px}.dialog-heading img{width:88px;height:88px;object-fit:contain}.dialog-heading h2{font-family:'Playfair Display',serif;font-size:31px;font-weight:500;margin:0;color:#ffe2ab}.dialog-heading p{margin:5px 0 0;color:#e5c58d;font-variant-numeric:tabular-nums}.dialog-note{font-size:15px;color:#e4c48e;margin:19px 0 8px}.dialog-description{line-height:1.65;color:#f2e7d4;font-size:15px;margin:0}.hour-dialog:focus-visible,.dialog-close:focus-visible{outline:3px solid white}
@media(max-width:1250px){.twin-clock-section{grid-template-columns:minmax(0,1fr)}.solar-strip,.twin-assembly,.hero-copy,.current-panel{grid-column:1;grid-row:auto}.hero-copy{display:none}.twin-assembly{max-width:1050px;width:100%;margin:auto}.current-panel{max-width:600px;width:100%;margin:10px auto;display:grid;grid-template-columns:1fr 1fr;column-gap:15px}.current-panel>*{grid-column:1}.current-panel .panel-separator,.current-panel .panel-separator~*{grid-column:2}.current-panel .panel-separator{grid-row:1;align-self:end}.current-panel .panel-separator~.panel-label{grid-row:2}.current-panel .panel-separator~img{grid-row:3;justify-self:center}.current-panel .panel-separator~h3{grid-row:4}.current-panel .panel-separator~.panel-range{grid-row:5}.intro-date{position:static;margin:6px 0 0}}
@media(max-width:900px){.twin-clock-section{overflow-x:auto;overflow-y:visible}.twin-assembly{min-width:850px}.solar-strip{min-width:850px}.current-panel{min-width:0}.app-shell::before{height:700px;background-size:auto 700px}.app-shell::after{height:700px}}
@media(max-width:560px){.topbar{margin:0 -18px;padding:0 18px}.brand{font-size:15px}.brand small{font-size:7px}.intro{padding-top:18px}.intro h1{font-size:34px}.twin-clock-section{margin-left:-18px;margin-right:-18px}.current-panel{max-width:calc(100vw - 36px)}.under-clock{gap:8px;font-size:9px;letter-spacing:.07em}.solar-strip{padding-left:15px}.hour-dialog{padding:26px 21px}.dialog-heading h2{font-size:26px}}
.twin-dials .clock-hour.live-hour{outline:2px solid #fff4c6;outline-offset:3px;box-shadow:0 0 0 6px #ffd98d66,0 0 18px 7px #f9cc79c9,0 0 42px 15px #f5ae4a89,inset 0 0 13px #ffe6a9a6}
.twin-dials .clock-hour.live-hour::after{content:"";position:absolute;inset:-10px;border-radius:23px;border:1px solid #ffe8bbaa;box-shadow:0 0 22px #ffce79;pointer-events:none}
.hour-changed .clock-hour.live-hour{animation:hourArrival 1.05s ease-out both}.hour-changed .clock-center.is-current{animation:centerArrival 1.05s ease-out both}
@keyframes hourArrival{0%{filter:brightness(1);transform:translate(-50%,-50%) scale(.75)}45%{filter:brightness(2.1);transform:translate(-50%,-50%) scale(1.25)}100%{filter:brightness(1);transform:translate(-50%,-50%) scale(1.15)}}
@keyframes centerArrival{0%{filter:brightness(.7);transform:translate(-50%,-50%) scale(.84)}55%{filter:brightness(1.7);transform:translate(-50%,-50%) scale(1.06)}100%{filter:brightness(1);transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.hour-changed .clock-hour.live-hour,.hour-changed .clock-center.is-current{animation:none}}

/* The supplied ASTRHORA PNG is the watch; only live content is layered on it. */
.topbar{height:98px}.brand-logo{display:block;width:285px;height:84px;object-fit:contain;filter:drop-shadow(0 0 12px #d69b463b)}
.intro{min-height:88px}.intro .overline{color:#eac68a}.intro h1{font-size:clamp(30px,3.2vw,46px)}
.astrhora-section{width:100%;max-width:1672px;margin:0 auto;overflow:visible}.astrhora-section .solar-strip{margin:10px auto -17px;position:relative;z-index:6}
.astrhora-assembly{position:relative;width:100%;aspect-ratio:1672/941;isolation:isolate;margin:auto;filter:drop-shadow(0 22px 25px #000b)}
.astrhora-watch{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;pointer-events:none;z-index:1}
.astrhora-hours{position:absolute;inset:0;z-index:3;pointer-events:none}
.astrhora-hour{position:absolute;width:5.7%;aspect-ratio:1/1.08;transform:translate(-50%,-50%);display:grid;place-items:center;padding:2px;border:1px solid #f7d396a0;border-radius:42% 42% 47% 47%;background:radial-gradient(circle at 42% 27%,#3f2d22d4,#120f11c9 76%);box-shadow:inset 0 0 12px #000b,0 3px 9px #000b,0 0 0 2px #49301d88;pointer-events:auto;z-index:3;color:#ffe8b6;transition:transform .25s,box-shadow .25s,filter .25s;backdrop-filter:blur(2px)}
.astrhora-hour.night-hour{background:radial-gradient(circle at 42% 27%,#293248d8,#0e111bc9 76%);border-color:#b9c9e5ad;box-shadow:inset 0 0 12px #000c,0 3px 9px #000b,0 0 0 2px #526a8c80}
.astrhora-hour:hover,.astrhora-hour:focus-visible{transform:translate(-50%,-50%) scale(1.13);z-index:7;outline:2px solid #fff2c7;outline-offset:3px;box-shadow:0 0 20px #ffe0a0,0 0 0 3px #a86c37}
.astrhora-hour .hour-planet{width:86%;height:80%;object-fit:contain;filter:drop-shadow(0 0 7px #f0bf7468);pointer-events:none}
.astrhora-hour .hour-symbol{position:absolute;left:4%;bottom:1%;width:23%;height:23%;object-fit:contain;pointer-events:none}
.astrhora-hour .hour-index{position:absolute;right:9%;bottom:4%;font-size:clamp(8px,.8vw,14px);font-weight:700;line-height:1;font-variant-numeric:tabular-nums;text-shadow:0 1px 3px #000;pointer-events:none}
.astrhora-hour.live-hour{border:2px solid #fff2bd;box-shadow:0 0 0 4px #f8d67a91,0 0 19px 8px #ffc269bc,0 0 43px 17px #ffc26970,inset 0 0 12px #ffdfa36b;z-index:6;transform:translate(-50%,-50%) scale(1.08)}
.astrhora-hour.selected-hour:not(.live-hour){box-shadow:0 0 0 3px #cda769,0 0 20px #d9ad69;z-index:5}
.astrhora-center{position:absolute;z-index:5;left:50%;top:47%;transform:translate(-50%,-50%);width:19%;height:36%;padding:1.4% 1%;border:0;border-radius:50%;background:transparent;color:#ffe8b9;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;text-shadow:0 2px 5px #000}
.astrhora-center:focus-visible{outline:3px solid #fff3d1;outline-offset:8px}.astrhora-center .center-kicker{font-size:clamp(8px,.7vw,12px);letter-spacing:.15em;font-weight:700;color:#f7d690}.astrhora-center .center-planet{width:47%;height:48%;object-fit:contain;filter:drop-shadow(0 0 16px #f4bf668c);margin:1% auto}.astrhora-center .center-name{font-family:'Playfair Display',serif;font-size:clamp(16px,2vw,34px);font-weight:500;line-height:1.05}.astrhora-center .center-hour{font-size:clamp(8px,.75vw,12px);letter-spacing:.13em;margin-top:4%;color:#f4d6a7}
.astrhora-crown{position:absolute;z-index:7;left:50%;top:7%;transform:translateX(-50%);width:6%;height:15%;border:0;background:transparent;border-radius:50%;cursor:pointer}.astrhora-crown:focus-visible{outline:2px solid white;outline-offset:3px}
.astrhora-dial-label{position:absolute;z-index:2;bottom:1%;font-size:clamp(10px,1.1vw,17px);letter-spacing:.19em;font-weight:700;color:#f8d696;text-shadow:0 2px 6px #000;transform:translateX(-50%)}.astrhora-dial-label.day-label{left:22.2%}.astrhora-dial-label.night-label{left:77.8%;color:#cddfff}
.astrhora-assembly.is-switching .astrhora-watch{animation:watchBreath 860ms ease-in-out}.astrhora-assembly.is-switching .astrhora-hour{animation:slotReveal 860ms ease-in-out}.astrhora-assembly.hour-changed .astrhora-center .center-planet{animation:currentGlow 1050ms ease-out}.astrhora-assembly.hour-changed .astrhora-hour.live-hour{animation:currentGlow 1050ms ease-out}
@keyframes watchBreath{0%,100%{filter:brightness(1)}48%{filter:brightness(1.55)}}@keyframes slotReveal{0%,100%{opacity:1}48%{opacity:.22}}@keyframes currentGlow{0%{filter:brightness(.65) drop-shadow(0 0 0 #fff)}55%{filter:brightness(1.8) drop-shadow(0 0 22px #ffe2a2)}100%{filter:brightness(1) drop-shadow(0 0 8px #f4bf66)}}
.dialog-heading img{width:112px;height:112px}.hour-dialog{border-color:#f2cf8d;background:radial-gradient(circle at 50% 0,#473225,#100e11 70%);box-shadow:inset 0 0 0 4px #3b291a,0 24px 90px #000e}.dialog-heading{border-color:#c6995e}
@media(max-width:960px){.astrhora-section{overflow-x:auto;scrollbar-color:#bb8b51 #131016}.astrhora-assembly{min-width:950px}.astrhora-section .solar-strip{min-width:950px}.astrhora-hour .hour-index{font-size:10px}.astrhora-center .center-kicker{font-size:8px}.astrhora-center .center-name{font-size:20px}.astrhora-center .center-hour{font-size:9px}}
@media(max-width:560px){.topbar{height:76px}.brand-logo{width:200px;height:67px}.astrhora-section{margin-left:-18px;margin-right:-18px;width:calc(100% + 36px)}.astrhora-assembly{min-width:950px}.astrhora-section .solar-strip{min-width:950px}.astrhora-dial-label{font-size:11px}.intro{min-height:86px}.under-clock{padding:14px 5px}.hour-dialog{max-width:calc(100vw - 20px)}}
@media(prefers-reduced-motion:reduce){.astrhora-assembly.is-switching .astrhora-watch,.astrhora-assembly.is-switching .astrhora-hour,.astrhora-assembly.hour-changed .astrhora-center .center-planet,.astrhora-assembly.hour-changed .astrhora-hour.live-hour{animation:none}}

/* Compact observatory header and bare celestial bodies over the supplied PNG watch. */
.app-shell::before{height:min(1050px,88vw);background:linear-gradient(180deg,#080b102b 0%,#080b1000 45%,#080b10 100%),url('art/astrhora-calm-horizon.png') center top/cover no-repeat}
.app-shell::after{height:min(1050px,88vw);background:linear-gradient(90deg,#05080a70 0%,transparent 17% 83%,#05080a70 100%)}
.topbar{height:auto;min-height:105px;display:grid;grid-template-columns:minmax(185px,250px) minmax(0,1fr) auto;align-items:center;gap:14px;padding-top:7px;padding-bottom:7px}
.brand-logo{width:250px;height:82px;max-width:100%}
.header-actions{gap:8px;white-space:nowrap}.header-actions .text-button{height:40px;font-size:12px;padding:0 12px}
.topbar .controls{display:grid;grid-template-columns:minmax(104px,1fr) minmax(170px,1.6fr) minmax(140px,1fr) auto auto;align-items:end;gap:8px;max-width:none;width:100%;margin:0;padding:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.topbar .controls label{min-width:0;gap:3px}.topbar .controls label span{color:#e4c894;font-size:10px;letter-spacing:.11em}
.topbar .controls input,.topbar .controls select,.topbar .controls .today-button{height:40px;font-size:12px}
.topbar .controls .today-button{padding:0 12px;white-space:nowrap}
.city-field{position:relative}.location-results{position:absolute;left:0;right:0;top:100%;max-height:245px;overflow:auto;background:#151518;border:1px solid #d3a76d;border-radius:3px;box-shadow:0 14px 35px #000e;z-index:50;color:#ead8bb;font-size:12px;padding:6px}
.location-results[hidden]{display:none}.location-option{display:block;width:100%;padding:9px 10px;color:#f7e5c2;background:transparent;border:0;text-align:left;border-radius:2px;font-size:12px}.location-option:hover,.location-option:focus-visible{background:#a2723f55;outline:1px solid #e2b57a}
.intro{min-height:63px;padding:4px 0 0;justify-content:space-between;text-align:left}.intro .overline{font-size:9px;letter-spacing:.15em}.intro h1{font-size:29px;line-height:1.05;margin:2px 0 0}.intro-date{position:static;font-size:12px;margin:0;padding:0}
.status{min-height:15px;margin:0;text-align:center;font-size:12px}.data-source{margin:0 auto;font-size:11px}
.astrhora-section .solar-strip{margin:4px auto -17px}
.astrhora-assembly{container-type:inline-size}
.astrhora-hour,.astrhora-hour.night-hour{width:5.4%;aspect-ratio:1/1.11;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}
.astrhora-hour .hour-planet{width:83%;height:75%;transform:translate(var(--art-offset-x,0),var(--art-offset-y,0));filter:drop-shadow(0 3px 5px #0009)}
.astrhora-hour .hour-symbol{width:19%;height:19%;left:6%;bottom:2%}
.astrhora-hour .hour-index{right:6%;bottom:1%;font-size:clamp(9px,.78cqw,13px);font-weight:700}
.astrhora-hour:hover,.astrhora-hour:focus-visible{box-shadow:none;outline:none;filter:brightness(1.3) drop-shadow(0 0 12px #ffdb95)}
.astrhora-hour:focus-visible .hour-planet{outline:2px solid #ffe3ae;outline-offset:2px;border-radius:50%}
.astrhora-hour.live-hour,.astrhora-hour.selected-hour:not(.live-hour){border:0;box-shadow:none;transform:translate(-50%,-50%)}
.astrhora-hour.live-hour .hour-planet{filter:drop-shadow(0 0 8px #fff4c9) drop-shadow(0 0 19px #ffc66f)}
.astrhora-hour.selected-hour:not(.live-hour) .hour-planet{filter:drop-shadow(0 0 11px #d7a665)}
.astrhora-dial-label{top:47%;bottom:auto;width:15%;font-size:clamp(12px,1.15cqw,20px);line-height:1.25;letter-spacing:.15em;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:5px;pointer-events:none}
.astrhora-dial-label strong{font-family:'Playfair Display',serif;font-size:clamp(18px,1.9cqw,32px);font-weight:500;letter-spacing:.08em}
.astrhora-center{width:20%;height:40%;padding:1.1% .8%}
.astrhora-center .center-kicker{font-size:clamp(10px,1cqw,17px);letter-spacing:.12em}
.astrhora-center .center-planet{width:57%;height:54%;margin:0 auto;filter:drop-shadow(0 0 13px #f4bf668c)}
.astrhora-center .center-name{font-size:clamp(23px,2.45cqw,42px);line-height:1.04}
.astrhora-center .center-hour{font-size:clamp(10px,1.04cqw,18px);letter-spacing:.08em;margin-top:2%}
.utility-dialog h2{font-family:'Playfair Display',serif;color:#ffe2ab;font-size:29px;font-weight:500;margin:5px 0 10px}.utility-dialog p{line-height:1.55;color:#ead9be}.utility-dialog form{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.utility-dialog form label{display:flex;flex-direction:column;gap:6px;color:#e6c28a;font-size:12px}.utility-dialog select{height:42px;background:#171410;border:1px solid #967148;border-radius:3px;color:#f8ead0;padding:0 9px}.utility-dialog form button{min-height:42px}.utility-dialog #alarm-status{font-size:12px;color:#eac88f;min-height:20px}.alarm-toast{position:fixed;z-index:100;right:22px;bottom:22px;max-width:340px;padding:16px 19px;background:#17120d;border:1px solid #e7bf80;box-shadow:0 8px 30px #000b;color:#ffe0a7}.alarm-toast[hidden]{display:none}
@media(max-width:1320px){.topbar{grid-template-columns:1fr auto}.topbar .controls{grid-column:1/-1;grid-row:2}.header-actions{grid-column:2;grid-row:1}.brand{grid-column:1;grid-row:1}}
@media(max-width:700px){.topbar{gap:4px;min-height:0;margin:0 -18px;padding:5px 18px 10px}.brand-logo{width:175px;height:63px}.header-actions .text-button{padding:0 8px;height:35px}.topbar .controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px}.topbar .controls .country-field,.topbar .controls .city-field{grid-column:auto}.topbar .controls .date-field{grid-column:1/-1}.topbar .controls .today-button{width:100%}.intro{min-height:55px}.intro h1{font-size:23px}.intro-date{font-size:10px;max-width:50%;text-align:right}.astrhora-section{margin-left:-18px;margin-right:-18px;width:calc(100% + 36px)}.astrhora-assembly{min-width:950px}.astrhora-dial-label{font-size:12px}.astrhora-dial-label strong{font-size:18px}.astrhora-center .center-kicker{font-size:10px}.astrhora-center .center-name{font-size:24px}.astrhora-center .center-hour{font-size:10px}.utility-dialog form{grid-template-columns:1fr}}

.topbar .controls{grid-template-columns:minmax(220px,2fr) minmax(140px,1fr) auto auto}
.location-picker{position:relative;min-width:0}
#location-open{height:62px;width:100%;padding:4px 13px;text-align:left;display:flex;flex-direction:column;justify-content:center;gap:3px;background:#171410;border:1px solid #7c6042;border-radius:3px;color:#f8e8cb}
#location-open>span{font-size:10px;font-weight:700;letter-spacing:.12em;color:#e4c894}
#location-open strong{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
#location-open[aria-expanded="true"]{border-color:#f0c788;box-shadow:0 0 0 2px #d39a4d48}
.location-panel{position:absolute;left:0;top:calc(100% + 6px);width:min(420px,calc(100vw - 36px));padding:15px;background:#161413;border:1px solid #c7975a;box-shadow:0 18px 42px #000e;z-index:60;display:grid;gap:13px}
.location-panel[hidden]{display:none}.location-panel label{display:flex;flex-direction:column;gap:5px}.location-panel p{font-size:11px;color:#bea887;line-height:1.4;margin:0}.location-panel select,.location-panel input{height:42px}
.location-panel .location-results{top:calc(100% + 2px)}
.location-actions{display:flex;flex-wrap:wrap;gap:8px}.location-actions button{background:#30271c;border:1px solid #967348;border-radius:4px;color:#f0d5a5;padding:8px 10px;cursor:pointer}.location-actions button:hover,.location-actions button:focus-visible{background:#4a3521}.location-actions button[hidden]{display:none}
.planetary-hour-link{display:inline-block;margin-left:12px;color:#efc77e;text-decoration:underline;text-underline-offset:3px;font-size:.9em}.planetary-hour-link:hover,.planetary-hour-link:focus-visible{color:#fff1cc}
.astrhora-slot-number{position:absolute;z-index:4;transform:translate(-50%,-50%);font-family:'Playfair Display',serif;font-size:clamp(13px,1.12cqw,19px);font-weight:600;color:#ffe0a4;line-height:1;letter-spacing:.04em;text-shadow:0 2px 4px #000,0 0 10px #000,0 0 15px #000;pointer-events:none}
.astrhora-slot-number.night-number{color:#daeaff}
.astrhora-center .center-start,.astrhora-center .center-end{position:absolute;top:51%;transform:translateY(-50%);font-family:'Playfair Display',serif;font-size:clamp(10px,.97cqw,17px);font-variant-numeric:tabular-nums;color:#ffe0a8;text-shadow:0 2px 5px #000,0 0 9px #000;white-space:nowrap}
.astrhora-center .center-start{left:1%}.astrhora-center .center-end{right:1%}
.astrhora-center .center-planet{width:54%}
@media(max-width:700px){.topbar .controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.topbar .controls .location-picker,.topbar .controls .date-field{grid-column:1/-1}#location-open{height:47px}.astrhora-center .center-start,.astrhora-center .center-end{font-size:10px}}
.astrhora-dial-label{font-size:clamp(10px,1cqw,17px);gap:7px;white-space:nowrap}
.astrhora-dial-label strong{font-size:clamp(24px,2cqw,34px);font-variant-numeric:tabular-nums}
footer{justify-content:center;width:100%}footer p{max-width:none;width:100%;text-align:center;line-height:1.65}

/* Keep every header control on the same visual baseline at every width. */
.topbar{grid-template-columns:minmax(170px,250px) minmax(0,1fr) auto;column-gap:16px;row-gap:8px}
.topbar .controls{grid-template-columns:minmax(190px,1.8fr) minmax(155px,1fr) minmax(100px,.75fr) minmax(115px,.85fr);align-items:stretch;gap:10px}
.topbar .controls>*{min-width:0;height:58px;margin:0}
.topbar .controls .date-field{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:5px 12px;background:#171410;border:1px solid #7c6042;border-radius:3px}
.topbar .controls .date-field input{height:31px;padding:0;border:0;background:transparent;color:#f8e8cb;font-size:13px}
.topbar .controls .date-field>label{font-size:10px;font-weight:700;letter-spacing:.12em;color:#e4c894}
.date-navigation{display:flex;align-items:center;gap:4px;min-width:0}
.topbar .controls .date-field .date-navigation input{flex:1;min-width:0;width:100%}
.date-navigation button{flex:0 0 25px;width:25px;height:29px;border:1px solid #8f704b;border-radius:3px;background:#2b2118;color:#ffe0a8;font-size:23px;line-height:1;display:grid;place-items:center;padding:0}
.date-navigation button:hover,.date-navigation button:focus-visible{background:#76502b;outline:2px solid #f3c77d;outline-offset:1px}
.topbar .controls .today-button,#location-open{height:58px;width:100%;margin:0}
.header-actions{display:flex;align-items:center;gap:8px}
.header-actions .text-button{height:58px;min-width:48px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:1320px){.topbar{grid-template-columns:minmax(0,1fr) auto}.topbar .controls{grid-column:1/-1;grid-row:2}.header-actions{grid-column:2;grid-row:1}.brand{grid-column:1;grid-row:1}}
@media(max-width:700px){.topbar{column-gap:5px;row-gap:4px}.topbar .controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.topbar .controls .location-picker,.topbar .controls .date-field{grid-column:1/-1}.topbar .controls .today-button{grid-column:auto}.topbar .controls>*,.topbar .controls .today-button,#location-open{height:48px}.header-actions{gap:5px}.header-actions .text-button{height:40px;padding:0 7px}.brand-logo{width:min(175px,100%)}}

/* Let the illustration show through at the top; fade only its lower edge. */
.app-shell::before{background:linear-gradient(180deg,transparent 0% 52%,#080b1000 65%,#080b10 100%),url('art/astrhora-calm-horizon.png') center top/cover no-repeat}
.app-shell::after{display:none}
.astrhora-dial-label strong{font-size:clamp(26px,2.55cqw,41px);line-height:1.1}
.astrhora-dial-label .dial-context{display:block;width:100%;font-size:clamp(10px,.82cqw,14px);font-weight:600;letter-spacing:.02em;line-height:1.25;text-align:center;white-space:normal;text-wrap:balance}

.dialog-extra{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0 0;padding:16px 0;border-top:1px solid #8c6a45;border-bottom:1px solid #8c6a45}
.dialog-extra[hidden],.dialog-translation[hidden],.dialog-advice[hidden]{display:none}
.dialog-extra h3{font-family:'Playfair Display',serif;color:#f2cb88;font-size:19px;font-weight:500;margin:0 0 9px}
.dialog-extra ul{margin:0;padding-left:19px;line-height:1.55;color:#f2e7d4;font-size:14px}
.dialog-extra li+li{margin-top:5px}
.dialog-advice{color:#f5d49c;font-size:15px;line-height:1.55;margin:17px 0}
.dialog-translation{color:#bdad95;font-size:12px;margin:9px 0}
.dialog-footer{display:flex;align-items:center;gap:12px;margin-top:19px;padding-top:12px;border-top:1px solid #8c6a45}
.dialog-footer img{width:105px;height:64px;object-fit:contain}
.dialog-footer p{color:#e9ce9f;font-size:12px;line-height:1.5;margin:0}
.dialog-share{display:block;width:100%;min-height:43px;margin-top:14px}
.share-status{min-height:18px;margin:8px 0 0;color:#e9ce9f;font-size:12px}
@media(max-width:520px){.dialog-extra{grid-template-columns:1fr;gap:12px}.dialog-footer{align-items:flex-start}}

.footer-links{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin:12px auto 0;font-size:12px}.footer-links a,.footer-links button{color:#f0d09a;text-decoration:underline;background:none;border:0;font:inherit;cursor:pointer}.footer-links a:hover,.footer-links button:hover{color:#fff0d0}
footer{display:flex;flex-direction:column;align-items:stretch;gap:14px}
footer .footer-links{width:100%;justify-content:center;gap:12px 24px;margin:0;font-size:14px;text-align:center}
footer p{width:100%;max-width:none;text-align:left;margin:0}
.astrhora-center .center-name{font-size:clamp(18px,1.72cqw,29px);line-height:1.08;max-width:100%;text-wrap:balance}
.dialog-heading h2{font-size:clamp(21px,2.4vw,30px);line-height:1.12}
.dialog-hour-navigation{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px;margin:14px 0 8px;direction:ltr}
.dialog-hour-navigation .overline{margin:0;text-align:center;font-size:clamp(15px,2vw,18px);line-height:1.3;letter-spacing:.045em;text-wrap:balance;color:#f7d497}
.dialog-hour-navigation .overline:dir(rtl){direction:rtl}
.dialog-step{width:44px;height:44px;border:1px solid #bd8c50;border-radius:50%;background:#261b15;color:#ffe0a8;font-size:34px;line-height:1;display:grid;place-items:center;padding:0}
.dialog-step:hover,.dialog-step:focus-visible{background:#634022;color:#fff5d4;outline:2px solid #f6d397;outline-offset:2px}
.dialog-top{display:grid;grid-template-columns:minmax(0,1fr) 35px;align-items:center;gap:14px;margin:0 0 12px}
.dialog-top .overline{margin:0;color:#f7d497;font-size:clamp(16px,2vw,20px);line-height:1.3;letter-spacing:.035em;text-wrap:balance}
#hour-dialog .dialog-close{position:static;justify-self:end}
.dialog-hour-navigation{grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 0}
.dialog-share{margin-top:8px}
.dialog-step{width:100%;height:42px;border-radius:4px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 10px;font-size:26px}
.dialog-step-label{font-family:inherit;font-size:13px;line-height:1.2;font-weight:600}
.dialog-boundary{margin:0 0 8px;color:#f6d49a;text-align:center;font-size:14px;line-height:1.4}
.dialog-boundary:empty{display:none}
.consent-banner{position:fixed;z-index:150;left:50%;bottom:16px;transform:translateX(-50%);width:min(650px,calc(100vw - 24px));display:flex;align-items:center;gap:18px;padding:16px 20px;background:#18120d;border:1px solid #d6ab70;box-shadow:0 12px 40px #000d;color:#f8e5c6}.consent-banner[hidden],#search-consent-panel[hidden],#google-login[hidden],#logout[hidden]{display:none}.consent-banner p{font-size:13px;line-height:1.5;margin:0}.consent-banner a,#search-consent-panel a{color:#ffe0a7}.consent-banner>div{display:flex;gap:8px}.consent-banner button{height:38px;padding:0 12px;background:#2a2118;border:1px solid #b48a55;color:#ffe3b1;cursor:pointer}.consent-banner button:last-child{background:#8f602e}.search-consent{display:flex;align-items:flex-start;gap:9px;margin:17px 0 8px;font-size:13px;line-height:1.5;color:#eed7b0}.search-consent input{flex:none;margin-top:4px}.utility-dialog #login-status{min-height:19px;color:#f0cb8c;font-size:12px}
.privacy-page{background:#090c11;color:#f1e4cd}.privacy-content{width:min(780px,calc(100% - 32px));margin:40px auto 70px;padding:30px;background:#18130ff2;border:1px solid #947347;box-shadow:0 15px 50px #0009}.privacy-content h1,.privacy-content h2{font-family:'Playfair Display',serif;color:#f6d9a6;font-weight:500}.privacy-content h1{font-size:36px;margin:12px 0}.privacy-content h2{font-size:23px;margin:28px 0 8px}.privacy-content p,.privacy-content li{line-height:1.65;font-size:15px}.privacy-content a{color:#f3c77f}.privacy-back{font-size:13px}
@media(max-width:600px){.consent-banner{display:block}.consent-banner>div{margin-top:12px;justify-content:flex-end}.privacy-content{margin:12px auto;padding:20px}}

/* Long-form information pages: readable text and visible language navigation. */
.about-content{width:min(920px,calc(100% - 32px));padding:34px 42px 50px}
.about-top{display:flex;align-items:flex-start;justify-content:space-between;gap:22px;flex-wrap:wrap}
.about-languages{display:flex;flex-wrap:wrap;gap:7px 13px;max-width:650px}
.about-languages a{font-size:12px;color:#e7c893;text-decoration:none;border-bottom:1px solid transparent;white-space:nowrap}
.about-languages a:hover,.about-languages a[aria-current="page"]{border-color:#e7c893;color:#fff0cf}
.about-logo{display:block;width:min(300px,70%);height:auto;margin:30px 0 10px}
.about-content h1{font-size:clamp(29px,4vw,44px);line-height:1.16;margin:13px 0 25px}
.about-content section{padding-top:5px;border-top:1px solid #7b5c393b;margin-top:26px}
.about-content section h2{margin:21px 0 9px;font-size:clamp(21px,2.5vw,27px)}
.about-content section h3{font-family:'Playfair Display',serif;color:#f0c98f;font-size:clamp(18px,2.1vw,22px);font-weight:500;margin:22px 0 7px}
.about-content section p{margin:0 0 15px;line-height:1.78}
.about-page[dir="rtl"] .about-content{text-align:right}
.about-page[dir="rtl"] .about-top{flex-direction:row-reverse}
.header-actions>a.text-button{text-decoration:none}
.header-actions #lang{min-width:66px;max-width:95px;padding:0 8px;background:#171410;border-color:#7c6042;color:#f8e8cb;cursor:pointer}
@media(max-width:700px){.brand-logo{width:min(125px,100%);height:48px}.header-actions #lang{min-width:58px;width:58px;padding:0 3px;font-size:12px}.header-actions #info-open,.header-actions #login{min-width:0;padding:0 5px;font-size:12px}}
@media(max-width:600px){.about-content{padding:22px}.about-logo{margin-top:22px}.about-languages{gap:8px 11px}}

#delete-account-link{display:block;margin-top:12px;color:#ffe0a7;font-size:13px;text-decoration:underline}

.explore-pages,.app-downloads{margin:30px auto;padding:22px 25px;background:#15130fdd;border:1px solid #876640;border-radius:8px;color:#efdfc3}.explore-pages h2,.app-downloads h2{font-family:'Playfair Display',serif;font-weight:500;color:#f3d49b;margin:0 0 7px;font-size:26px}.explore-pages p,.app-downloads p{margin:0;color:#cbb99a;font-size:14px;line-height:1.5}.explore-pages nav{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.explore-pages a{display:inline-flex;padding:9px 12px;color:#f5d398;text-decoration:none;border:1px solid #80603a;background:#271d14;border-radius:4px}.explore-pages a:hover,.explore-pages a:focus-visible{border-color:#e6bf7e;background:#3b2a19}.app-downloads{display:flex;align-items:center;justify-content:space-between;gap:18px}.store-actions{display:flex;flex-wrap:wrap;gap:10px}.store-badge{display:flex;align-items:center;gap:12px;min-width:155px;padding:9px 13px;border:1px solid #765a3b;border-radius:8px;background:#211a14;color:#eddbbb;font-size:16px;font-weight:700;cursor:default}.store-badge>span:first-child{font-size:24px;color:#d9ae72}.store-badge small{display:block;color:#c99f67;font-size:10px;letter-spacing:.12em;font-weight:700}.planetary-page .planetary-controls{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin:22px 0}.planetary-page .planetary-controls label{display:grid;gap:7px;color:#e5c894}.planetary-page input[type=date]{padding:10px;background:#161310;color:#f7e2ba;border:1px solid #8d6a42;border-radius:4px}.planetary-page .planetary-status{color:#d7bb8d}.planetary-table-wrap{overflow-x:auto}.planetary-table{width:100%;border-collapse:collapse;min-width:390px}.planetary-table th,.planetary-table td{padding:10px 12px;border-bottom:1px solid #705638;text-align:left}.planetary-table th{color:#f0cd90}.planetary-table td{color:#eadcc6}.planetary-table .night-row{background:#211b24}.planetary-page[dir=rtl] .planetary-table th,.planetary-page[dir=rtl] .planetary-table td{text-align:right}
@media(max-width:720px){.app-downloads{display:block}.store-actions{margin-top:17px}.store-badge{flex:1}.explore-pages,.app-downloads{padding:18px}}
.guide-link-bottom{align-self:center;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border:1px solid #a87d4c;border-radius:6px;background:#291e15;color:#f2ce91;text-decoration:none;font-size:14px;font-weight:600}.guide-link-bottom:hover,.guide-link-bottom:focus-visible{background:#3c2b1b;border-color:#e6bf7e;color:#fff0d0}.guide-directory nav{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.guide-directory nav a{display:inline-flex;padding:9px 12px;color:#f5d398;text-decoration:none;border:1px solid #80603a;background:#271d14;border-radius:4px}.guide-directory nav a:hover,.guide-directory nav a:focus-visible{border-color:#e6bf7e;background:#3b2a19}
.store-badge-link{cursor:pointer;text-decoration:none}.store-badge-link:hover,.store-badge-link:focus-visible{border-color:#e6bf7e;background:#3b2a19;color:#fff0d0}
