/* An Vận · a paper atlas, with readable explanations below the diagram. */
.fortune-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#fortune-tab-natal{grid-column:auto}
.natal-section{max-width:1040px;margin:20px auto 30px;color:var(--ink)}
.natal-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px 30px;border:1px solid #ad946862;border-radius:20px;background:radial-gradient(ellipse at 90% 30%,#a48e5f45,transparent 60%),linear-gradient(115deg,#244b3e,#4b6650);color:#fff6e4;overflow:hidden;margin-bottom:20px}
.natal-heading .eyebrow{color:#e0c78f;font-size:10px;letter-spacing:2px}.natal-heading h2{color:inherit;font:500 42px/1.15 AnVanSerif,serif;margin:12px 0}.natal-heading p{color:#ece2ca;margin:0;font-size:14px}.natal-heading>svg{width:120px;height:120px;stroke:#dbc38b;stroke-width:.7;opacity:.65;flex-shrink:0}
.natal-form,.natal-palace-reading{border:1px solid #c7b997;border-radius:18px;padding:24px;background:#fffcf4;box-shadow:0 6px 22px #56442c08}
.natal-form-top,.natal-result-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}.natal-form h3{margin:0;font-size:20px}.natal-form .textbtn{font-size:12px}.natal-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.natal-fields label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600;min-width:0}.natal-fields input,.natal-fields select,.natal-select-row select{width:100%;min-width:0;box-sizing:border-box;font:inherit;font-weight:400;padding:12px;border:1px solid #d0c7b2;border-radius:10px;background:#fffdf7;color:#3f493c;min-height:46px}.natal-fields input:focus,.natal-fields select:focus,.natal-select-row select:focus{outline:2px solid #9e7858;outline-offset:2px}.natal-lunar-row{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:8px}.natal-fields .natal-leap{flex-direction:row;align-items:center;font-size:12px;margin-top:8px}.natal-leap input{width:17px;min-height:17px}.natal-input-hint{font-size:11px;font-weight:400;color:#817b69}.natal-submit-row{display:flex;align-items:center;gap:18px;margin-top:20px}.natal-submit-row .primary{padding:13px 24px;border-radius:12px;font-size:15px}#natal-status{margin:12px 0 0;color:#99503d;font-size:13px;line-height:1.6}#natal-status:empty{display:none}
#natal-result{margin-top:25px}.natal-result-heading h3{font:500 28px/1.3 AnVanSerif,serif;margin:5px 0;color:#355344}.natal-result-heading p{font-size:12px;margin:5px 0;color:#7a7566}.natal-result-heading .eyebrow{font-size:9px;color:#91784e}.natal-chart-actions{display:flex;gap:9px;justify-content:flex-end;margin-bottom:12px}.natal-chart-actions button,.natal-viewer button{border:1px solid #c2af87;background:#fffaf0;color:#6c5436;border-radius:10px;padding:10px 14px;font:inherit;font-size:13px;min-height:42px}.natal-chart-actions button span{font-size:20px;vertical-align:middle;margin-right:4px}.natal-diagram{border-radius:15px;overflow:hidden;border:1px solid #bda677;background:#fbf7ed}.natal-svg{width:100%;height:auto;display:block}.natal-svg [data-palace]{cursor:pointer}.natal-svg [data-palace]:focus{outline:none}.natal-svg [data-palace]:focus rect{stroke:#a34d39;stroke-width:4}.natal-select-row{display:flex;align-items:center;gap:15px;justify-content:space-between;margin:18px 0 12px}.natal-select-row label{font-weight:700;font-size:15px}.natal-select-row select{max-width:240px;width:60%;font-size:14px}.natal-palace-reading{scroll-margin-top:22px}.natal-palace-reading:focus{outline:none}.natal-palace-reading h3{font:500 30px/1.2 AnVanSerif,serif;color:#345745;margin:7px 0}.natal-palace-reading h4{font-size:16px;margin:20px 0 8px}.natal-palace-reading p{font-size:15px;line-height:1.85;margin:12px 0;color:#55574c}.natal-palace-reading .natal-evidence{font-size:12px;color:#8e734e;border-bottom:1px solid #ded4bb;padding-bottom:14px}.natal-advice{padding:16px 18px;border-left:3px solid #a28b55;background:#f1efdf;border-radius:0 10px 10px 0;margin-top:18px}.natal-advice p{margin:6px 0;font-size:14px}.natal-stars{display:flex;flex-wrap:wrap;gap:6px}.natal-stars button,.natal-related button{font:inherit;font-size:12px;background:#f7f0e2;border:1px solid #dbcfb3;color:#755f3c;border-radius:20px;padding:8px 11px;min-height:38px}.natal-star-note{padding:12px 15px;background:#f3f1e6;border-radius:10px}.natal-star-note p{font-size:13px;margin:0}.natal-related{display:flex;flex-wrap:wrap;gap:6px}.natal-overview{margin-top:27px}.natal-overview>.eyebrow{color:#91784e;font-size:9px}.natal-overview h3{font:500 29px/1.3 AnVanSerif,serif;color:#345745;margin:8px 0 15px}.natal-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.natal-overview-card{border:1px solid #d1c5a9;border-radius:14px;background:#faf6eb;padding:17px}.natal-overview-card h4{font-size:16px;margin:0 0 9px;color:#654e32}.natal-overview-card p{font-size:13px;line-height:1.75;margin:8px 0;color:#646456}.natal-overview-card button{font:inherit;font-size:12px;border:0;background:none;padding:7px 0;color:#9d4c3b;font-weight:600}.natal-limit{font-size:12px;line-height:1.7;color:#8a806b;padding:12px 0;margin:12px 0}.natal-method{font-size:12px;color:#817963;border-top:1px solid #d4cab6;padding-top:13px;line-height:1.8}.natal-method summary{cursor:pointer}.natal-method a{color:#6b7258}
.natal-viewer{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#f5f0e5;color:#3f493c;overscroll-behavior:contain}.natal-viewer::backdrop{background:#1b3025cc}.natal-viewer[open]{display:flex;flex-direction:column}.natal-viewer-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 15px;padding-top:max(12px,env(safe-area-inset-top));border-bottom:1px solid #c8b992;background:#faf6ed;flex-shrink:0}.natal-viewer-tools{display:flex;align-items:center;gap:6px}.natal-viewer-tools button{padding:8px 12px}.natal-viewer-tools output{font-size:12px;min-width:38px;text-align:center}.natal-viewer-scroll{flex:1;overflow:auto;padding:12px;touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch}.natal-viewer-canvas{width:100%;min-width:280px;margin:auto}.natal-viewer .natal-svg{max-width:none}.natal-viewer-bar strong{font:500 21px AnVanSerif,serif}.natal-viewer button:focus-visible{outline:2px solid #9e7858;outline-offset:2px}
@media(max-width:700px){.fortune-tabs{gap:8px!important}.fortune-tabs #fortune-tab-natal,.fortune-tabs #fortune-tab-pick,.fortune-tabs #fortune-tab-love{min-width:0;min-height:76px;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:12px 4px;font-size:12px!important}.fortune-tabs button svg{width:23px!important;height:23px!important}.natal-section{margin-top:14px}.natal-heading{padding:23px 19px;gap:10px;border-radius:17px}.natal-heading h2{font-size:32px}.natal-heading p{font-size:12px;line-height:1.6}.natal-heading>svg{width:78px;height:78px}.natal-heading .eyebrow{font-size:8px;letter-spacing:1px}.natal-form,.natal-palace-reading{padding:18px 15px}.natal-form h3{font-size:18px}.natal-form-top{gap:8px}.natal-form-top .textbtn{padding:3px 0}.natal-fields{gap:13px 10px}.natal-fields input,.natal-fields select{font-size:16px;padding:10px 8px}.natal-fields>label:first-child{grid-column:1/-1}.natal-fields>label:nth-child(2){grid-column:1/-1}.natal-fields #natal-lunar-fields,.natal-fields #natal-solar-field{grid-column:1/-1}.natal-submit-row{gap:11px}.natal-submit-row .primary{padding:12px 16px}.natal-submit-row .textbtn{font-size:12px}.natal-result-heading h3{font-size:25px}.natal-chart-actions{justify-content:stretch}.natal-chart-actions button{flex:1;font-size:12px;padding:9px}.natal-palace-reading h3{font-size:26px}.natal-palace-reading p{font-size:15px;line-height:1.8}.natal-overview-grid{grid-template-columns:1fr}.natal-overview h3{font-size:26px}.natal-viewer-bar{flex-wrap:wrap}.natal-viewer-bar strong{font-size:19px}.natal-viewer-tools{margin-left:auto}.natal-viewer-tools button{min-height:40px;padding:8px 11px}.natal-select-row select{max-width:210px}.natal-result-meta{line-height:1.6}}
.fortune-tabs #fortune-tab-draw{grid-column:2/-1!important;grid-row:1}
.fortune-tabs #fortune-tab-pick{grid-column:1;grid-row:2}.fortune-tabs #fortune-tab-love{grid-column:2;grid-row:2}.fortune-tabs #fortune-tab-natal{grid-column:3;grid-row:2;justify-content:flex-start;min-height:75px;padding:12px 17px;text-align:left;border:1px solid #d1c5ad;border-radius:14px;background:#f8f1e4;color:#514a3d;box-shadow:0 4px 12px #5f492b12;gap:12px}
.fortune-tabs #fortune-tab-natal svg{width:30px;height:30px;flex:0 0 30px;color:#9e5b43}.fortune-tabs #fortune-tab-natal[aria-selected=true]{background:#e8d8c1;color:#8e3e30;border-color:#b59a70;box-shadow:inset 0 0 0 1px #b59a7033}
.natal-section [hidden]{display:none!important}
@media(max-width:700px){.fortune-tabs #fortune-tab-natal{justify-content:center;padding:12px 4px;min-height:76px;gap:7px}.fortune-tabs #fortune-tab-natal svg{flex-basis:23px}}
.natal-submit-row .primary{width:auto;display:inline-flex;justify-content:center;align-items:center;gap:9px;white-space:nowrap;flex-shrink:0}
.natal-palace-reading>.eyebrow{font-size:9px;letter-spacing:1.2px;color:#92794e}
.natal-fields label{margin:0}.natal-fields input,.natal-fields select{margin:0}
/* Jade silk and an earlier-heaven seal, with quiet paper below. */
.natal-heading{position:relative;isolation:isolate;min-height:188px;background:#244c3e;border-color:#a68e5c;box-shadow:0 12px 26px #264d3b16}
.natal-heading::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#1c443ce8 0%,#244c3ed6 40%,#244c3e33 100%),url('/art/today-v49.webp') center 42%/cover;opacity:.95}
.natal-heading::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 84% 45%,#d8b66a3d,transparent 37%);pointer-events:none}
.natal-heading>div{position:relative;z-index:2;max-width:68%}.natal-heading h2{text-shadow:0 2px 15px #172f252e}
.natal-heading-bagua{position:absolute;right:30px;top:18px;width:154px;height:154px;opacity:.95;pointer-events:none;animation:scene-turn 28s linear infinite,scene-gold-glow 5s ease-in-out infinite;animation-play-state:paused;background:radial-gradient(circle,#244b3b99,transparent 70%);border-radius:50%}
.natal-heading.scene-motion-active .natal-heading-bagua{animation-play-state:running}
html.scene-page-hidden .natal-heading-bagua,body:has(#calm-motion[aria-pressed=true]) .natal-heading-bagua{animation-play-state:paused!important}
.natal-form{background:linear-gradient(135deg,#fffcf4,#f6f3e7);border-color:#bfb18d}.natal-form h3{color:#345a46}
.natal-diagram{border:1px solid #b59451;box-shadow:0 12px 28px #66512b14;background:#f4ebd6}
.natal-svg [data-palace]:focus rect{stroke:unset;stroke-width:unset}.natal-svg [data-palace]:focus .natal-cell-surface{stroke:#a34d39;stroke-width:4}
.natal-svg [data-palace]:hover .natal-cell-surface{stroke:#ab7c3b;stroke-width:3}
.natal-selected-glow{pointer-events:none}
.natal-links-toggle{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0 0 13px;font-size:12px;color:#7c6c4c;cursor:pointer}
.natal-links-toggle input{width:16px;height:16px;margin:0;accent-color:#496951}
.natal-chart-actions button{background:linear-gradient(#fffaf0,#f1e8d1);border-color:#c3ab7e}
.natal-palace-reading{background:linear-gradient(135deg,#fffdf5,#f8f7ec);border-color:#c2b287}
.natal-overview-card:nth-child(3n + 1){background:linear-gradient(130deg,#f8f4e5,#eaf0e3)}.natal-overview-card:nth-child(3n + 2){background:linear-gradient(130deg,#faf4e8,#f2e8d7)}.natal-overview-card:nth-child(3n){background:linear-gradient(130deg,#f6f4e8,#e8f0ed)}
@media(max-width:700px){.natal-heading{min-height:170px;padding:22px 18px}.natal-heading-bagua{width:112px;height:112px;right:12px;top:29px}.natal-heading>div{max-width:63%}.natal-heading h2{font-size:31px}.natal-heading p{font-size:12px;line-height:1.6;max-width:185px}.natal-heading .eyebrow{font-size:8px;letter-spacing:.8px}.natal-links-toggle{font-size:11px;margin-bottom:10px}.natal-diagram{box-shadow:0 6px 17px #66512b0e}}
@media(max-width:355px){.natal-heading-bagua{width:96px;height:96px;right:8px;top:33px}.natal-heading h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.natal-heading-bagua{animation:none;filter:drop-shadow(0 0 5px #f5d08a66)}}
/* Align native iOS time and gender fields without intrinsic input overflow. */
.natal-fields .natal-time-field,.natal-fields .natal-gender-field{display:grid;grid-template-rows:36px 48px auto;align-content:start;align-items:start;line-height:18px;min-width:0}
.natal-time-field>span:first-child{min-width:0}.natal-time-field small{font-size:11px;font-weight:400;color:#817b69}
.natal-fields #natal-time,.natal-fields #natal-gender{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;height:48px;min-height:48px;margin:0;padding:0 10px;line-height:normal}
.natal-fields #natal-time{-webkit-appearance:none;appearance:none;text-align:left;overflow:hidden}
#natal-time::-webkit-date-and-time-value{text-align:left;min-height:1.2em}#natal-time::-webkit-datetime-edit{padding:0}
#natal-partial{border:1px solid #c4af80;border-radius:17px;background:linear-gradient(135deg,#fff9e9,#eef0df);padding:24px;line-height:1.8}
.natal-partial-top{border-bottom:1px solid #d6c9ac;padding-bottom:15px;margin-bottom:18px}.natal-partial-top h3{font:500 32px AnVanSerif,serif;color:#355745;margin:9px 0}.natal-partial-top p{margin:0;color:#94743d}.natal-partial-top .eyebrow{font-size:9px;color:#8d7850}
.natal-partial-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.natal-partial-facts span{display:block;font-size:11px;color:#8a7b5c}.natal-partial-facts strong{font-size:15px;color:#45604c}#natal-partial h4{font-size:17px;margin:23px 0 10px;color:#3f5b45}#natal-partial>p{font-size:14px;color:#676552;margin:12px 0}#natal-partial button{margin-top:10px}
@media(max-width:700px){#natal-partial{padding:19px 16px}.natal-time-field small{font-size:10px}.natal-fields .natal-time-field,.natal-fields .natal-gender-field{line-height:17px}}
/* Own the visible time text; keep the native picker as an accessible touch target. */
.natal-time-control{position:relative;display:flex;align-items:center;box-sizing:border-box;width:100%;min-width:0;height:48px;padding:0 10px;border:1px solid #d0c7b2;border-radius:10px;background:#fffdf7;overflow:hidden}
.natal-fields .natal-time-control #natal-time{position:absolute;inset:0;width:100%;height:100%;padding:0;margin:0;border:0;opacity:0;z-index:2;cursor:pointer}
#natal-time-display{display:block;pointer-events:none;font-size:16px;font-weight:400;line-height:24px;color:#3f493c}
.natal-time-control:focus-within{outline:2px solid #9e7858;outline-offset:2px}

/* Keep a shared date row, followed by aligned time and gender controls. */
.natal-fields #natal-solar-field,.natal-fields #natal-lunar-fields{grid-column:1/-1}
.natal-fields .natal-time-field,.natal-fields .natal-gender-field{grid-template-rows:36px 48px auto}
.natal-form-top .textbtn{margin:0}
.natal-submit-row .textbtn{margin:0}
@media(min-width:701px){
 .natal-fields input[type=date]{appearance:auto;-webkit-appearance:auto;height:48px;min-height:48px}
 .natal-time-control{padding:0;border:0;background:transparent;overflow:visible}
 .natal-fields .natal-time-control #natal-time{position:static;inset:auto;opacity:1;z-index:auto;appearance:auto;-webkit-appearance:auto;border:1px solid #d0c7b2;border-radius:10px;background:#fffdf7;padding:0 12px;cursor:text;overflow:visible}
 #natal-time-display{display:none}
 .natal-time-control:focus-within{outline:none}
}