body.calendar-page{min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at 88% 10%,rgba(51,128,177,.26),transparent 29rem),var(--night)}
.calendar-page .site-header{position:relative;background:rgba(7,17,31,.9)}
.calendar-shell{max-width:1500px;margin:0 auto;padding:clamp(2rem,5vw,5rem)}
.calendar-intro{max-width:780px}
.breadcrumb{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 2rem;color:var(--muted);font-size:.72rem;letter-spacing:.06em}
.breadcrumb a:hover{color:var(--cyan)}
.eyebrow{margin:0 0 .75rem;color:var(--cyan);font-size:.68rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase}
.calendar-intro h1,.calendar-heading h2{margin:0;font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.045em;line-height:1}
.calendar-intro h1{font-size:clamp(2.5rem,6vw,5.7rem)}
.calendar-intro h1 span,.calendar-heading h2 span{color:var(--cyan)}
.calendar-intro>p:last-child{max-width:640px;color:var(--muted);line-height:1.65}
.settings{display:flex;align-items:end;flex-wrap:wrap;gap:1rem 1.25rem;margin:2.5rem 0 1.4rem;padding:1.1rem 1.3rem;border:1px solid var(--line);background:rgba(11,28,45,.74)}
.settings form{display:flex;flex-wrap:wrap;align-items:end;gap:.7rem}
.settings label{display:grid;gap:.35rem;color:var(--muted);font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.settings input{width:130px;padding:.6rem;color:var(--text);border:1px solid var(--line);background:#07111f;font:inherit}
.settings button,.copy-calendar{padding:.7rem 1rem;color:var(--night);border:1px solid var(--cyan);background:var(--cyan);font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.settings button:hover,.copy-calendar:hover{color:var(--text);background:transparent}
.settings input:focus-visible,.settings button:focus-visible,.copy-calendar:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.settings-note{margin:0 0 .15rem;color:var(--muted);font-size:.72rem}
.lunar-calendar{padding:clamp(1rem,2.5vw,1.8rem);border:1px solid var(--line);background:rgba(11,28,45,.72);box-shadow:10px 12px 0 rgba(0,0,0,.18)}
.calendar-heading{display:flex;justify-content:space-between;gap:1rem;align-items:end}
.calendar-heading h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.calendar-actions{display:grid;justify-items:end;gap:.6rem}
.calendar-heading #period-label{max-width:270px;margin:0;color:var(--muted);font-size:.75rem;line-height:1.5;text-align:right}
.copy-calendar:disabled{cursor:wait;opacity:.7}
.legend{display:flex;align-items:center;gap:.45rem;margin:1.2rem 0;color:var(--muted);font-size:.72rem}
.legend i{width:.7rem;height:.7rem;border-radius:50%;background:linear-gradient(90deg,#21374e 45%,#e8f2ff 46%);box-shadow:0 0 8px #d8ecff}
.calendar-scroll{overflow-x:auto;padding-bottom:.75rem}
#lunar-table{width:max-content;min-width:100%;border-collapse:collapse;font-size:.72rem}
#lunar-table th,#lunar-table td{width:42px;min-width:42px;height:52px;padding:0;border:1px solid rgba(132,184,213,.2);text-align:center}
#lunar-table thead th{height:28px;color:var(--muted);background:rgba(5,13,23,.82);font-size:.64rem}
#lunar-table th:first-child,#lunar-table td:first-child{position:sticky;left:0;z-index:1;width:118px;min-width:118px;padding:0 .75rem;color:var(--cyan);background:#0b1c2d;text-align:left;font-weight:700}
#lunar-table td.empty{background:rgba(5,13,23,.28)}
.moon-icon{width:32px;height:32px;vertical-align:middle}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.calendar-shell{padding:2rem 1rem}.calendar-heading{display:block}.calendar-actions{justify-items:start;margin-top:.65rem}.calendar-heading #period-label{max-width:none;text-align:left}.settings input{width:100%}.settings label{flex:1 1 120px}}