@font-face{font-family:NotoSans;src:url('../fonts/NotoSansSC-web.woff2');font-weight:100 900;font-display:swap}@font-face{font-family:NotoSerif;src:url('../fonts/NotoSerifSC-web.woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;--bg:#080c0c;--surface:#0d1312;--gold:#caa96c;--pale:#ead8b2;--text:#ede7db;--muted:#92988e;--cyan:#78cfca;--line:rgba(196,171,114,.18);font-family:NotoSans,sans-serif;font-size:13px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}button{border:0;background:none}button:hover{color:var(--pale)}button:disabled{opacity:.3;cursor:default}input{color:var(--text)}h1,h2,p{margin:0}button,dialog{ -webkit-tap-highlight-color:transparent}.app-shell{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 51% 42%,rgba(31,55,45,.2),transparent 55%)}.topbar{height:92px;padding:0 34px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);flex-shrink:0}.brand{display:flex;align-items:center;gap:16px}.seal{border:1px solid var(--gold);height:43px;width:43px;display:grid;place-items:center;border-radius:50%;font-family:NotoSerif;font-size:28px;color:var(--pale);outline:1px solid rgba(202,169,108,.2);outline-offset:4px}.brand h1{font-family:NotoSerif;font-size:28px;letter-spacing:4px;font-weight:500}.brand h1 span{font-family:NotoSans;font-size:14px;letter-spacing:3px;margin-left:14px;color:var(--muted);font-weight:400}.brand p{font-size:8px;letter-spacing:3px;color:var(--gold);margin-top:5px}.edition{color:var(--pale);letter-spacing:3px;font-size:13px}.edition span{color:var(--muted);font-size:9px;letter-spacing:2px;margin-left:14px}.edition i{display:inline-block;width:5px;height:5px;background:var(--gold);transform:rotate(45deg);margin-right:16px}.top-actions{display:flex;align-items:center;gap:25px}.status{font-size:11px;color:var(--muted);white-space:nowrap}.status i,.bottom-bar i{display:inline-block;width:5px;height:5px;background:var(--cyan);border-radius:50%;margin-right:9px;box-shadow:0 0 10px #78cfca55}.top-actions button{font-size:21px;color:var(--muted);display:flex;align-items:center;gap:7px}.top-actions button span{font-size:11px}
.workspace{display:grid;grid-template-columns:262px minmax(480px,1fr) 236px;gap:26px;padding:29px 34px 20px;max-width:1920px;width:100%;margin:0 auto;flex:1}.left-panel,.right-panel{min-width:0;display:flex;flex-direction:column}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted);font-weight:400}.eyebrow span{float:right;letter-spacing:1px;color:var(--gold)}.clock-section{padding:8px 0 24px;border-bottom:1px solid var(--line)}.digital-clock{display:flex;align-items:baseline;gap:10px;margin-top:16px;white-space:nowrap}.digital-clock>span{font-size:44px;font-weight:250;letter-spacing:-1px;line-height:1.2;font-variant-numeric:tabular-nums}.digital-clock small{color:var(--cyan);font-size:10px;font-variant-numeric:tabular-nums}.clock-meta{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:17px}.time-track{height:2px;background:rgba(120,207,202,.12);margin-top:17px;position:relative}.time-track i{height:2px;background:var(--cyan);display:block;position:relative}.time-track i:after{content:'';position:absolute;width:4px;height:4px;background:var(--text);border-radius:50%;right:0;top:-1px}.lunar-section{padding:24px 0;border-bottom:1px solid var(--line)}.lunar-section h2{font-family:NotoSerif;color:var(--pale);font-size:26px;font-weight:500;letter-spacing:2px;margin:12px 0 19px}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.pillar{border-left:1px solid var(--line);padding:0 0 0 12px}.pillar:first-child{border-left:0;padding-left:0}.pillar span{font-size:9px;color:var(--muted);letter-spacing:2px;display:block}.pillar b{font-family:NotoSerif;font-weight:400;font-size:21px;display:block;margin-top:8px;color:var(--pale)}.calendar-section{padding-top:23px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.section-heading h2{font-size:12px;font-weight:400;letter-spacing:2px;color:var(--pale)}#monthLabel{font-size:17px;letter-spacing:2px}.month-actions{display:flex;gap:10px}.month-actions button{font-size:24px;color:var(--gold);width:23px;height:25px;line-height:18px}.calendar-week,.month-grid{display:grid;grid-template-columns:repeat(7,1fr)}.calendar-week{font-size:10px;color:var(--muted);text-align:center;margin-bottom:8px}.calendar-week span:nth-last-child(-n+2){color:var(--gold)}.month-grid{gap:3px 0;min-height:198px;align-content:start}.day-cell{height:30px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;color:var(--text);border-radius:50%;width:30px;justify-self:center;font-variant-numeric:tabular-nums;position:relative;border:1px solid transparent}.day-cell:hover{background:rgba(202,169,108,.1);border-color:var(--line)}.day-cell.weekend{color:var(--gold)}.day-cell.selected{border-color:#78cfca88;background:#78cfca16;color:#ddfffa}.day-cell.today:after{content:'';position:absolute;width:3px;height:3px;border-radius:50%;background:var(--gold);bottom:2px}.date-tools{display:flex;gap:8px;margin:8px 0 11px}.date-tools input{width:0;flex:1;border:1px solid var(--line);background:rgba(255,255,255,.02);padding:6px 8px;font-size:11px;border-radius:2px}.date-tools button{border:1px solid var(--line);color:var(--pale);padding:5px 10px;border-radius:2px;font-size:11px}.today-button{width:100%;padding:9px;color:var(--gold);font-size:11px;border:1px solid var(--line);border-radius:2px}.today-button:hover{background:rgba(202,169,108,.07)}.sidebar-foot{margin-top:auto;padding-top:25px;display:flex;justify-content:space-between;color:#5c685f;font-size:9px;letter-spacing:2px}
.instrument-section{display:flex;flex-direction:column;min-width:0}.instrument-heading{height:58px;display:flex;justify-content:space-between;align-items:flex-start;padding:5px 8px 0;flex-shrink:0}.instrument-heading h2{font-family:NotoSerif;font-size:22px;font-weight:400;letter-spacing:4px;color:var(--pale);margin-top:5px}.instrument-heading h2 span{color:#5a594a}.mode-button{font-size:10px;letter-spacing:1px;border:1px solid var(--line);padding:8px 12px;border-radius:20px;margin-top:8px;color:var(--muted)}.mode-button.active{color:var(--cyan);border-color:#78cfca38;background:#78cfca07}.instrument-view{aspect-ratio:1;position:relative;width:100%;max-height:calc(100vh - 265px);min-height:440px;overflow:hidden;flex:1;cursor:grab;touch-action:none;isolation:isolate}.instrument-view:active{cursor:grabbing}#compass{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1}.axis{position:absolute;z-index:2;font-family:NotoSerif;font-size:14px;color:var(--pale);pointer-events:none;text-shadow:0 0 6px var(--bg);display:flex;gap:5px;align-items:center}.axis small{font-family:NotoSans;font-size:8px;color:var(--muted)}.axis.n{top:4px;left:50%;transform:translateX(-50%)}.axis.s{bottom:12px;left:50%;transform:translateX(-50%)}.axis.e{right:6px;top:50%;transform:translateY(-50%)}.axis.w{left:6px;top:50%;transform:translateY(-50%)}.reticle{position:absolute;width:12px;height:12px;border-color:rgba(202,169,108,.28);border-style:solid;z-index:2;pointer-events:none}.tl{top:23px;left:0;border-width:1px 0 0 1px}.tr{top:23px;right:0;border-width:1px 1px 0 0}.bl{bottom:26px;left:0;border-width:0 0 1px 1px}.br{bottom:26px;right:0;border-width:0 1px 1px 0}.loading{position:absolute;inset:0;display:grid;place-items:center;z-index:3;color:var(--gold);background:var(--bg)}.zoom-hint{position:absolute;bottom:1px;right:10px;z-index:2;font-size:9px;letter-spacing:1px;color:#68796b;pointer-events:none}.instrument-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 4px;flex-shrink:0}.instrument-toolbar button{font-size:10px;color:var(--muted);white-space:nowrap}.instrument-toolbar button[aria-pressed=true]{color:var(--gold)}.instrument-toolbar #detailsBtn{color:var(--pale)}.instrument-toolbar #detailsBtn span{color:var(--gold);margin-left:8px}.zoom-control{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:9px}.zoom-control input{width:95px;height:2px;accent-color:var(--gold);cursor:pointer}.zoom-control output{width:34px;font-variant-numeric:tabular-nums}.zoom-control button{font-size:16px}.selected-ring{padding:18px 5px 0;display:flex;align-items:center;gap:13px;min-height:72px}.ring-index{font-family:NotoSerif;font-size:26px;font-weight:300;color:var(--gold);border-right:1px solid var(--line);padding-right:14px;line-height:36px}.selected-ring strong{font-size:11px;font-weight:400;letter-spacing:2px;color:var(--pale)}.selected-ring p{font-size:10px;color:var(--muted);line-height:1.7;margin-top:5px}.selected-tag{margin-left:auto;white-space:nowrap;font-size:9px;color:var(--muted);border:1px solid var(--line);padding:4px 8px;border-radius:12px}
.solar-section{padding:8px 0 25px;border-bottom:1px solid var(--line)}.solar-title{display:flex;align-items:baseline;gap:15px;margin-top:19px}.solar-title h2{font-family:NotoSerif;font-size:45px;font-weight:400;letter-spacing:6px;color:var(--pale)}.solar-title>span{font-size:10px;color:var(--muted);border-left:1px solid var(--line);padding-left:12px}.term-path{display:flex;align-items:center;margin:19px 0 16px}.term-path i{width:5px;height:5px;border-radius:50%;border:1px solid var(--gold)}.term-path i:first-child{background:var(--gold)}.term-path div{height:1px;background:var(--line);flex:1}.term-next{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);align-items:center}.term-next strong{font-weight:400;color:var(--pale);margin-left:5px}.term-countdown{display:flex;align-items:baseline;gap:8px;margin-top:10px;font-variant-numeric:tabular-nums}.term-countdown strong{font-size:37px;font-weight:250;color:var(--text)}.term-countdown>span{font-size:10px;color:var(--muted)}.term-countdown em{font-size:19px;font-weight:300;font-style:normal;color:var(--cyan);margin-left:auto}.elements-section{padding:23px 0 22px;border-bottom:1px solid var(--line)}.mini-label{font-size:9px;color:var(--muted);letter-spacing:1px}.element-row{display:flex;align-items:center;margin-top:13px;gap:10px}.element-dot{width:24px;height:24px;border:1px solid color-mix(in srgb,var(--element) 45%,transparent);border-radius:50%;display:grid;place-items:center;font-family:NotoSerif;font-size:15px;color:var(--element)}.element-en{font-size:8px;letter-spacing:2px;color:var(--element);opacity:.7}.element-relation{margin-left:auto;font-family:NotoSerif;color:var(--muted);font-size:12px;letter-spacing:2px}.progress-section{padding:22px 0;border-bottom:1px solid var(--line)}.progress-caption{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.progress-caption strong{font-weight:400;color:var(--cyan);font-variant-numeric:tabular-nums}.progress-caption:nth-of-type(3) strong{color:var(--gold)}.progress-track{height:2px;background:#78cfca17;margin:10px 0 23px}.progress-track i{height:2px;background:var(--cyan);display:block}.progress-track.gold{background:#caa96c17;margin-bottom:0}.progress-track.gold i{background:var(--gold)}.layer-preview{padding-top:22px}.layer-category{display:flex;justify-content:space-between;align-items:center;width:100%;padding:10px 0;font-size:11px;color:var(--muted);border-bottom:1px solid #caa96c0d}.layer-category b{font-weight:400;color:var(--gold)}.app-note{font-size:9px;color:#667368;line-height:1.9;margin-top:auto;padding-top:20px}.bottom-bar{height:42px;border-top:1px solid var(--line);padding:0 34px;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1px;color:#7a8479;flex-shrink:0}.bottom-bar b{margin:0 10px;font-weight:400}.bottom-bar button{font-size:10px;color:var(--muted)}
dialog{color:var(--text);background:#0e1513;border:1px solid #8a744744;border-radius:7px;padding:25px;box-shadow:0 25px 100px #000b}dialog::backdrop{background:#030908bb;backdrop-filter:blur(6px)}.layers-dialog{width:670px;max-width:calc(100vw - 30px);max-height:85vh}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.dialog-heading h2{font-family:NotoSerif;font-size:28px;font-weight:400;color:var(--pale);margin-top:5px;letter-spacing:3px}.dialog-heading button{font-size:27px;color:var(--muted);padding:4px 12px}.layer-filters{display:flex;gap:9px;margin-bottom:15px}.layer-filters button{border:1px solid var(--line);padding:7px 13px;border-radius:20px;font-size:11px;color:var(--muted)}.layer-filters button.active{background:#caa96c1c;border-color:#caa96c88;color:var(--pale)}.ring-list{max-height:52vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#504936 transparent}.ring-item{width:100%;display:grid;grid-template-columns:38px 1fr auto;gap:14px;padding:13px 8px;text-align:left;border-bottom:1px solid var(--line);align-items:center}.ring-item:hover,.ring-item.active{background:#caa96c0c}.ring-item .number{font-family:NotoSerif;font-size:23px;color:var(--gold)}.ring-item strong{font-size:13px;font-weight:400;color:var(--pale)}.ring-item p{font-size:10px;line-height:1.7;color:var(--muted);margin-top:4px}.ring-item .tag{font-size:9px;color:var(--muted)}.dialog-note{font-size:10px;line-height:1.8;color:var(--muted);margin-top:18px}.about-dialog{width:580px;max-width:calc(100vw - 30px)}.about-dialog>p{font-size:12px;line-height:2;color:#a1ac9f;margin-bottom:15px}.about-dialog .credits{border-top:1px solid var(--line);padding-top:16px;font-size:10px}.error-panel{position:fixed;inset:20%;background:#151d18;padding:30px;border:1px solid #caa96c;color:var(--pale);white-space:pre-wrap;z-index:99}
@media(min-width:1700px){.workspace{grid-template-columns:300px minmax(600px,1fr) 280px;gap:38px;padding-top:35px}.digital-clock>span{font-size:50px}.instrument-view{max-height:calc(100vh - 290px)}.element-row{margin-top:17px}.month-grid{min-height:216px}.day-cell{height:33px;width:33px}.solar-section{padding-bottom:32px}}
@media(max-width:1240px){.workspace{grid-template-columns:222px minmax(380px,1fr) 200px;gap:20px;padding:22px 22px 16px}.topbar{padding:0 22px;height:80px}.edition{display:none}.digital-clock>span{font-size:37px}.digital-clock{gap:6px}.pillars{gap:3px}.pillar{padding-left:8px}.pillar b{font-size:20px}.lunar-section h2{font-size:23px}.term-countdown em{font-size:16px}.instrument-heading h2{font-size:19px}.instrument-view{min-height:380px;max-height:calc(100vh - 250px)}.zoom-control{gap:5px}.zoom-control input{width:65px}.selected-tag{display:none}.instrument-toolbar button{font-size:9px}.bottom-bar{padding:0 22px}.solar-title h2{font-size:39px}.date-tools{gap:4px}.date-tools button{padding:5px 8px}}
@media(max-width:980px){.workspace{grid-template-columns:210px minmax(360px,1fr)}.right-panel{display:none}.top-actions{gap:15px}.selected-ring{padding-bottom:6px}.instrument-view{max-height:none;min-height:390px}.bottom-bar>span:nth-child(2){display:none}.workspace{max-width:1000px}.app-shell{min-height:100vh}}
@media(max-width:650px){.topbar{height:74px;padding:0 18px}.brand h1{font-size:23px}.brand h1 span{font-size:12px;margin-left:7px}.brand p{font-size:7px;letter-spacing:1.7px}.seal{width:34px;height:34px;font-size:23px}.top-actions .status{display:none}.top-actions button span{display:none}.workspace{display:flex;flex-direction:column;padding:18px;gap:25px}.instrument-section{order:-1}.instrument-view{min-height:340px;aspect-ratio:1;flex:auto}.instrument-heading{padding-top:0;height:60px}.instrument-heading h2{font-size:21px}.instrument-toolbar{padding:13px 0}.zoom-control input{width:75px}.left-panel{display:grid;grid-template-columns:1fr 1fr;gap:18px}.clock-section{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:0 0 18px}.clock-section .eyebrow{width:100%}.digital-clock{margin:12px 0 0}.digital-clock>span{font-size:42px}.clock-meta{flex-direction:column;gap:5px}.time-track{width:100%}.lunar-section{grid-column:1/-1;padding:0 0 18px}.lunar-section h2{font-size:25px}.calendar-section{grid-column:1/-1;padding-top:0}.month-grid{min-height:240px}.day-cell{height:37px;width:37px}.sidebar-foot{grid-column:1/-1;padding-top:0}.right-panel{display:block}.solar-section,.elements-section,.progress-section,.layer-preview{padding-top:20px}.right-panel .app-note{display:none}.element-row{margin-top:14px}.term-countdown em{font-size:24px}.bottom-bar{padding:0 18px}.about-dialog{padding:20px}.ring-item{grid-template-columns:26px 1fr;gap:10px}.ring-item .tag{display:none}.layers-dialog{padding:20px}.layer-filters{gap:5px}.layer-filters button{padding:6px 9px;font-size:10px}.selected-ring p{font-size:10px}}
@media(min-width:981px){.app-shell{height:100vh;min-height:700px}.workspace{min-height:0;grid-template-rows:minmax(0,1fr);overflow:hidden}.instrument-section{min-height:0}.instrument-view{aspect-ratio:auto;min-height:0;max-height:none;height:0;flex:1}.left-panel,.right-panel{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#383a2b transparent}.selected-ring{min-height:68px;padding-top:13px;padding-bottom:5px;flex-shrink:0}.instrument-toolbar{padding:12px 4px}.sidebar-foot{padding-top:20px}}
@media(min-width:651px) and (max-width:980px){.right-panel{display:grid;grid-column:1/-1;grid-template-columns:1fr 1fr;gap:0 28px}.solar-section,.elements-section{padding-top:16px}.progress-section,.layer-preview{padding-top:20px}.right-panel .app-note{grid-column:1/-1;padding-top:14px}}
.almanac-section{padding:8px 0 20px;border-bottom:1px solid var(--line)}.almanac-section .section-heading{margin-bottom:15px}.almanac-section .mini-label{font-size:9px;letter-spacing:.3px}.almanac-row{display:flex;gap:11px;margin-top:13px;align-items:flex-start}.almanac-mark{font-family:NotoSerif;font-size:17px;line-height:25px;min-width:25px;height:25px;text-align:center;border:1px solid;border-radius:50%}.yi .almanac-mark{color:#8acda8;border-color:#8acda844;background:#8acda808}.ji .almanac-mark{color:#d9937b;border-color:#d9937b44;background:#d9937b08}.almanac-items{display:flex;flex-wrap:wrap;gap:5px 10px;align-items:center;line-height:1.8;min-height:25px}.almanac-item{font-size:11px;color:#c6cec0;white-space:nowrap}.ji .almanac-item{color:#cbb4a6}.almanac-overflow{color:var(--gold);font-size:9px;border:1px solid var(--line);line-height:16px;padding:0 5px;border-radius:9px}.almanac-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.almanac-foot>span{font-size:9px;color:#758372}.almanac-foot button{font-size:10px;color:var(--gold);padding:0}.almanac-dialog{width:580px;max-width:calc(100vw - 30px)}.almanac-full-date{font-size:12px;line-height:1.7;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:20px}.almanac-full-row{display:flex;gap:17px;margin-bottom:24px;align-items:flex-start}.almanac-full-row .almanac-mark{width:32px;min-width:32px;height:32px;line-height:30px;font-size:21px}.almanac-full-row .almanac-items{gap:10px 12px}.almanac-full-row .almanac-item{font-size:13px;padding:4px 10px;border:1px solid var(--line);border-radius:3px}.right-panel .solar-section{padding-top:22px}.right-panel .elements-section{padding-top:19px}.right-panel .element-row{margin-top:10px}.right-panel .progress-section{padding-top:20px;padding-bottom:20px}.right-panel .layer-preview{padding-top:18px}
@media(min-width:651px) and (max-width:980px){.almanac-section{grid-column:1/-1;padding-top:18px}.almanac-row .almanac-items{gap:6px 15px}.right-panel .solar-section,.right-panel .elements-section{padding-top:20px}}
@media(max-width:650px){.almanac-section{padding-top:10px}.almanac-row .almanac-items{gap:7px 13px}.almanac-item{font-size:12px}.almanac-dialog{padding:20px}.almanac-full-row{gap:12px}.almanac-full-row .almanac-items{gap:8px}.almanac-full-row .almanac-item{font-size:12px;padding:3px 8px}}
