/* ═══════════════════════════════════════════════
   사주 결과 화면 전체 재구성
   ═══════════════════════════════════════════════ */

.saju-result-page {
    padding: clamp(2rem,5vw,4rem) clamp(1rem,4vw,4rem);
    background: var(--ivory);
}
.saju-result-page[hidden] { display: none !important; }

/* 헤더 */
.res-header {
    max-width: 1200px;
    margin: 0 auto 1rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
}
.res-engine-badge {
    display: inline-block;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    background: var(--purple);
    color: #fff;
    padding: .2rem .6rem;
    border-radius: .25rem;
    margin-bottom: .4rem;
}
.res-header-left h2 { margin: 0 0 .2rem; font-size: clamp(1.4rem,3vw,2rem); }
.res-header-left p  { margin: 0; color: var(--muted); font-size: .9rem; }
.res-header-right   { display: flex; gap: .5rem; flex-wrap: wrap; }

/* 메타 바 */
.res-meta-bar {
    max-width: 1200px;
    margin: 0 auto .75rem;
    display: flex;
    flex-wrap: wrap;
    gap: .3rem .75rem;
    padding: .6rem 1rem;
    background: var(--purple);
    border-radius: .4rem;
    font-size: .82rem;
}
.res-meta-bar span  { display: flex; align-items: center; gap: .3rem; }
.res-meta-bar em    { font-style: normal; color: rgba(255,255,255,.55); }
.res-meta-bar b     { font-weight: 700; color: #fff; }
.res-engine-note    { margin-left: auto; font-size: .72rem; color: rgba(255,255,255,.45); }

/* 공통 블록 */
.res-block {
    max-width: 1200px;
    margin: 0 auto 1.1rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: .5rem;
    padding: 1.15rem 1.4rem;
    box-shadow: 0 4px 18px rgba(66,36,92,.06);
}
.res-block-title {
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .12em;
    color: var(--purple);
    text-transform: uppercase;
    border-bottom: 2px solid var(--purple-soft);
    padding-bottom: .45rem;
    margin-bottom: .9rem;
}
.res-block-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 2px solid var(--purple-soft);
    padding-bottom: .45rem;
    margin-bottom: .9rem;
    flex-wrap: wrap;
}
.res-block-title-row .res-block-title {
    border: none;
    padding: 0;
    margin: 0;
}

