/* ChoiceLife / 長「法」公主 v1.1 — completely scoped to .clif-app */
.clif-app{--clif-ink:#333537;--clif-primary:#02BCCD;--clif-primary-dark:#0299AA;--clif-red:#FC0A1B;--clif-brown:#A7734C;--clif-charcoal:#5E5F61;--clif-light:#EFFBFC;--clif-border:#DEE7E9;--clif-muted:#5E5F61;--clif-surface:#fff;box-sizing:border-box;width:100%;max-width:1100px;margin:0 auto 36px;color:var(--clif-ink);font-family:inherit;line-height:1.7;font-size:16px;word-break:break-word}
.clif-app *, .clif-app *:before, .clif-app *:after{box-sizing:border-box}
.clif-app [hidden]{display:none!important}
.clif-app .clif-sr{position:absolute!important;width:1px;height:1px;clip:rect(0,0,0,0);white-space:nowrap;overflow:hidden}
.clif-app :where(button,input,select){font:inherit}
.clif-app :where(button,a,input,select):focus-visible{outline:3px solid #0393a1!important;outline-offset:3px}
.clif-app button{cursor:pointer}
.clif-app .clif-hero{position:relative;overflow:hidden;padding:33px 36px 31px;background:linear-gradient(125deg,#e8f7f6 0%,#f8fcfc 76%);border:1px solid #d7ecec;border-radius:22px}
.clif-app .clif-hero:after{content:"";pointer-events:none;position:absolute;right:-72px;top:-105px;width:280px;height:280px;border:38px solid #d9eeee;border-radius:50%;opacity:.48}
.clif-app .clif-hero > *{position:relative;z-index:1}
.clif-app .clif-hero-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.clif-app .clif-eyebrow{font-size:12px;letter-spacing:.11em;font-weight:800;color:#387c83}
.clif-app .clif-version{border:1px solid #b8dada;background:#fff;padding:3px 11px;border-radius:30px;color:#3c7c83;font-size:12px;font-weight:800}
.clif-app .clif-hero h2{font-size:clamp(32px,5vw,46px);line-height:1.25;letter-spacing:.035em;color:#203f47;font-weight:850;margin:17px 0 7px;padding:0;border:0}
.clif-app .clif-title-dot{color:#2a9098}
.clif-app .clif-sub{font-size:16px;margin:0 0 24px;color:#526d75}
.clif-app .clif-searchbox{width:100%;display:flex;align-items:center;gap:12px;min-height:59px;padding:0 14px 0 20px;border:1.5px solid #b6d7db;background:#fff;border-radius:13px;box-shadow:0 5px 16px rgba(37,89,101,.07);color:#447a83}
.clif-app .clif-searchbox:focus-within{border-color:#31909a;box-shadow:0 0 0 3px #a6e0e144}
.clif-app .clif-query{flex:1;min-width:0;min-height:56px;padding:10px 0!important;margin:0!important;border:0!important;outline:none!important;background:none!important;box-shadow:none!important;font-size:16px!important;color:#1e424b!important;line-height:1.5!important}
.clif-app .clif-query:focus{outline:none!important;box-shadow:none!important}
.clif-app .clif-query::placeholder{color:#7b9197;opacity:1}
.clif-app .clif-query-clear{border:0;background:#eef7f7;color:#276c74;padding:6px 11px;border-radius:8px;font-size:14px;font-weight:700;white-space:nowrap}
.clif-app .clif-quick{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:15px;color:#577980;font-size:13px}
.clif-app .clif-quick span{font-weight:700;margin-right:1px}
.clif-app .clif-chip{min-height:34px;padding:5px 12px;border:1px solid #bcdde0;border-radius:20px;background:#fff;color:#346e78;font-size:13px;line-height:1.4;font-weight:650}
.clif-app .clif-chip:hover{background:#d9f2f2}
.clif-app .clif-controls{display:flex;align-items:end;gap:13px;flex-wrap:wrap;margin:24px 0 21px}
.clif-app .clif-field{flex:1 1 200px;min-width:0}
.clif-app .clif-field label{display:block;color:#3d5963;font-size:14px;font-weight:750}
.clif-app .clif-field select{display:block;width:100%;margin:7px 0 0!important;padding:10px 37px 10px 13px;min-height:47px;border:1px solid #cbdde0;border-radius:10px;background-color:#fff;color:#294954;font-size:15px;line-height:1.45;box-shadow:none;cursor:pointer}
.clif-app .clif-reset{min-height:47px;border:1px solid #cddfe1;border-radius:10px;background:#f6fafa;color:#356875;font-size:14px;padding:10px 17px;font-weight:750;white-space:nowrap}
.clif-app .clif-reset:hover{background:#e8f5f5;border-color:#93c9ce}
.clif-app .clif-results-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:23px 0 14px}
.clif-app .clif-results-head h3{font-size:22px;line-height:1.35;color:#25414a;padding:0;border:0;margin:0 0 3px;font-weight:850}
.clif-app .clif-count{color:#647e83;font-size:14px;margin:0}
.clif-app .clif-fontswitch{display:inline-flex;gap:3px;padding:4px;border:1px solid #d6e3e5;background:#f3f8f9;border-radius:11px;white-space:nowrap}
.clif-app .clif-font{min-height:37px;padding:4px 12px;background:transparent;border:0;border-radius:8px;color:#60777c;font-size:13px;font-weight:700}
.clif-app .clif-font.is-current{background:#fff;color:#246a76;box-shadow:0 2px 7px #234a581b}
.clif-app .clif-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;align-items:stretch}
.clif-app .clif-card{min-width:0;border:1px solid var(--clif-border);border-radius:15px;background:#fff;padding:21px 22px 19px;box-shadow:0 3px 12px rgba(22,69,79,.035);display:flex;flex-direction:column;gap:0;scroll-margin-top:100px}
.clif-app .clif-card:hover{border-color:#a6cdd0;box-shadow:0 6px 18px rgba(37,99,108,.075)}
.clif-app .clif-badges{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.clif-app .clif-tag,.clif-app .clif-region-tag{font-size:12px;line-height:1.4;font-weight:800;display:inline-block;padding:5px 10px;border-radius:6px}
.clif-app .clif-tag{color:#246a73;background:#e9f5f6}
.clif-app .clif-region-tag{color:#737d71;background:#f2f5ef}
.clif-app .clif-card h4{font-size:19px;font-weight:850;line-height:1.48;color:#243d46;margin:0 0 10px;padding:0;letter-spacing:0;overflow-wrap:anywhere}
.clif-app .clif-summary{font-size:15px;line-height:1.8;color:#465d65;margin:0 0 13px;flex:1}
.clif-app .clif-meta{font-size:12.5px;color:#698087;display:flex;flex-wrap:wrap;gap:3px 9px;padding:11px 0 14px;border-top:1px solid #edf1f2}
.clif-app .clif-meta span{overflow-wrap:anywhere}
.clif-app .clif-meta span+span:before{content:"·";margin-right:9px;color:#a2b0b4}
.clif-app .clif-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.89fr);gap:9px;margin-top:auto}
.clif-app .clif-actions a,.clif-app .clif-actions button{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;min-height:47px;margin:0;padding:9px 7px;border-radius:9px;border:1px solid #b6d7d9;font-size:14px;font-weight:800;line-height:1.5;text-decoration:none;box-shadow:none;text-align:center}
.clif-app .clif-official{background:var(--clif-primary)!important;color:#fff!important;border-color:var(--clif-primary)!important}
.clif-app .clif-official:hover{background:var(--clif-primary-dark)!important;border-color:var(--clif-primary-dark)!important;color:#fff!important}
.clif-app .clif-copy{background:#f3fafa;color:#286b75}
.clif-app .clif-copy:hover{background:#e7f6f6}
.clif-app .clif-more{display:block;min-height:49px;width:100%;margin:20px auto;border:1px solid #badce0;background:#f0f9f9;color:#246a75;border-radius:11px;font-weight:800;font-size:15px}
.clif-app .clif-empty{text-align:center;padding:46px 20px;border:1px dashed #b3d8da;border-radius:14px;background:#f8fcfc}
.clif-app .clif-empty strong{display:block;color:#284c56;font-size:19px;margin-bottom:7px}
.clif-app .clif-empty p{margin:0 0 16px;color:#627b83;font-size:14px}
.clif-app .clif-footnote{margin-top:30px;background:#f7fafb;border:1px solid #e3ebec;border-radius:12px;padding:19px 22px;color:#60767c}
.clif-app .clif-footnote strong{display:block;font-size:14px;color:#43616a;margin-bottom:5px}
.clif-app .clif-footnote p{font-size:13px;line-height:1.8;margin:4px 0 8px}
.clif-app .clif-footnote p:last-child{margin-bottom:0}
.clif-app .clif-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:99999;max-width:min(90vw,400px);border-radius:10px;padding:12px 17px;color:#fff;background:#214e56;box-shadow:0 6px 20px #0003;text-align:center;font-size:14px;font-weight:750}
.clif-app[data-size="large"] .clif-card h4{font-size:22px}
.clif-app[data-size="large"] .clif-summary{font-size:18px}
.clif-app[data-size="large"] .clif-meta{font-size:15px}
.clif-app[data-size="large"] .clif-tag,.clif-app[data-size="large"] .clif-region-tag{font-size:14px}
.clif-app[data-size="large"] .clif-actions :where(a,button){font-size:16px}
@media(max-width:760px){.clif-app .clif-list{grid-template-columns:minmax(0,1fr)}.clif-app .clif-hero{padding:26px 23px;border-radius:17px}.clif-app .clif-card{padding:19px}.clif-app .clif-controls{gap:10px;margin-top:18px}}
@media(max-width:480px){.clif-app{font-size:15px}.clif-app .clif-hero{padding:21px 16px}.clif-app .clif-hero h2{font-size:33px}.clif-app .clif-sub{font-size:14px}.clif-app .clif-eyebrow{font-size:10px}.clif-app .clif-searchbox{padding-left:12px;gap:8px}.clif-app .clif-query{font-size:16px!important}.clif-app .clif-field{flex:1 1 calc(50% - 6px)}.clif-app .clif-field select{font-size:14px;max-width:100%}.clif-app .clif-controls>.clif-reset{width:100%;min-height:40px}.clif-app .clif-results-head h3{font-size:20px}.clif-app .clif-card h4{font-size:18px}.clif-app .clif-card{padding:17px 16px}.clif-app .clif-actions{gap:8px}.clif-app .clif-actions a,.clif-app .clif-actions button{font-size:13px;padding:8px 5px}.clif-app .clif-footnote{padding:16px}.clif-app .clif-hero:after{opacity:.21}}
@media(max-width:340px){.clif-app .clif-actions{grid-template-columns:1fr}.clif-app .clif-field{flex-basis:100%}.clif-app .clif-font{padding:4px 8px}}
@media(prefers-reduced-motion:reduce){.clif-app *{scroll-behavior:auto!important;transition:none!important}}

/* ChoiceLife brand accents override old teal palette; keep cyan CTA text dark for contrast */
.clif-app .clif-hero{background:linear-gradient(125deg,#EFFBFC 0%,#FFFFFF 85%);border-top:4px solid #FC0A1B;border-color:#E5EAEB;border-top-color:#FC0A1B}
.clif-app .clif-hero:after{border-color:#DCF8FA}
.clif-app .clif-eyebrow{color:#5E5F61}
.clif-app .clif-version{color:#5E5F61;border-color:#E2E2E2}
.clif-app .clif-hero h2{color:#333537}
.clif-app .clif-title-dot{color:#FC0A1B}
.clif-app .clif-sub{color:#5E5F61}
.clif-app .clif-searchbox:focus-within{border-color:#02BCCD;box-shadow:0 0 0 3px rgba(2,188,205,.15)}
.clif-app .clif-query{color:#30383A!important}
.clif-app .clif-chip{color:#305A61;border-color:#D2E9EB}
.clif-app .clif-chip:hover{background:#EAFBFC}
.clif-app .clif-reset{color:#5E5F61}
.clif-app .clif-results-head h3{color:#333537}
.clif-app .clif-card{border-top:3px solid #02BCCD}
.clif-app .clif-card h4{color:#333537}
.clif-app .clif-tag{color:#06636D;background:#DDF7F9}
.clif-app .clif-region-tag{color:#80522F;background:#F8F1EA}
.clif-app .clif-official{color:#12393E!important}
.clif-app .clif-official:hover{color:#102E32!important}
.clif-app .clif-copy{background:#FAF5F0;color:#80522F;border-color:#E5D0BE}
.clif-app .clif-copy:hover{background:#F3E9E0}
.clif-app .clif-more{background:#EFFBFC;color:#075A64;border-color:#02BCCD}
.clif-app .clif-footnote{border-left:4px solid #A7734C;color:#5E5F61}
.clif-app .clif-toast{background:#40484A}
.clif-app :where(button,a,input,select):focus-visible{outline-color:#02BCCD!important}

/* 1.2 情境式法規查詢：延續 ChoiceLife 紅／青／棕／深灰配色 */
.clif-app .clif-cases{margin:27px 0 30px}
.clif-app .clif-sectionheading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 15px}
.clif-app .clif-sectionheading h3{margin:2px 0 2px;font-size:23px;line-height:1.36;color:#303537;font-weight:850}
.clif-app .clif-kicker{display:block;font-size:12px;font-weight:850;letter-spacing:.035em;color:#80522F}
.clif-app .clif-case-count{font-size:14px;margin:0;color:#657579}
.clif-app .clif-case-emblem{width:45px;height:45px;flex:none;border-radius:12px;background:#F7F0EA;color:#A7734C;display:grid;place-items:center;font-size:26px;font-weight:800}
.clif-app .clif-case-list{display:grid;grid-template-columns:minmax(0,1fr);gap:13px}
.clif-app .clif-case-card{scroll-margin-top:20px;background:#fff;border:1px solid #E1E7E7;border-left:4px solid #FC0A1B;border-radius:15px;padding:23px 24px 0;box-shadow:0 4px 13px rgba(20,50,56,.035);min-width:0}
.clif-app .clif-case-card:target{border-color:#02BCCD;box-shadow:0 0 0 3px rgba(2,188,205,.17)}
.clif-app .clif-case-tag{font-size:12px;font-weight:800;line-height:1.4;color:#BB1826;background:#FFF0F1;border-radius:6px;padding:5px 10px}
.clif-app .clif-case-card h4{color:#303537;font-size:21px;font-weight:850;line-height:1.5;margin:0 0 8px;padding:0}
.clif-app .clif-case-situation{color:#5E5F61;margin:0 0 14px;line-height:1.8;font-size:15px}
.clif-app .clif-case-answer{padding:13px 17px;margin:0 0 18px;background:#EFFBFC;border-left:3px solid #02BCCD;border-radius:0 9px 9px 0}
.clif-app .clif-case-answer strong{display:block;font-size:14px;color:#17636B;margin-bottom:3px}
.clif-app .clif-case-answer p{font-size:15px;margin:0;color:#334D54;line-height:1.77}
.clif-app .clif-case-details{border-top:1px solid #E8EEEE;margin:0 -24px}
.clif-app .clif-case-details summary{padding:14px 24px;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:15px;color:#06636D;font-size:15px;font-weight:800}
.clif-app .clif-case-details summary::-webkit-details-marker{display:none}
.clif-app .clif-case-details summary:hover{background:#F5FBFC}
.clif-app .clif-case-details summary span{font-size:22px;line-height:1;transition:transform .14s ease}
.clif-app .clif-case-details[open] summary span{transform:rotate(180deg)}
.clif-app .clif-case-body{padding:8px 24px 22px;border-top:1px solid #EDF1F1}
.clif-app .clif-case-body h5{font-size:16px;line-height:1.4;color:#384749;margin:15px 0 9px;font-weight:800;padding:0}
.clif-app .clif-case-body ol{padding-left:24px;margin:0 0 18px;font-size:14px;line-height:1.85;color:#43575B}
.clif-app .clif-case-body li{margin-bottom:6px}
.clif-app .clif-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.clif-app .clif-role-grid>div{padding:14px 16px;background:#F8F9F9;border:1px solid #E6EAEA;border-radius:10px;min-width:0}
.clif-app .clif-role-grid strong{display:block;color:#4D5D60;font-size:14px}
.clif-app .clif-role-grid p{margin:4px 0 0;line-height:1.75;color:#475E63;font-size:14px}
.clif-app .clif-law-links{display:grid;gap:9px}
.clif-app .clif-law-ref{border:1px solid #E5EAEA;border-radius:9px;padding:12px 14px;background:#fff;min-width:0}
.clif-app .clif-law-ref-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.clif-app .clif-law-ref-top a{font-size:14px;font-weight:800;color:#116772!important;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
.clif-app .clif-law-kind{flex:none;font-size:12px;border-radius:5px;font-weight:800;padding:3px 8px;background:#EFF3F4;color:#53666B}
.clif-app .clif-kind-直接{background:#DDF7F9;color:#075B66}
.clif-app .clif-kind-條件{background:#FFF1E5;color:#80522F}
.clif-app .clif-kind-參考{background:#EFF1F2;color:#5E5F61}
.clif-app .clif-law-ref p{margin:6px 0 0;line-height:1.72;font-size:13px;color:#54676C}
.clif-app .clif-law-ref p b{font-weight:750;color:#3A5055}
.clif-app .clif-caution{padding:13px 15px;background:#FFF8F0;border:1px solid #F0DDC9;border-radius:10px;margin:18px 0 0}
.clif-app .clif-caution strong{font-size:14px;color:#80522F}
.clif-app .clif-caution p{margin:4px 0 0;color:#66574C;line-height:1.8;font-size:14px}
.clif-app .clif-case-bottom{margin-top:16px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.clif-app .clif-case-bottom span{font-size:12px;color:#718084}
.clif-app .clif-case-bottom .clif-copy{font-size:13px;border:1px solid #E5D0BE;background:#FAF5F0;color:#80522F;border-radius:8px;padding:8px 14px;font-weight:750;min-height:38px}
.clif-app .clif-case-more{display:block;width:100%;padding:11px;border:1px solid #02BCCD;border-radius:10px;background:#EFFBFC;color:#08616B;font-size:14px;font-weight:800;margin:14px 0}
.clif-app[data-size="large"] .clif-case-card h4{font-size:24px}
.clif-app[data-size="large"] .clif-case-situation,.clif-app[data-size="large"] .clif-case-answer p{font-size:18px}
.clif-app[data-size="large"] .clif-case-body ol,.clif-app[data-size="large"] .clif-role-grid p,.clif-app[data-size="large"] .clif-law-ref p{font-size:16px}
@media(max-width:640px){
.clif-app .clif-case-card{padding:17px 16px 0}
.clif-app .clif-case-card h4{font-size:19px}
.clif-app .clif-case-details{margin:0 -16px}
.clif-app .clif-case-details summary{padding:13px 16px}
.clif-app .clif-case-body{padding:8px 16px 18px}
.clif-app .clif-role-grid{grid-template-columns:minmax(0,1fr)}
.clif-app .clif-case-bottom .clif-copy{width:100%}
.clif-app .clif-sectionheading h3{font-size:21px}
}

.clif-app .clif-help{margin-top:16px;padding:14px 16px;border:1px solid #C6E9EC;border-radius:9px;background:#F4FCFC}
.clif-app .clif-help strong{display:block;font-size:14px;color:#155B65}
.clif-app .clif-help p{margin:4px 0 8px;color:#49666D;font-size:14px;line-height:1.78}
.clif-app .clif-help a{font-size:14px;font-weight:800;color:#075D68!important;text-decoration:underline;overflow-wrap:anywhere}
