.relationship-page{margin:0;background:#faf9f5;color:#294b40;font:15px/1.8 system-ui,-apple-system,sans-serif}
.relationship-page *{box-sizing:border-box}
.relationship-page [hidden]{display:none!important}
.relationship-shell{max-width:1220px;padding:0 24px;margin:auto}
.relationship-breadcrumb{display:flex;gap:10px;font-size:12px;color:#75816f;padding:22px 0 18px}
.relationship-breadcrumb a{color:inherit;text-underline-offset:4px}
.relationship-hero{display:flex;gap:30px;align-items:center;justify-content:space-between;background:linear-gradient(120deg,#eef2e5,#f7f5eb);border:1px solid #dce4d1;border-radius:12px;padding:32px 38px;margin-bottom:28px;position:relative;overflow:hidden}
.relationship-kicker{font-size:12px;letter-spacing:.1em;color:#967b44;margin:0 0 10px;font-weight:600}
.relationship-hero h1{font:600 clamp(25px,3vw,35px)/1.6 'Noto Serif TC','Songti TC',serif;margin:0 0 10px;color:#244d40}
.relationship-hero p:last-child{max-width:720px;color:#6c7c68;font-size:14px;line-height:1.9;margin:0}
.relationship-hero-flower{color:#b3be9e;opacity:.55;padding-right:14px;flex:0 0 90px}
.relationship-hero-flower .public-icon,.relationship-hero-flower svg{width:74px;height:100px;display:block}
.relationship-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:26px;align-items:start}
.relationship-picker,.relationship-preview{background:#fffefa;border:1px solid #dce3d4;border-radius:10px;padding:26px;min-width:0}
.relationship-preview{position:sticky;top:133px;scroll-margin-top:128px;border-top:3px solid #b39a60}
.relationship-section-heading{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.relationship-section-heading>span{font:25px/1.4 Georgia,serif;color:#a38950;border-right:1px solid #dddac8;padding-right:13px}
.relationship-section-heading h2{font-size:19px;font-weight:600;line-height:1.65;margin:0;color:#244d40}
.relationship-section-heading p{font-size:12px;color:#72816a;line-height:1.8;margin:4px 0 0}
.relationship-picker label,.relationship-name-label{display:block;font-size:13px;font-weight:600;margin:0 0 6px}
.relationship-search-row{display:flex;gap:9px}
.relationship-page input:not([type=radio]),.relationship-page textarea{width:100%;min-width:0;border:1px solid #cbd8c4;border-radius:6px;background:white;padding:11px 12px;font:inherit;font-size:14px;line-height:1.7;color:#294b40}
.relationship-search-row input{flex:1}
.relationship-search-row button,.relationship-copy-button{min-height:46px;background:#244d40;color:#fffefa;border:1px solid #244d40;border-radius:6px;padding:10px 18px;font:600 14px/1.6 system-ui,sans-serif;cursor:pointer}
.relationship-help{font-size:12px;line-height:1.85;color:#7a856f;margin:7px 0 15px}
.relationship-groups{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}
.relationship-groups a{border:1px solid #dce4d1;border-radius:18px;padding:6px 11px;min-height:36px;color:#607456;text-decoration:none;font-size:12px;white-space:nowrap;background:#f7f8f0}
.relationship-groups a[aria-current]{background:#244d40;color:#fff;border-color:#244d40}
.relationship-result-count{font-size:12px;color:#7b866e;padding-top:12px;border-top:1px solid #e4e8dc;margin:0 0 12px}
.relationship-results{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.relationship-choice{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:9px;border:1px solid #dce3d4;border-radius:7px;padding:13px 12px;min-height:80px;text-align:left;background:white;color:#355641;cursor:pointer;font:inherit}
.relationship-choice>span{font-size:13px;font-weight:600;line-height:1.6;overflow-wrap:anywhere}
.relationship-choice>small{font-size:12px;font-weight:400;color:#8e7c4d}
.relationship-choice[aria-pressed=true]{background:#edf3e7;border-color:#65856b;box-shadow:inset 3px 0 #547b5b}
.relationship-choice:hover{border-color:#a7b89a}
.relationship-empty{font-size:13px;color:#758369;background:#f4f5eb;padding:18px;border-radius:6px;line-height:1.9}
.relationship-more{display:block;text-align:center;font-size:12px;color:#627956;text-underline-offset:4px;padding:12px;margin-top:12px;border-top:1px solid #e3e8da}
.relationship-unsure{display:block;background:none;color:#597b59;border:0;border-top:1px solid #e3e8da;width:100%;text-align:left;margin-top:18px;padding:16px 0 0;cursor:pointer;font:500 12px/1.8 system-ui,sans-serif}
.relationship-preview-empty{text-align:center;background:#f4f5eb;border:1px dashed #d8dfca;border-radius:8px;padding:32px 24px;color:#6e7e65}
.relationship-preview-empty .public-icon,.relationship-preview-empty svg{display:block;width:44px;height:60px;margin:auto;color:#a28c57}
.relationship-preview-empty strong{display:block;font-size:17px;color:#365841;margin-top:16px;font-weight:600}
.relationship-preview-empty p{font-size:13px;line-height:1.9;margin-bottom:0}
.relationship-preview fieldset{margin:0 0 17px;padding:0;border:0}
.relationship-preview legend{font-size:13px;font-weight:600;margin:0 0 9px}
.relationship-sender-options{display:flex;gap:7px;flex-wrap:wrap}
.relationship-sender-options label{display:flex;align-items:center;gap:6px;border:1px solid #dce3d3;border-radius:6px;padding:8px 10px;font-size:12px;cursor:pointer}
.relationship-sender-options label:has(input:checked){border-color:#7a956f;background:#eff4e9}
.relationship-sender-options input{accent-color:#244d40;width:16px;height:16px;margin:0}
.relationship-review-message{font-size:12px;line-height:1.9;background:#fbf5e6;color:#8e753d;border-left:3px solid #b59d65;padding:12px 14px;border-radius:4px}
.relationship-card{position:relative;border:1px solid #d9ceaf;background:linear-gradient(135deg,#fffdf5,#f8f6eb);padding:22px 26px;border-radius:7px;box-shadow:inset 0 0 0 6px #fffef7,0 3px 12px #725c2907;margin-bottom:20px}
.relationship-card-brand{font:10px/1.6 Georgia,serif;letter-spacing:.18em;color:#9c8754}
.relationship-card-tag{display:block;color:#9a9076;font-size:12px;margin-top:4px}
.relationship-card-line{padding-top:15px}
.relationship-card-line small{display:block;font-size:12px;font-weight:400;color:#8c886e;margin-bottom:6px}
.relationship-card-line strong{display:block;font-family:'Noto Serif TC','Songti TC',serif;font-size:20px;font-weight:500;line-height:1.75;color:#2e503d;overflow-wrap:anywhere;white-space:pre-wrap}
.relationship-card-middle strong{font-size:29px;letter-spacing:.12em}
.relationship-card-middle{border-top:1px solid #e7dfc9;border-bottom:1px solid #e7dfc9;margin-top:15px;padding-bottom:16px}
.relationship-page #relationship-output{font-size:13px;line-height:1.9;min-height:122px;resize:vertical;background:#f9faf5}
.relationship-name-label{font-size:12px;margin-top:14px}
.relationship-copy-button{display:block;width:100%;margin-top:12px}
.relationship-copy-status{font-size:12px;color:#5b7c50;margin:7px 0;min-height:20px}
.relationship-whatsapp{display:block;text-align:center;padding:8px;color:#557950;font-size:13px;text-underline-offset:4px}
.relationship-final-note{border-top:1px solid #e3e7da;margin:12px 0 0;padding-top:12px}
.relationship-guide{border-top:1px solid #dce3d2;padding:30px 0 0;margin-top:36px}
.relationship-guide h2{font:600 23px/1.6 'Noto Serif TC',serif;margin:0 0 20px}
.relationship-guide>div{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.relationship-guide article>span{font:20px Georgia,serif;color:#a28a51}
.relationship-guide h3{font-size:15px;margin:10px 0 6px;font-weight:600}
.relationship-guide article p{color:#74816a;font-size:13px;line-height:1.9;margin:0}
.relationship-next-links{display:flex;gap:14px;flex-wrap:wrap;border-top:1px solid #dce3d2;border-bottom:1px solid #dce3d2;padding:20px 0;margin:28px 0}
.relationship-next-links a{color:#4b7050;text-underline-offset:4px;font-size:13px}
.relationship-page :is(a,button,input,textarea):focus-visible{outline:2px solid #ac8d50;outline-offset:3px}
.relationship-page .public-site-footer{margin-top:30px}
@media(max-width:900px){.relationship-layout{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:16px}
.relationship-picker,.relationship-preview{padding:21px}
.relationship-hero{padding:27px}
.relationship-hero h1{font-size:29px}
}
@media(max-width:800px){.relationship-shell{padding:0 18px}
.relationship-layout{grid-template-columns:1fr}
.relationship-preview{position:static}
.relationship-hero{padding:25px 22px;gap:0;margin-bottom:20px}
.relationship-hero-flower{display:none}
.relationship-hero h1{font-size:27px}
.relationship-hero p:last-child{font-size:13px}
.relationship-breadcrumb{padding:17px 0}
.relationship-groups{flex-wrap:nowrap;overflow-x:auto;padding:2px 1px 8px;scrollbar-width:thin;scrollbar-color:#c8d1bb #f4f6ed}
.relationship-groups a{flex-shrink:0;min-height:40px;padding:8px 12px}
.relationship-guide>div{grid-template-columns:1fr;gap:20px}
.relationship-guide article{border-bottom:1px solid #e3e7dc;padding-bottom:15px}
.relationship-guide article:last-child{border:0}
.relationship-preview{scroll-margin-top:126px}
.relationship-page input:not([type=radio]),.relationship-page textarea{font-size:16px}
.relationship-section-heading{margin-bottom:16px}
.relationship-section-heading h2{font-size:19px}
}
@media(max-width:360px){.relationship-shell{padding:0 12px}
.relationship-picker,.relationship-preview{padding:18px}
.relationship-choice{padding:11px 10px}
.relationship-choice>span{font-size:12px}
.relationship-search-row{gap:6px}
.relationship-search-row button{padding:10px 13px}
.relationship-card{padding:21px}
}
@media print{.public-site-header,.public-floating-support,.relationship-picker,.relationship-next-links,.public-site-footer,.relationship-copy-button,.relationship-whatsapp{display:none!important}
.relationship-layout{display:block}
.relationship-preview{position:static;border:0}
.relationship-hero{border:0;background:white}
.relationship-shell{max-width:none;padding:0}
}
@media(prefers-reduced-motion:reduce){.relationship-page *{scroll-behavior:auto!important}
}

/* Scope interactive controls above legacy global button rules. */
body#top.relationship-page .relationship-choice { background:#fffefb!important; color:#355641!important; border-color:#dce3d4!important; }

body#top.relationship-page .relationship-choice[aria-pressed="true"] { background:#edf3e8!important; color:#234b3d!important; border-color:#65856b!important; }

body#top.relationship-page .relationship-choice:hover { background:#f5f7ef!important; border-color:#a7b89a!important; }

body#top.relationship-page .relationship-choice small { color:#74633a!important; }

body#top.relationship-page .relationship-search-row { display:flex; align-items:stretch; }

body#top.relationship-page .relationship-search-row input { flex:1 1 0; width:0; min-width:0; }

body#top.relationship-page .relationship-search-row button { flex:0 0 auto; width:auto; margin:0; }

body#top.relationship-page .relationship-unsure { background:#f4f5ec!important; color:#355641!important; border:1px dashed #afbea4!important; }

body#top.relationship-page .relationship-preview { scroll-margin-top:145px; }


/* A quiet botanical accent keeps the wording step together with the card preview. */
body#top.relationship-page .relationship-phrases { margin:18px 0; padding:18px; border:1px solid #d8dfcd; border-left:3px solid #ab8c4d; border-radius:12px; background:linear-gradient(130deg,#f3f5ec,#fffdf8); }
body#top.relationship-page .relationship-phrase-heading { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
body#top.relationship-page .relationship-phrase-heading > span { flex:none; color:#9b7d40; }
body#top.relationship-page .relationship-phrase-heading svg { width:28px; height:28px; }
body#top.relationship-page .relationship-phrase-heading h3 { margin:0 0 4px; color:#254d40; font-size:16px; line-height:1.5; }
body#top.relationship-page .relationship-phrase-heading p { margin:0; font-size:13px; line-height:1.6; color:#57695d; }
body#top.relationship-page .relationship-phrases label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
body#top.relationship-page .relationship-phrases select { box-sizing:border-box; width:100%; min-height:46px; padding:9px 12px; border:1px solid #aebaab; border-radius:7px; background:#fff; color:#254d40; font-size:18px; font-family:inherit; }
body#top.relationship-page .relationship-phrase-explanation { margin:10px 0; font-size:14px; line-height:1.8; color:#4e6257; overflow-wrap:anywhere; }
body#top.relationship-page .relationship-phrases a { font-size:13px; text-underline-offset:4px; }
body#top.relationship-page .relationship-phrases a,
body#top.relationship-page .relationship-phrases a:visited { color:#285b4a; font-weight:600; }
body#top.relationship-page .relationship-phrases a:hover { color:#765b2d; }

/* Progressive relationship selection keeps extended family paths readable. */
.relationship-chain{background:#f1f4eb;border:1px solid #dbe4d2;border-left:3px solid #b7a06a;border-radius:7px;padding:17px;margin:0 0 22px}
.relationship-chain h3{font-size:15px;color:#254d40;margin:0 0 7px}
.relationship-chain>p{font-size:12px;line-height:1.8;color:#63705f;margin:0 0 12px}
.relationship-chain-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.relationship-chain-fields label{min-width:0}
.relationship-chain-fields label>span{display:block;font-size:12px;color:#405b47;margin-bottom:5px}
.relationship-chain-fields select{background:#fffefb;border:1px solid #c5d2bd;border-radius:5px;color:#254d40;min-height:44px;padding:8px 10px;width:100%;max-width:100%;font:inherit;font-size:14px}
.relationship-chain-fields select:focus-visible{outline:2px solid #8f743f;outline-offset:2px}
.relationship-chain .relationship-chain-path{margin:12px 0 0;font-weight:600;color:#254d40;overflow-wrap:anywhere}
.relationship-chain-path:empty{display:none}
.relationship-legacy-reference{background:#fffaf0;border:1px solid #e7dcc3;border-radius:6px;margin:0 0 16px;padding:0 13px}
.relationship-legacy-reference summary{cursor:pointer;min-height:44px;padding:11px 0;font-size:13px;color:#765b29}
.relationship-legacy-reference>p{font-size:12px;line-height:1.8}
.relationship-legacy-row{display:grid;gap:5px;padding:12px 0;border-top:1px solid #e7dcc3;font-size:13px;overflow-wrap:anywhere}
@media(max-width:480px){.relationship-chain{padding:14px}.relationship-chain-fields{grid-template-columns:minmax(0,1fr)}.relationship-chain-fields select{font-size:16px}}

/* Lead with a usable result, keeping reference variants secondary. */
.relationship-page .relationship-preview{border-top:4px solid #9f864d;box-shadow:0 8px 26px #264b3710}
.relationship-page .relationship-preview .relationship-section-heading{margin-bottom:14px}
.relationship-page .relationship-card{margin:0 0 12px;padding:16px 22px;border:1px solid #c8d4bb;border-left:4px solid #789268;background:#f5f7ed;box-shadow:none}
.relationship-page .relationship-card-tag{color:#58694f}
.relationship-page .relationship-card-line{padding-top:10px}
.relationship-page .relationship-card-line strong{font-size:24px;font-weight:600;color:#203f30;line-height:1.55}
.relationship-page .relationship-card-middle{margin-top:12px;padding-bottom:12px}
.relationship-page .relationship-card-middle strong{font-size:32px}
.relationship-page .relationship-review-message{background:#f4f5ed;border-color:#9da98b;color:#546448;margin:12px 0;font-size:12px;padding:9px 12px}
.relationship-page .relationship-chain-result{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding:10px 12px;background:#fffef8;border:1px solid #c8d5bd;border-radius:5px}
.relationship-page .relationship-chain-result strong{font-size:14px;color:#254d40;overflow-wrap:anywhere}
.relationship-page .relationship-chain-result a{display:inline-flex;align-items:center;min-height:44px;flex-shrink:0;font-size:12px;font-weight:600;color:#254d40;text-underline-offset:4px}
.relationship-page .relationship-preview .relationship-copy-button{margin-top:0;min-height:46px;background:#254d40;color:#fff}
.relationship-page .relationship-results{max-height:390px;overflow:auto;padding:2px 3px 2px 0;scrollbar-width:thin;scrollbar-color:#bbc9ac transparent}
@media(max-width:800px){.relationship-page .relationship-preview{scroll-margin-top:125px}.relationship-page .relationship-card-line strong{font-size:23px}.relationship-page .relationship-card-middle strong{font-size:29px}.relationship-page .relationship-results{max-height:250px}.relationship-page .relationship-chain-result{padding:8px 10px}.relationship-page .relationship-chain-result strong{font-size:13px}}
.relationship-page .relationship-result-mode{display:block;color:#34553d;font-size:14px;line-height:1.6;margin:6px 0 0}
.relationship-page .relationship-customize,.relationship-page .relationship-plain-text{border-top:1px solid #dce3d4;margin-top:12px}
.relationship-page .relationship-customize>summary,.relationship-page .relationship-plain-text>summary{cursor:pointer;min-height:46px;padding:11px 0;color:#355d42;font-size:13px;font-weight:600}
.relationship-page .relationship-customize[open]>summary{margin-bottom:8px}
.relationship-page .relationship-self-hint{color:#46633d;font-size:12px;line-height:1.85;margin:8px 0 12px}
/* Keep common searches first and the selected relationship unambiguous. */
.relationship-page .relationship-chain-disclosure{margin:12px 0 18px;border:1px solid #d9e0d3;border-radius:8px;background:#f6f8f2}.relationship-chain-disclosure>summary{min-height:46px;padding:10px 14px;cursor:pointer;font-weight:600;color:#294b40}.relationship-chain-disclosure .relationship-chain{margin:0;border:0;border-top:1px solid #d9e0d3;border-radius:0;background:transparent}.relationship-direction-summary{padding:9px 12px;border-left:3px solid #9f864d;background:#f4f1e7;color:#203f30;font-weight:600;overflow-wrap:anywhere}.relationship-page .relationship-back-picker{display:none}.relationship-page .relationship-help{color:#526456}.relationship-page .relationship-choice[aria-pressed=true]{border:2px solid #315e4c;background:#eaf3eb}.relationship-page .relationship-picker,.relationship-page .relationship-preview{scroll-margin-top:130px}
@media(max-width:800px){.relationship-page .relationship-back-picker{display:inline-flex;min-height:44px;align-items:center;margin:0 0 10px;padding:4px 10px;border:1px solid #c5d2c1;border-radius:6px;background:#fff;color:#294b40}.relationship-page .relationship-chain-disclosure>summary{font-size:14px}}
.relationship-page fieldset[data-sender-options]{min-width:0;border:0;padding:0;margin:14px 0}.relationship-page fieldset[data-sender-options] legend{padding:0;margin-bottom:6px;font-size:13px;font-weight:600}.relationship-page fieldset[data-sender-options] .relationship-help{margin:5px 0 10px}
@media print{.relationship-page fieldset[data-sender-options],.relationship-page .relationship-back-picker{display:none!important}}