/* 형충회합 인라인 */
.rel-inline-wrap {
    border-top: 1px solid var(--line);
    padding-top: .8rem;
    margin-top: .25rem;
}
.rel-inline-title {
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .1em;
    color: var(--muted);
    text-transform: uppercase;
    margin-bottom: .5rem;
}
.rel-inline-grid { display: flex; flex-wrap: wrap; gap: .35rem; }
.rel-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .28rem .65rem;
    border-radius: .3rem;
    font-size: .78rem;
    font-weight: 700;
    border: 1.5px solid;
}
.rel-badge.none   { background: var(--cream); border-color: var(--line); color: var(--muted); font-weight: 400; }
.rel-badge.chung  { background: #fde8e6; border-color: #e08880; color: #a01808; }
.rel-badge.hap    { background: #e8f4e8; border-color: #7aaa7a; color: #186018; }
.rel-badge.hyung  { background: #fff0e0; border-color: #e0aa60; color: #804800; }
.rel-badge.pa     { background: #f0e8f8; border-color: #b090d0; color: #501880; }
.rel-badge.hae    { background: #e0eef8; border-color: #7aaac8; color: #184878; }
.rel-badge.wonjin { background: #f8f0e0; border-color: #c8aa60; color: #604800; }
.rel-badge.samhap { background: #e8f4e8; border-color: #60aa60; color: #186018; }
.rel-badge.banghap{ background: #e8f4e8; border-color: #60aa60; color: #186018; }
.rel-badge.tiangan{ background: #f0e8f8; border-color: #9070c0; color: #40187a; }
.rel-badge-label  { font-size: .68rem; opacity: .65; }
.rel-badge-val    { font-weight: 800; }

/* 오행 + 신살 2열 */
.res-two-col {
    max-width: 1200px;
    margin: 0 auto 1.1rem;
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 1rem;
    align-items: start;
}

/* 오행 분포 */
.element-bars-v2 { display: flex; flex-direction: column; gap: .55rem; }
.element-line {
    display: grid;
    grid-template-columns: 48px 1fr 20px;
    align-items: center;
    gap: .5rem;
}
.element-name  { font-size: .84rem; font-weight: 900; }
.bar-track {
    height: .75rem;
    background: #ece8e0;
    border-radius: 999px;
    overflow: hidden;
}
.bar-fill { height: 100%; border-radius: 999px; transition: width 1s cubic-bezier(.4,0,.2,1); }
.bar-fill.el-목 { background: #4d9e58; }
.bar-fill.el-화 { background: #d04030; }
.bar-fill.el-토 { background: #c8a030; }
.bar-fill.el-금 { background: #888898; }
.bar-fill.el-수 { background: #2a4878; }
.element-count  { font-size: .84rem; font-weight: 900; text-align: right; }
.el-summary-text { font-size: .83rem; color: var(--muted); line-height: 1.7; margin-top: .65rem; margin-bottom: 0; }

/* 신살 v2 */
.shinsal-grid-v2 { display: flex; flex-direction: column; gap: .6rem; }
.ss-group-title {
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .1em;
    color: var(--muted);
    text-transform: uppercase;
    margin-bottom: .25rem;
}
.ss-tags { display: flex; flex-wrap: wrap; gap: .28rem; }
.ss-tag {
    display: inline-flex;
    flex-direction: column;
    padding: .25rem .6rem;
    border-radius: .25rem;
    font-size: .78rem;
    font-weight: 700;
    border: 1px solid;
}
.ss-tag small { font-size: .62rem; font-weight: 400; line-height: 1.35; color: inherit; opacity: .75; }
.ss-gil   { background: #eef6ee; border-color: #8aba8a; color: #185818; }
.ss-hyung { background: #fef2ee; border-color: #e09080; color: #801808; }
.ss-gun   { background: #f0ecf8; border-color: #a888cc; color: #401878; }

/* 4열 카드 */
.res-four-col {
    max-width: 1200px;
    margin: 0 auto 1.1rem;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: .9rem;
}
.res-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: .5rem;
    padding: .9rem 1rem;
    box-shadow: 0 4px 16px rgba(66,36,92,.05);
}
.res-card-title {
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    color: var(--purple);
    text-transform: uppercase;
    border-bottom: 2px solid var(--purple-soft);
    padding-bottom: .35rem;
    margin-bottom: .6rem;
}
.res-card-body { font-size: .86rem; color: var(--ink); line-height: 1.7; }
.god-badge {
    display: inline-flex;
    align-items: center;
    padding: .25rem .7rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 900;
    margin: .18rem .18rem 0 0;
}
.god-main { background: var(--purple); color: #fff; }
.god-sub  { background: var(--purple-soft); color: var(--purple); border: 1px solid #c0a8e0; }
.strength-bar { height: 7px; background: #ece8e0; border-radius: 999px; overflow: hidden; margin: .35rem 0; }
.strength-fill { height: 100%; border-radius: 999px; transition: width 1s ease; }
.strength-strong .strength-fill { background: var(--purple); }
.strength-weak   .strength-fill { background: var(--olive); }
.strength-mid    .strength-fill { background: var(--gold); }

/* 대운표 */
.luck-table-scroll { overflow-x: auto; padding-bottom: .4rem; }
.luck-table {
    display: grid;
    grid-template-columns: repeat(10,minmax(95px,1fr));
    gap: .45rem;
    min-width: 650px;
}
.luck-card {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: .35rem;
    padding: .7rem .45rem;
    text-align: center;
    font-size: .76rem;
    position: relative;
}
.luck-card.current-luck {
    border-color: var(--gold);
    background: #fffbe8;
}
.luck-card.current-luck::before {
    content: '현재';
    position: absolute;
    top: -.52rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gold);
    color: #fff;
    font-size: .62rem;
    font-weight: 900;
    padding: .08rem .42rem;
    border-radius: 999px;
    white-space: nowrap;
}
.luck-card span   { display: block; font-size: .7rem; color: var(--muted); margin-bottom: .25rem; }
.luck-card strong { display: block; font-size: 1rem; font-weight: 900; color: var(--purple); font-family: 'Noto Serif KR',serif; margin-bottom: .2rem; }
.luck-card small  { display: block; font-size: .68rem; color: var(--muted); line-height: 1.4; }

/* 세운 배지 */
.annual-badge {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--purple);
    color: #fff;
    padding: .38rem .9rem;
    border-radius: .35rem;
    flex-shrink: 0;
}
.annual-badge .ab-year  { font-size: .72rem; opacity: .7; }
.annual-badge .ab-ganji { font-family: 'Noto Serif KR',serif; font-size: 1.2rem; font-weight: 900; }
.annual-badge .ab-ten   { font-size: .76rem; background: rgba(255,255,255,.2); padding: .1rem .42rem; border-radius: 999px; }
.annual-badge .ab-age   { font-size: .72rem; opacity: .7; }

/* 월운 테이블 v2 */
.monthly-table-v2 {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    gap: .45rem;
}
.month-card {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: .35rem;
    padding: .6rem .4rem;
    text-align: center;
    font-size: .74rem;
    position: relative;
    min-width: 76px;
}
.month-card.current-month {
    border-color: var(--gold);
    background: #fffbe8;
}
.month-card.current-month::before {
    content: '이달';
    position: absolute;
    top: -.48rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gold);
    color: #fff;
    font-size: .6rem;
    font-weight: 900;
    padding: .06rem .38rem;
    border-radius: 999px;
}
.mc-month  { font-size: .68rem; color: var(--muted); margin-bottom: .18rem; }
.mc-jeolgi { font-size: .63rem; color: var(--muted); margin-bottom: .22rem; }
.mc-ganji  { font-family: 'Noto Serif KR',serif; font-size: 1.05rem; font-weight: 900; color: var(--purple); margin: .12rem 0; }
.mc-ten    { display: inline-block; font-size: .68rem; font-weight: 700; padding: .07rem .32rem; border-radius: 999px; background: var(--purple-soft); color: var(--purple); }
.mc-enter  { font-size: .6rem; color: var(--muted); margin-top: .22rem; line-height: 1.4; }

/* 분석 조언 */
.deep-reading {
    max-width: 1200px;
    margin: 0 auto 0;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: .5rem;
    padding: 1.35rem 1.4rem;
    box-shadow: 0 4px 18px rgba(66,36,92,.05);
}
.deep-reading h3 { font-size: .95rem; color: var(--purple); margin-bottom: .45rem; }
.deep-reading > p {
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.8;
    margin-bottom: .9rem;
    padding: .8rem .95rem;
    background: var(--cream);
    border-left: 3px solid var(--gold);
    border-radius: 0 .3rem .3rem 0;
}
.advice-list {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(230px,1fr));
    gap: .6rem;
    margin-bottom: 1.1rem;
}
.advice-card {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: .35rem;
    padding: .8rem;
}
.advice-card > span {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--purple);
    color: #fff;
    border-radius: 50%;
    font-size: .7rem;
    font-weight: 900;
}
.advice-card > p { font-size: .83rem; color: var(--ink); line-height: 1.7; }
.place-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .7rem; }

/* 반응형 */
@media (max-width: 900px) {
    .res-two-col      { grid-template-columns: 1fr; }
    .res-four-col     { grid-template-columns: repeat(2,1fr); }
    .pillar-grid      { grid-template-columns: repeat(2,1fr); }
    .luck-table       { grid-template-columns: repeat(5,minmax(90px,1fr)); }
    .monthly-table-v2 { grid-template-columns: repeat(4,1fr); }
}
@media (max-width: 580px) {
    .res-four-col     { grid-template-columns: 1fr 1fr; }
    .pillar-grid      { grid-template-columns: repeat(2,1fr); }
    .luck-table       { grid-template-columns: repeat(3,minmax(90px,1fr)); }
    .monthly-table-v2 { grid-template-columns: repeat(3,1fr); }
    .res-meta-bar     { gap: .2rem .4rem; }
    .res-header       { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   Centered free-saju result layout
   Scope intentionally limited to #saju-result-page.
   ============================================================ */
#saju-result-page {
    --result-purple: #5b2b88;
    --result-purple-deep: #43205f;
    --result-lilac: #f0e9f8;
    --result-lilac-soft: #faf7fd;
    --result-line: #e6e0ef;
    --result-warm: #f7f4f0;
    padding: clamp(2.25rem, 5vw, 4.5rem) clamp(1rem, 4vw, 3rem);
    background: linear-gradient(180deg, #f8f5f1 0, #fbf9f6 28rem, #f7f4f0 100%);
    color: var(--text);
    scroll-margin-top: 5.5rem;
}

#saju-result-page .result-summary-shell {
    width: min(100%, 1040px);
    margin: 0 auto clamp(1.5rem, 4vw, 2.5rem);
}

#saju-result-page .result-centered-column {
    width: min(100%, 520px);
    margin: 0 auto;
}

#saju-result-page .res-header,
#saju-result-page .res-meta-bar,
#saju-result-page .res-block,
#saju-result-page .deep-reading,
#saju-result-page .res-two-col,
#saju-result-page .res-four-col {
    max-width: none;
}

#saju-result-page .res-header {
    margin: 0 auto 1rem;
    padding: 0 .25rem;
    align-items: center;
}

#saju-result-page .res-header-left h2 {
    margin: .2rem 0 .25rem;
    font-family: var(--font-serif);
    font-size: clamp(1.45rem, 4vw, 1.9rem);
    font-weight: 700;
    letter-spacing: 0;
    color: #302839;
}

#saju-result-page .res-engine-badge {
    background: var(--result-lilac);
    color: var(--result-purple);
    border: 1px solid #d9c9e9;
    border-radius: 999px;
    padding: .26rem .65rem;
    letter-spacing: 0;
    font-weight: 700;
}

#saju-result-page .res-header-right .btn-outline {
    min-height: 36px;
    padding: .35rem .8rem;
    border-color: #d8cee3;
    color: var(--result-purple);
    background: rgba(255,255,255,.65);
    border-radius: 999px;
    font-size: .78rem;
}

#saju-result-page .res-meta-bar {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    margin: 0 auto .85rem;
    padding: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--result-line);
    border-radius: 11px;
    box-shadow: 0 8px 26px rgba(66, 36, 92, .05);
}

#saju-result-page .res-meta-bar span {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: .08rem;
    padding: .65rem .8rem;
    border-right: 1px solid var(--result-line);
}

#saju-result-page .res-meta-bar span:nth-child(5) { border-right: 0; }
#saju-result-page .res-meta-bar em { color: #8b8292; font-size: .66rem; }
#saju-result-page .res-meta-bar b {
    max-width: 100%;
    color: #3b3440;
    font-size: .78rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
#saju-result-page .res-meta-bar .res-engine-note {
    grid-column: 1 / -1;
    border: 0;
    border-top: 1px solid var(--result-line);
    padding: .4rem .8rem;
    color: #8b8292;
    background: var(--result-lilac-soft);
    font-size: .67rem;
}

#saju-result-page .res-block,
#saju-result-page .deep-reading,
#saju-result-page .result-action-card {
    margin: 0 0 .9rem;
    padding: 1.05rem;
    background: rgba(255,255,255,.94);
    border: 1px solid var(--result-line);
    border-radius: 12px;
    box-shadow: 0 7px 22px rgba(66, 36, 92, .045);
}

#saju-result-page .res-pillar-card {
    padding: clamp(.85rem, 2vw, 1.25rem);
}

#saju-result-page .res-block-title {
    margin: 0 0 .8rem;
    padding: 0 0 .48rem;
    border-bottom: 1px solid var(--result-line);
    color: var(--result-purple);
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: none;
}

#saju-result-page .res-block-title-row {
    margin: 0 0 .9rem;
    padding: 0 0 .55rem;
    border-bottom: 1px solid var(--result-line);
    align-items: flex-start;
}

