.professional-chart-active.view-chart .screen{padding:0;overflow-y:auto}
.professional-chart-active #view-chart{height:calc(100% - var(--professional-nav-height,68px));padding:0;background:#f1edf1;color:#493b4e}
#appShell.professional-chart-active #view-chart>.chart-page-tabs{display:flex!important;position:sticky;top:0;z-index:5;margin:0;min-height:44px;padding:0 12px;background:#f7f3f6;border-bottom:1px solid #d8ced8;gap:24px;align-items:center}
.professional-chart-active .chart-page-tabs button{min-height:44px;font-size:14px;color:#62546b;background:transparent;white-space:nowrap;padding:8px 0;border-radius:0}
.professional-chart-active .chart-page-tabs button.active{color:#734667;box-shadow:inset 0 -2px #734667;background:transparent}
.professional-chart-active .chart-page-tabs button.active::after{display:none}
.professional-chart-active #professionalChartFrame{height:calc(100% - 45px);background:#f1edf1}
.professional-chart-active[data-chart-tab=portrait] #view-chart>#chartPortraitPanel,
.professional-chart-active[data-chart-tab=relation] #view-chart>#chartRelationPanel{display:block!important;padding:16px;max-width:640px;margin:auto}
.professional-chart-active[data-chart-tab=full].view-chart .screen{overflow-y:hidden}
.professional-chart-active #chartPortraitPanel .portrait-identity{background:#e9e2eb;color:#493b4e;border:0;border-radius:0}
.professional-chart-active #chartPortraitPanel .portrait-title,
.professional-chart-active #chartPortraitPanel .portrait-copy,
.professional-chart-active #chartPortraitPanel .portrait-stats strong{color:#493b4e}
.professional-chart-active #chartPortraitPanel .portrait-stats>div{min-width:0}
.professional-chart-active #chartPortraitPanel .portrait-stats span{color:#62546b;white-space:normal}
.professional-chart-active #chartPortraitPanel .portrait-copy{font-size:14px;line-height:1.7}
.professional-chart-active #chartPortraitPanel .portrait-stats span{font-size:12px;line-height:18px}
.professional-chart-active #chartPortraitPanel .portrait-stats{border-color:#d3c7d5}
.professional-chart-active #chartPortraitPanel .portrait-stats>div{border-color:#d3c7d5}
.professional-chart-active #chartPortraitPanel .portrait-section,
.professional-chart-active #chartRelationPanel section{background:transparent;box-shadow:none}
.professional-chart-active #view-chart{--wood:#246345;--fire:#a03d38;--earth:#65544f;--metal:#806000;--water:#2d5d85}
.professional-chart-active #view-chart .wuxing-mu{color:var(--wood)!important}
.professional-chart-active #view-chart .wuxing-huo{color:var(--fire)!important}
.professional-chart-active #view-chart .wuxing-tu{color:var(--earth)!important}
.professional-chart-active #view-chart .wuxing-jin{color:var(--metal)!important}
.professional-chart-active #view-chart .wuxing-shui{color:var(--water)!important}
.professional-chart-active #chartPortraitPanel .portrait-stats{grid-template-columns:1fr 1fr}
.professional-chart-active #chartPortraitPanel .portrait-stats .best{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:12px;border-left:0;border-top:1px solid #d3c7d5;margin-top:10px;padding-top:8px}
.professional-chart-active #chartPortraitPanel .portrait-stats .best strong{margin:0}
.professional-chart-active #chartPortraitPanel :is(.portrait-relation,.portrait-life-item,.portrait-action){background:#f7f3f6;border-color:#d8ced8;color:#493b4e}
.professional-chart-active #chartPortraitPanel .portrait-relation-option{background:#e9e2eb;color:#62546b;border-radius:4px;font-size:12px;line-height:20px;padding:2px 6px}
.professional-chart-active #chartPortraitPanel .portrait-relation-option strong{font-size:12px}
.professional-chart-active #chartPortraitPanel :is(.portrait-section-head span,.portrait-relation-top span,.portrait-life-item p,.portrait-life-item small,.portrait-reason span,.portrait-action-method,.portrait-notice){font-size:12px;line-height:1.6;color:#62546b}
.professional-chart-active #chartPortraitPanel :is(.portrait-relation-top b,.portrait-reason b,.portrait-action p){font-size:14px;line-height:1.6;color:#493b4e}
.professional-chart-active #chartPortraitPanel .portrait-section-head{flex-wrap:wrap}
.professional-chart-active #chartRelationPanel :is(.natal-relation-intro p,.natal-relation-count,.natal-relation-pillar small,.natal-relation-pillar em,.natal-relation-pillar>span,.natal-reading-row,.natal-reading-row b,.natal-relation-legend,.natal-relation-reading-head span,.natal-reading-tags span,.natal-relation-notice){font-size:12px;line-height:1.5;color:#62546b}
.professional-chart-active #chartRelationPanel .natal-reading h4{font-size:14px;color:#493b4e}
.professional-chart-active #chartRelationPanel .natal-reading-row{grid-template-columns:60px minmax(0,1fr)}
.professional-chart-active #chartRelationPanel :is(.natal-relation-pillars,.natal-line-label,.natal-relation-count,.natal-reading-tags span){background:#f7f3f6;border-color:#d8ced8}
.professional-chart-active #chartRelationPanel .natal-relation-pillar.is-day{background:#e9e2eb;box-shadow:inset 0 2px 0 #947696}
.professional-chart-active #chartRelationPanel .natal-relation-pillar{height:128px;border-color:#d8ced8}
.professional-chart-active #chartRelationPanel .natal-line-label b{font-size:11px}
.professional-chart-active #chartRelationPanel .natal-line-label small{font-size:10px;color:#62546b}
