.prommachart-page{max-width:1400px;margin-inline:auto}
.prommachart-heading{margin-bottom:24px}
.prommachart-eyebrow{display:block;color:#886225;font-size:.8em;font-weight:600;letter-spacing:.02em;margin-bottom:5px}
.astrologer-main .prommachart-heading h1{font-size:calc(2rem * var(--astrologer-font-scale,1));line-height:1.45;margin:0 0 5px}
.prommachart-heading p,.prommachart-section-heading p{color:#76675e;margin:0}
.prommachart-layout{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.55fr);gap:22px;align-items:start}
.prommachart-sidebar{display:grid;gap:20px;min-width:0}
.prommachart-card{border:1px solid #e8ddcb;border-radius:16px;padding:24px;background:#fffdf9;min-width:0}
.astrologer-main .prommachart-card h2,.astrologer-main .prommachart-section-heading h2{font-size:calc(1.2rem * var(--astrologer-font-scale,1));line-height:1.5;margin:0 0 20px}
.prommachart-gender{margin:0 0 20px;padding:0;border:0;min-width:0}
.prommachart-gender legend{float:none;width:auto;font-size:1em;font-weight:600;margin-bottom:8px}
.prommachart-gender>div{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.prommachart-gender label{position:relative;cursor:pointer;min-width:0}
.prommachart-gender input{position:absolute;opacity:0;width:1px;height:1px;min-height:0!important}
.prommachart-gender span{display:flex;min-height:48px;align-items:center;justify-content:center;padding:8px 12px;border:1px solid #e8ddcb;border-radius:10px;background:#fff;color:#76675e;font-weight:600}
.prommachart-gender input:checked+span{background:#65090d;color:#fff5e2;border-color:#65090d;box-shadow:0 3px 9px #65090d15}
.prommachart-gender input:focus-visible+span{outline:3px solid #886225;outline-offset:3px}
.prommachart-field{margin-bottom:18px;min-width:0}
.prommachart-field .form-label{font-weight:600}
.prommachart-field .form-control,.prommachart-field .form-select{min-height:48px}
.prommachart-field[hidden]{display:none!important}
.prommachart-age-preview{padding:10px 12px;border:1px solid #e8ddcb;border-radius:9px;background:#faf3e6;color:#65090d;font-size:.85em;line-height:1.7;margin:12px 0 0}
.prommachart-basis-hint{margin-bottom:18px!important}
.prommachart-result-name{font-weight:600;font-size:1.1em;margin:10px 0 0}
.prommachart-gender [data-gender-hint]:empty{display:none}
.prommachart-help{color:#76675e;font-size:.82em;line-height:1.7;margin:8px 0 0}
.prommachart-submit{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:50px;padding:12px;font-weight:600}
.prommachart-intro{display:flex;align-items:center;gap:15px;padding:8px 12px;color:#886225;font-size:.9em}
.prommachart-intro .site-icon{width:32px;height:32px}.prommachart-intro p{margin:0}
.prommachart-result{padding:24px;border:1px solid #d9b677;border-top:4px solid #886225;border-radius:14px;background:linear-gradient(145deg,#fcf1dc,#fffdf9);scroll-margin-top:92px;outline:none;min-width:0}
.prommachart-result:focus-visible{outline:2px solid #886225;outline-offset:3px}
.prommachart-result-kicker{font-size:.8em;color:#886225;font-weight:600}
.prommachart-result-age{margin:8px 0 10px;color:#65090d}.prommachart-result-age strong{font-size:2em;font-weight:600}
.astrologer-main .prommachart-result h2{font-size:calc(1.5rem * var(--astrologer-font-scale,1));line-height:1.5;margin:10px 0 2px}
.prommachart-alias{color:#886225;font-size:.85em;margin-bottom:16px}
.prommachart-result>p{line-height:1.8}.prommachart-advice{padding-top:15px;border-top:1px solid #dfcba7}
.prommachart-advice strong{font-size:.9em;color:#65090d}.prommachart-advice p{margin:6px 0 0;line-height:1.8}
.prommachart-wheel-card{padding:22px 20px 20px}
.prommachart-wheel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-inline:6px;margin-bottom:14px}
.astrologer-main .prommachart-wheel-heading h2{margin:0}
.prommachart-wheel-heading .thai-wheel-expand{flex-shrink:0;min-height:44px;font-size:.85em}
.prommachart-wheel{display:block;width:100%;height:auto;max-width:780px;margin-inline:auto;font-family:Sarabun,system-ui,sans-serif}
.prommachart-sector-body{fill:#fffdf9;fill-opacity:.2;stroke:#ded1bc;stroke-width:1}
.prommachart-sector-rim{fill:#65090d;stroke:#d9b677;stroke-width:1}
.prommachart-sector-name{fill:#493223;font-size:19px;font-weight:600}
.prommachart-sector-ages{fill:#fff5df;font-size:14px;font-weight:600;letter-spacing:.2px}
.prommachart-sector.is-selected .prommachart-sector-body{fill:#e8c56a;fill-opacity:.6;stroke:#886225;stroke-width:2.5}
.prommachart-sector.is-selected .prommachart-sector-rim{fill:#886225}
.prommachart-sector.is-selected .prommachart-sector-name{fill:#65090d;font-weight:700}
.prommachart-center-gender{font-size:23px;font-weight:600;fill:#65090d}
.prommachart-center-age{font-size:17px;fill:#886225}
.prommachart-wheel-caption{text-align:center;color:#65090d;font-size:.87em;line-height:1.8;margin:18px 0 0}
.prommachart-meanings{margin-top:32px}.prommachart-section-heading{margin-bottom:16px}
.astrologer-main .prommachart-section-heading h2{margin-bottom:5px}
.prommachart-section-heading p{font-size:.9em}
.prommachart-meaning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.prommachart-meaning{min-width:0;border:1px solid #e8ddcb;border-radius:12px;background:#fffdf9;overflow:hidden}
.prommachart-meaning.is-current{border-color:#b58d47;background:#fcf3e2}
.prommachart-meaning summary{display:flex;align-items:center;gap:12px;padding:13px;min-height:78px;list-style:none;cursor:pointer;min-width:0;font-weight:600;color:#65090d}
.prommachart-meaning summary::-webkit-details-marker{display:none}
.prommachart-meaning summary>svg{width:48px;height:48px;flex:0 0 48px}
.prommachart-meaning summary>span{min-width:0}
.prommachart-meaning summary small{display:block;color:#76675e;font-size:.75em;font-weight:400}
.prommachart-disclosure{margin-left:auto;font-size:1.25em;color:#886225}
.prommachart-meaning[open] .prommachart-disclosure{transform:rotate(45deg)}
.prommachart-meaning summary:focus-visible{outline:2px solid #886225;outline-offset:-3px}
.prommachart-meaning-body{border-top:1px solid #e8ddcb;padding:16px;font-size:.9em;line-height:1.8}
.prommachart-note{margin-top:25px;padding-top:20px;border-top:1px solid #e8ddcb;color:#76675e;text-align:center;font-size:.8em;line-height:1.8}
.horathipbordhi-app[class*="astrologer-font-"] .prommachart-layout{grid-template-columns:minmax(0,1fr)}
@media(max-width:1100px){.prommachart-layout{grid-template-columns:minmax(230px,.8fr) minmax(0,1fr)}.prommachart-card,.prommachart-result{padding:18px}.prommachart-wheel-card{padding:18px 10px}.prommachart-meaning-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767.98px){.prommachart-layout{grid-template-columns:minmax(0,1fr);gap:20px}.prommachart-heading{margin-bottom:18px}.astrologer-main .prommachart-heading h1{font-size:calc(1.65rem * var(--astrologer-font-scale,1))}.prommachart-card{padding:18px}.prommachart-wheel-card{padding:16px 6px}.prommachart-wheel-heading{padding-inline:10px}.prommachart-meaning-grid{grid-template-columns:minmax(0,1fr)}.prommachart-intro{padding:0 8px}.prommachart-meanings{margin-top:24px}.prommachart-wheel-caption,.prommachart-wheel-card>.prommachart-help{padding-inline:12px}}
@media(prefers-reduced-motion:reduce){.prommachart-disclosure{transition:none}}
@media print{.prommachart-sidebar form,.prommachart-intro{display:none}.prommachart-layout{grid-template-columns:1fr}.prommachart-wheel{max-width:650px}}

.prommachart-sector[role="button"] { cursor: pointer; touch-action: manipulation; }
.prommachart-sector[role="button"]:hover .prommachart-sector-body,
.prommachart-sector[role="button"]:focus-visible .prommachart-sector-body { fill: #f3e3bd; stroke: #65090d; stroke-width: 3; }
.prommachart-sector.is-selected[role="button"]:hover .prommachart-sector-body,
.prommachart-sector.is-selected[role="button"]:focus-visible .prommachart-sector-body { fill: #e8c56a; fill-opacity: .6; }
.prommachart-sector[role="button"]:focus-visible { outline: none; }
.prommachart-station-dialog { margin: auto; max-width: calc(100% - 24px); width: min(560px, calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #d9b677; border-radius: 16px; color: #493223; background: #fffdf9; overflow: auto; overscroll-behavior: contain; }
.prommachart-station-dialog::backdrop { background: rgb(25 18 12 / 55%); }
.prommachart-station-header { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-bottom: 1px solid #ded1bc; background: #fffdf9; }
.prommachart-station-header h2 { font-size: 22px; margin: 0; }
.prommachart-station-header button { min-width: 44px; min-height: 44px; font-size: 24px; }
.prommachart-station-body { padding: 20px; }
.prommachart-station-body h3 { font-size: 17px; font-weight: 700; }
.prommachart-station-body p { line-height: 1.8; }
.prommachart-station-current { padding: 8px 12px; background: #f3e3bd; border-radius: 8px; }
.prommachart-zoom-dialog { margin:auto; }
.prommachart-zoom-dialog .chart-zoom-canvas { display:flex; }
.prommachart-zoom-dialog .chart-zoom-stage { margin:auto; background-image:linear-gradient(rgba(250,246,238,.78),rgba(250,246,238,.78)),url('/images/brand/logo-transparent.png'); background-position:center; background-size:100% 100%,60% auto; background-repeat:no-repeat; }