#saju-result-page .res-block-title-row .res-block-title { margin: 0; padding: 0; }

#saju-result-page .result-action-card {
    padding: .8rem;
    background: #fff;
}

#saju-result-page .result-current-state {
    display: block;
    margin: 0 0 .55rem;
    color: #8b8292;
    font-size: .7rem;
    font-weight: 700;
}

#saju-result-page .result-action-pills {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .4rem;
}

#saju-result-page .result-action-pills a {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .32rem .35rem;
    background: var(--result-lilac-soft);
    border: 1px solid #ded2ea;
    border-radius: 999px;
    color: var(--result-purple);
    font-size: .7rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}

#saju-result-page .result-action-pills a:hover,
#saju-result-page .result-action-pills a:focus-visible {
    background: var(--result-purple);
    color: #fff;
    outline: none;
}

#saju-result-page .res-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: .9rem;
    align-items: start;
}

#saju-result-page .element-summary-pane h3,
#saju-result-page .shinsal-summary-pane h3 {
    margin: 0 0 .65rem;
    color: #3a303f;
    font-size: .88rem;
}

#saju-result-page .element-line {
    grid-template-columns: 34px 1fr 22px;
    gap: .42rem;
}
#saju-result-page .element-name,
#saju-result-page .element-count { font-size: .75rem; }
#saju-result-page .bar-track { height: .55rem; background: #eeeaf1; }
#saju-result-page .el-summary-text {
    margin-top: .6rem;
    padding: .55rem .65rem;
    background: var(--result-lilac-soft);
    border-radius: 7px;
    font-size: .72rem;
}

#saju-result-page .summary-facts-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .45rem;
    margin: 0;
}

#saju-result-page .res-card {
    min-width: 0;
    padding: .62rem .68rem;
    border-color: var(--result-line);
    border-radius: 8px;
    box-shadow: none;
    background: var(--result-lilac-soft);
}
#saju-result-page .res-card-title {
    margin: 0 0 .3rem;
    padding: 0;
    border: 0;
    color: #8b729f;
    font-size: .64rem;
    letter-spacing: .02em;
}
#saju-result-page .res-card-body {
    color: #403746;
    font-size: .73rem;
    line-height: 1.55;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

#saju-result-page .shinsal-summary-pane {
    margin-top: .9rem;
    padding-top: .85rem;
    border-top: 1px solid var(--result-line);
}
#saju-result-page .ss-group-title { font-size: .63rem; }
#saju-result-page .ss-tag { font-size: .69rem; border-radius: 999px; }

#saju-result-page .table-current-note {
    max-width: 64%;
    color: #786b80;
    font-size: .66rem;
    line-height: 1.45;
    text-align: right;
}

#saju-result-page .luck-table-scroll {
    margin: 0 -.15rem;
    padding: .65rem .15rem .55rem;
    scrollbar-color: #baa5cf #f2edf6;
}
#saju-result-page .luck-table {
    grid-template-columns: repeat(10, minmax(96px, 1fr));
    gap: .4rem;
    min-width: 1000px;
}
#saju-result-page .dk-card {
    border-color: var(--result-line);
    border-radius: 8px;
    padding: .62rem .35rem;
}
#saju-result-page .dk-current {
    border-color: var(--result-purple) !important;
    background: #f7f0fc;
    box-shadow: 0 0 0 2px rgba(91,43,136,.08);
}
#saju-result-page .dk-current::before { background: var(--result-purple); content: '현재'; }

#saju-result-page .annual-badge {
    max-width: 66%;
    flex-wrap: wrap;
    gap: .25rem .4rem;
    background: var(--result-purple);
    border-radius: 8px;
    padding: .35rem .6rem;
}
#saju-result-page .monthly-table-v2 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
}
#saju-result-page .month-card {
    min-width: 0;
    padding: .68rem .32rem;
    border-color: var(--result-line);
    border-radius: 8px;
    background: var(--result-lilac-soft);
}
#saju-result-page .month-card.current-month {
    border-color: var(--result-purple);
    background: #f3eafb;
}
#saju-result-page .month-card.current-month::before { background: var(--result-purple); content: '이번 달'; }

#saju-result-page .deep-reading h3 {
    margin: 0 0 .55rem;
    color: #3a303f;
    font-size: .96rem;
}
#saju-result-page .deep-reading > p {
    margin: 0 0 .8rem;
    padding: .75rem .8rem;
    background: var(--result-lilac-soft);
    border-left-color: var(--result-purple);
    border-radius: 0 8px 8px 0;
    color: #6f6674;
    font-size: .76rem;
    line-height: 1.75;
}
#saju-result-page .advice-list {
    grid-template-columns: 1fr;
    gap: .45rem;
    margin-bottom: .9rem;
}
#saju-result-page .advice-card {
    padding: .68rem;
    border-color: var(--result-line);
    border-radius: 8px;
    background: #fff;
}
#saju-result-page .advice-card > span {
    width: 22px;
    height: 22px;
    background: var(--result-purple);
}
#saju-result-page .advice-card > p { font-size: .75rem; line-height: 1.65; }

#saju-result-page .result-bottom-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    padding-top: .25rem;
}
#saju-result-page .result-bottom-cta a {
    width: 100%;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .7rem 1rem;
    border-radius: 8px;
    background: var(--result-purple);
    color: #fff;
    font-size: .86rem;
    font-weight: 800;
}
#saju-result-page .result-bottom-cta span { color: #8b8292; font-size: .69rem; }
#saju-result-page .result-article-link {
    display: block;
    margin-top: .7rem;
    color: var(--result-purple);
    font-size: .75rem;
    font-weight: 700;
    text-align: center;
}

#saju-result-page #result-overview,
#saju-result-page #result-daeun,
#saju-result-page #result-seun,
#saju-result-page #result-advice { scroll-margin-top: 6.5rem; }

@media (max-width: 720px) {
    #saju-result-page { padding-inline: 1rem; }
    #saju-result-page .res-meta-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #saju-result-page .res-meta-bar span { border-bottom: 1px solid var(--result-line); }
    #saju-result-page .res-meta-bar span:nth-child(2n) { border-right: 0; }
    #saju-result-page .res-meta-bar span:nth-child(5) { grid-column: 1 / -1; border-bottom: 0; }
    #saju-result-page .res-header { align-items: flex-start; }
    #saju-result-page .res-overview-grid { grid-template-columns: 1fr; }
    #saju-result-page .summary-facts-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
    #saju-result-page { padding-inline: .75rem; }
    #saju-result-page .result-action-pills { grid-template-columns: 1fr 1fr; }
    #saju-result-page .summary-facts-grid { grid-template-columns: 1fr; }
    #saju-result-page .monthly-table-v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #saju-result-page .res-block,
    #saju-result-page .deep-reading { padding: .9rem; border-radius: 10px; }
    #saju-result-page .res-pillar-card { overflow-x: auto; }
    #saju-result-page .res-pillar-card .manse-table { min-width: 430px; }
    #saju-result-page .res-header-right { width: 100%; }
    #saju-result-page .res-header-right .btn-outline { flex: 1; text-align: center; }
}

@media print {
    #saju-result-page { background: #fff; padding: 0; }
    #saju-result-page .result-action-card,
    #saju-result-page .res-header-right,
    #saju-result-page .result-bottom-cta,
    #saju-result-page .result-article-link { display: none !important; }
    #saju-result-page .result-centered-column,
    #saju-result-page .result-summary-shell { width: 100%; }
    #saju-result-page .res-block,
    #saju-result-page .deep-reading { break-inside: avoid; box-shadow: none; }
}