/* Y HỌC LÂM SÀNG v1.09.79 — homepage parity with sachyhoc.com hero visual language. Only Hero, editorial ticker, 8 navigational cards, Books and Articles appear on homepage. All theme/tool/article APIs remain intact. */ #syh-app.yhls-home-v10982{--h-ink:#123157;--h-sub:#496e96;--h-line:#d8e8f5;--h-canvas:#f3f9fd;overflow-x:clip;background:var(--h-canvas);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans",sans-serif} #syh-app.yhls-home-v10982 *{box-sizing:border-box} #syh-app.yhls-home-v10982 :is(.yhls-home-masthead,.yhls-home-hub,.yhls-home-ticker) a{text-decoration:none} #syh-app.yhls-home-v10982 .yhls-home-masthead{position:relative;isolation:isolate;padding:20px 0 26px;background:linear-gradient(112deg,#fff 0%,#f9fdff 39%,#e7f5ff 77%,#e0f1ff 100%);overflow:hidden} #syh-app.yhls-home-v10982 .yhls-home-masthead::before{position:absolute;content:"";inset:0;background:radial-gradient(ellipse at 65% 82%,rgba(122,217,216,.15),transparent 40%),radial-gradient(ellipse at 10% 95%,rgba(140,209,230,.14),transparent 40%);pointer-events:none} #syh-app.yhls-home-v10982 .yhls-home-masthead::after{position:absolute;content:"";z-index:-1;right:-7%;bottom:-53px;width:108%;height:100px;border-radius:50% 50% 0 0;background:rgba(203,231,247,.2);pointer-events:none} #syh-app.yhls-home-v10982 .yhls-home-hero-layout{position:relative;display:grid;grid-template-columns:minmax(0,.91fr) minmax(0,1.09fr);align-items:center;gap:0;max-width:1640px;min-width:0} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{position:relative;z-index:2;min-width:0;padding:24px 0 32px 5px} #syh-app.yhls-home-v10982 .yhls-home-eyebrow{display:flex;align-items:center;gap:14px;margin:0 0 25px;color:#12538d;font-size:14px;font-weight:820;line-height:1.3;letter-spacing:.12em} #syh-app.yhls-home-v10982 .yhls-home-eyebrow span{display:inline-block;width:49px;height:2px;background:#67b6fc} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{max-width:720px;margin:0;color:#102d55;font-size:clamp(43px,4.25vw,74px);font-weight:840;letter-spacing:-.048em;line-height:1.045;text-wrap:balance} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1 em{display:block;margin-top:2px;color:#0663eb;font-style:normal} #syh-app.yhls-home-v10982 .yhls-home-subtitle{margin:8px 0 0;color:#0395a8;font-size:clamp(20px,2vw,28px);line-height:1.2;font-weight:780;letter-spacing:-.02em} #syh-app.yhls-home-v10982 .yhls-home-desc{max-width:540px;margin:15px 0 0;color:#4a6c95;font-size:clamp(15px,1.2vw,18px);line-height:1.65;font-weight:520} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px;max-width:660px} #syh-app.yhls-home-v10982 .yhls-hero-pill{--pill-ink:#1265be;--pill-tint:#eaf5ff;--pill-border:#cbe7fa;display:inline-flex;align-items:center;gap:10px;min-height:51px;padding:9px 14px;border-radius:13px;border:1px solid var(--pill-border);background:var(--pill-tint);color:var(--pill-ink);font-size:13px;font-weight:770;line-height:1.25;white-space:nowrap;box-shadow:0 2px 7px rgba(22,88,133,.025);transition:transform .18s ease,box-shadow .18s ease} #syh-app.yhls-home-v10982 .yhls-hero-pill:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(22,88,133,.095)} #syh-app.yhls-home-v10982 .yhls-hero-pill:focus-visible,#syh-app.yhls-home-v10982 .yhls-home-feature:focus-visible,#syh-app.yhls-home-v10982 .yhls-home-ticker button:focus-visible{outline:3px solid #2c89e3;outline-offset:3px} #syh-app.yhls-home-v10982 .yhls-pill-icon{width:21px;height:23px;display:grid;place-items:center;flex:0 0 21px} #syh-app.yhls-home-v10982 .yhls-pill-icon svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round} #syh-app.yhls-home-v10982 .yhls-pill-mint{--pill-ink:#008b81;--pill-tint:#e8f9f7;--pill-border:#c5eae6} #syh-app.yhls-home-v10982 .yhls-pill-rose{--pill-ink:#a4479f;--pill-tint:#f8eefa;--pill-border:#e9d5f6} #syh-app.yhls-home-v10982 .yhls-pill-sky{--pill-ink:#0486b7;--pill-tint:#e9f7fd;--pill-border:#cdeaf6} #syh-app.yhls-home-v10982 .yhls-pill-amber{--pill-ink:#ad6b0d;--pill-tint:#fff4e2;--pill-border:#f4e4c8} #syh-app.yhls-home-v10982 .yhls-digital-library-art{position:relative;min-width:0;width:115%;max-width:none;margin:0 -9% 0 -5%;padding:0;aspect-ratio:997/634;align-self:center;display:flex;align-items:center;justify-content:center;mix-blend-mode:multiply} #syh-app.yhls-home-v10982 .yhls-digital-library-art::before{content:"";position:absolute;z-index:1;left:-2px;top:0;bottom:0;width:15%;background:linear-gradient(90deg,#f9fdff,rgba(249,253,255,0));pointer-events:none} #syh-app.yhls-home-v10982 .yhls-digital-library-art img{width:100%;height:100%;display:block;object-fit:contain} #syh-app.yhls-home-v10982 .yhls-home-ticker{position:relative;z-index:1;padding:20px 0 0;background:var(--h-canvas)} #syh-app.yhls-home-v10982 .yhls-home-ticker-row{display:flex;align-items:center;gap:13px;width:100%;min-width:0;min-height:55px;padding:8px 14px;border:1px solid #d7e8f5;border-radius:16px;background:#fff;box-shadow:0 2px 4px rgba(23,81,122,.018)} #syh-app.yhls-home-v10982 .yhls-home-ticker-kicker{display:flex;align-items:center;gap:10px;flex:0 0 auto;color:#0668d2;font-weight:820;font-size:13px;white-space:nowrap;letter-spacing:.025em} #syh-app.yhls-home-v10982 .yhls-ticker-status{display:inline-block;width:11px;height:11px;border-radius:50%;background:#0877e8} #syh-app.yhls-home-v10982 .yhls-home-ticker-tag{flex:0 0 auto;border-radius:7px;padding:6px 8px;background:#eaf4ff;color:#2374ab;font-weight:720;font-size:12px;white-space:nowrap} #syh-app.yhls-home-v10982 .yhls-home-ticker-window{flex:1;min-width:0;overflow:hidden} #syh-app.yhls-home-v10982 .yhls-home-ticker-item{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#1c3f67;font-size:14px;font-weight:740;line-height:1.4} #syh-app.yhls-home-v10982 .yhls-home-ticker-item:hover{color:#0766bd} #syh-app.yhls-home-v10982 .yhls-home-ticker-item[hidden]{display:none!important} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons{display:flex;align-items:center;gap:6px;flex:0 0 auto} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button{display:grid;place-items:center;min-width:33px;height:33px;padding:0 7px;border:1px solid #d9e9f4;border-radius:10px;background:#fff;color:#2376ad;cursor:pointer;font-size:20px;line-height:1} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button:last-child{font-size:14px} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button[hidden]{display:none!important} #syh-app.yhls-home-v10982 .yhls-ticker-count{color:#66819e;font-size:12px;min-width:29px;text-align:center} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:27px 0 39px;background:var(--h-canvas)} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px} #syh-app.yhls-home-v10982 .yhls-home-feature{--f-bg:#eaf6ff;position:relative;display:grid;grid-template-columns:minmax(105px,31%) minmax(0,1fr);align-items:center;gap:18px;min-width:0;min-height:190px;padding:20px 46px 20px 24px;border:1px solid #d6e7f5;border-radius:23px;background:linear-gradient(131deg,#fff 0%,#fff 38%,var(--f-bg) 100%);color:#123455;box-shadow:0 12px 30px rgba(24,84,124,.045);transition:transform .2s ease,box-shadow .2s ease} #syh-app.yhls-home-v10982 .yhls-home-feature:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(24,84,124,.11)} #syh-app.yhls-home-v10982 .yhls-home-feature-teal{--f-bg:#eafaf8} #syh-app.yhls-home-v10982 .yhls-home-feature-violet{--f-bg:#f7f3ff} #syh-app.yhls-home-v10982 .yhls-home-feature-media{display:grid;place-items:center;width:100%;min-width:0;max-width:170px;aspect-ratio:1;overflow:visible} #syh-app.yhls-home-v10982 .yhls-home-feature-media img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 7px rgba(31,73,91,.05))} #syh-app.yhls-home-v10982 .yhls-home-feature-text{display:flex;flex-direction:column;gap:8px;min-width:0;padding:0} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{color:#133655;font-size:clamp(18px,1.5vw,23px);line-height:1.25;font-weight:800;letter-spacing:-.027em} #syh-app.yhls-home-v10982 .yhls-home-feature-text small{color:#587698;font-size:clamp(13px,1vw,16px);line-height:1.52} #syh-app.yhls-home-v10982 .yhls-home-feature-arrow{position:absolute;bottom:16px;right:16px;display:grid;place-items:center;width:37px;height:37px;border:1px solid #d8e9f4;border-radius:50%;background:rgba(255,255,255,.88);color:#356c9a;font-size:20px;line-height:1} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:58px;padding-bottom:61px} #syh-app.yhls-home-v10982 .yhls-books-masthead{background:linear-gradient(116deg,#ffffff 0%,#eef9ff 60%,#e9f8f5 100%);border:1px solid #d9e9f4;color:#163d5e;box-shadow:0 10px 29px rgba(21,70,102,.055)} #syh-app.yhls-home-v10982 .yhls-books-heading .yhls-library-kicker{display:block;margin-bottom:9px;color:#156f9d;font-size:12px;font-weight:800;letter-spacing:.12em} #syh-app.yhls-home-v10982 .yhls-books-heading h2{margin:0 0 12px;color:#163d5e;font-size:clamp(27px,2.7vw,39px);font-weight:800;letter-spacing:-.035em;line-height:1.2} #syh-app.yhls-home-v10982 .yhls-books-heading p{max-width:770px;color:#587799} #syh-app.yhls-home-v10982 .yhls-books-summary>span{border-color:#d5e8f1;background:rgba(255,255,255,.85)} #syh-app.yhls-home-v10982 .yhls-books-summary strong{color:#14588c} #syh-app.yhls-home-v10982 .yhls-books-summary small{color:#517694} #syh-app.yhls-home-v10982 .yhls-books-all{border:1px solid #cee4f0;background:#fff;color:#0867ab;box-shadow:0 5px 18px rgba(17,81,127,.055)} #syh-app.yhls-home-v10982 .yhls-most-viewed-section{padding-top:46px;padding-bottom:56px} #syh-app.yhls-home-v10982 .yhls-most-viewed-head h3{font-size:clamp(24px,2.2vw,34px);text-transform:none} @media(max-width:1290px){ #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(42px,4.7vw,63px)} #syh-app.yhls-home-v10982 .yhls-hero-pill{font-size:12px;min-height:46px;padding:8px 11px} #syh-app.yhls-home-v10982 .yhls-home-feature{gap:9px;padding:16px 39px 16px 14px;min-height:166px} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:19px} } @media(max-width:960px){ #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,1fr);gap:0} #syh-app.yhls-home-v10982 .yhls-home-masthead{padding:28px 0 18px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{padding:0} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(43px,6vw,62px)} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{max-width:100%} #syh-app.yhls-home-v10982 .yhls-digital-library-art{width:100%;max-width:850px;margin:6px auto 0} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} #syh-app.yhls-home-v10982 .yhls-home-feature:last-child{grid-column:span 2} #syh-app.yhls-home-v10982 .yhls-home-feature{min-height:150px} } @media(max-width:620px){ #syh-app.yhls-home-v10982 .yhls-home-masthead{padding:23px 0 14px} #syh-app.yhls-home-v10982 .yhls-home-eyebrow{font-size:11px;margin-bottom:17px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(37px,9vw,48px);line-height:1.1} #syh-app.yhls-home-v10982 .yhls-home-subtitle{font-size:20px;margin-top:9px} #syh-app.yhls-home-v10982 .yhls-home-desc{font-size:14px;line-height:1.56;margin-top:13px} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{gap:8px;margin-top:18px} #syh-app.yhls-home-v10982 .yhls-hero-pill{min-height:42px;font-size:12px;white-space:normal;padding:7px 9px;gap:7px} #syh-app.yhls-home-v10982 .yhls-pill-icon{width:18px;height:18px;flex-basis:18px} #syh-app.yhls-home-v10982 .yhls-pill-icon svg{width:18px;height:18px} #syh-app.yhls-home-v10982 .yhls-digital-library-art{margin-top:14px;width:calc(100% + 25px);margin-left:-12px} #syh-app.yhls-home-v10982 .yhls-home-ticker{padding-top:11px} #syh-app.yhls-home-v10982 .yhls-home-ticker-row{gap:7px;flex-wrap:wrap;padding:10px;min-height:0} #syh-app.yhls-home-v10982 .yhls-home-ticker-kicker{font-size:11px} #syh-app.yhls-home-v10982 .yhls-home-ticker-tag{font-size:11px} #syh-app.yhls-home-v10982 .yhls-home-ticker-window{order:3;flex:0 0 100%} #syh-app.yhls-home-v10982 .yhls-home-ticker-item{font-size:13px} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons{margin-left:auto} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button{min-width:28px;height:28px;font-size:16px} #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button:last-child{display:none} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:16px 0 24px} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:minmax(0,1fr);gap:10px} #syh-app.yhls-home-v10982 .yhls-home-feature:last-child{grid-column:auto} #syh-app.yhls-home-v10982 .yhls-home-feature{grid-template-columns:92px minmax(0,1fr);min-height:130px;border-radius:18px;gap:14px;padding:13px 45px 13px 13px} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:18px} #syh-app.yhls-home-v10982 .yhls-home-feature-text small{font-size:13px} #syh-app.yhls-home-v10982 .yhls-home-feature-arrow{width:30px;height:30px;right:10px;bottom:10px} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:35px} } @media(prefers-reduced-motion:reduce){#syh-app.yhls-home-v10982 .yhls-home-feature,#syh-app.yhls-home-v10982 .yhls-hero-pill{transition:none}} /* Dark theme: preserve visual image but apply a dark overlay that avoids white-on-white contrast failures. */ html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982{--h-ink:#e8f3fd;--h-canvas:#0b1825;--h-line:#244258} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-masthead{background:linear-gradient(112deg,#10253b,#11354b 78%,#15445a)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{color:#f1f8fc} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-eyebrow{color:#acd8fb} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1 em{color:#69b0ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-subtitle{color:#79d5d3} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-desc{color:#c4d9ed} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-digital-library-art{mix-blend-mode:normal;filter:brightness(.7) saturate(.8)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-digital-library-art::before{background:linear-gradient(90deg,#10283b,transparent)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-ticker-row{border-color:#274459;background:#112a3c} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-ticker-item{color:#e5f0f9} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-ticker-tag{background:#1b4261;color:#b8e0ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-ticker-count{color:#b6cbdc} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-ticker-buttons button{border-color:#31556b;background:#183348;color:#cde6fa} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature{border-color:#2b4a5c;background:linear-gradient(135deg,#182e41,#172e3a)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{color:#f0f6fc} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature-text small{color:#c4d5e4} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature-arrow{background:#18384e;border-color:#2b5169;color:#c1e7ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-heading h2{color:#e4f4ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-hero-pill{filter:brightness(.87)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-masthead{border-color:#315264;background:linear-gradient(114deg,#19374b,#154259 70%,#184c52)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-heading h2{color:#eaf7ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-heading p{color:#c4e0eb} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-summary>span{border-color:#34576a;background:rgba(255,255,255,.07)} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-summary strong{color:#e1f3ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-summary small{color:#c8e5f3} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-all{border-color:#3c6074;background:#1c4259;color:#d7effb} /* v1.09.76: complete eight-card navigation, matching MEDIPHARM v1.3.21 geometry. */ #syh-app.yhls-home-v10982 .yhls-home-feature-rose{--f-bg:#fff0f5} #syh-app.yhls-home-v10982 .yhls-home-feature-quiz{--f-bg:#eaf3ff} #syh-app.yhls-home-v10982 .yhls-home-feature-sky{--f-bg:#ecf7ff} #syh-app.yhls-home-v10982 .yhls-home-feature-qa{--f-bg:#eef8ff} #syh-app.yhls-home-v10982 .yhls-home-feature-spotlines{--f-bg:#fff1e8} #syh-app.yhls-home-v10982 .yhls-home-feature-rose .yhls-home-feature-arrow{color:#b45078} #syh-app.yhls-home-v10982 .yhls-home-feature-quiz .yhls-home-feature-arrow{color:#266cbe} #syh-app.yhls-home-v10982 .yhls-home-feature-sky .yhls-home-feature-arrow{color:#177fbb} #syh-app.yhls-home-v10982 .yhls-home-feature-qa .yhls-home-feature-arrow{color:#7162c8} #syh-app.yhls-home-v10982 .yhls-home-feature-spotlines .yhls-home-feature-arrow{color:#b5683b} /* Eight entries = four even rows on tablets. Do not let the last card span columns. */ @media(min-width:621px) and (max-width:960px){ #syh-app.yhls-home-v10982 .yhls-home-feature-grid>.yhls-home-feature:last-child{grid-column:auto} } /* Keep all cards as individually focusable links with consistent contrast in dark mode. */ html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature:is(.yhls-home-feature-rose,.yhls-home-feature-quiz,.yhls-home-feature-sky,.yhls-home-feature-qa,.yhls-home-feature-spotlines){background:linear-gradient(135deg,#182e41,#172e3a)} /* ============================================================================ * v1.09.77 — SINGLE CANONICAL HOMEPAGE CANVAS + EDGE-EFFICIENT MOBILE * Applies exclusively to the Super App-owned homepage, never article pages. * Same left/right edges for hero, ticker, navigation, books, highlighted articles * and the canonical header/footer. Respect reserved NAH Search Dock right rail. * ============================================================================ */ #syh-app.yhls-home-v10982 { --yhls-home-gutter:clamp(8px,2.15vw,36px); --yhls-home-right-rail:var(--med-host-right-rail-safe,0px); --yhls-home-width:calc(100% - var(--yhls-home-gutter) - var(--yhls-home-gutter) - var(--yhls-home-right-rail)); width:100%;min-width:0;max-width:100%;overflow-x:clip; } /* Higher specificity and later stylesheet take ownership from legacy 100vw, max-width:620px mobile cap, desktop fixed 1180px header cap, and per-module overrides. */ #syh-app.yhls-home-v10982 :is(.yhls-canonical-header,.yhls-canonical-footer) .syh-shell, #syh-app.yhls-home-v10982 main > :is(section,.syh-section) > .syh-shell, #syh-app.yhls-home-v10982 main > .yhls-home-masthead > .syh-shell, #syh-app.yhls-home-v10982 main > .yhls-home-ticker > .syh-shell, #syh-app.yhls-home-v10982 main > .yhls-home-hub > .syh-shell, #syh-app.yhls-home-v10982 main > .yhls-books-section > .syh-shell, #syh-app.yhls-home-v10982 main > .yhls-most-viewed-section > .syh-shell { box-sizing:border-box!important; width:var(--yhls-home-width)!important; max-width:none!important; min-width:0!important; margin-left:var(--yhls-home-gutter)!important; margin-right:0!important; padding-left:0!important; padding-right:0!important; } #syh-app.yhls-home-v10982 main > section{width:100%;max-width:100%;min-width:0;box-sizing:border-box} #syh-app.yhls-home-v10982 :is(.yhls-home-hero-layout,.yhls-home-ticker-row,.yhls-home-feature-grid,.yhls-books-masthead,.yhls-books-toolbar,.yhls-book-rail,.yhls-most-viewed,.yhls-most-viewed-grid){min-width:0;max-width:100%;box-sizing:border-box} #syh-app.yhls-home-v10982 .yhls-books-section > .syh-shell{display:flex;flex-direction:column;gap:clamp(10px,1.2vw,19px)} #syh-app.yhls-home-v10982 .yhls-books-masthead{width:100%!important;max-width:100%!important;margin-inline:0!important} #syh-app.yhls-home-v10982 .yhls-most-viewed-section > .syh-shell{width:var(--yhls-home-width)!important} #syh-app.yhls-home-v10982 .yhls-most-viewed{width:100%!important;max-width:none!important;margin-inline:0!important;box-sizing:border-box!important} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{width:100%;margin-inline:0;align-items:stretch} #syh-app.yhls-home-v10982 .yhls-home-feature{min-width:0;width:100%;max-width:100%;box-sizing:border-box} #syh-app.yhls-home-v10982 .yhls-book-card, #syh-app.yhls-home-v10982 .yhls-most-viewed-card{min-width:0;max-width:100%;box-sizing:border-box} #syh-app.yhls-home-v10982 .yhls-book-rail{width:100%;scroll-padding-left:0;scroll-padding-right:0} #syh-app.yhls-home-v10982 .yhls-books-toolbar{width:100%;margin-inline:0} /* Remove obsolete homepage add-ons injected by MEDIPHARM Spotlines and Inspiration integrations. Do not affect dedicated Nobel/Spotlines pages. */ #syh-app.yhls-home-v10982 :is(.mmspot-site-nobel,.mmspot-site-events-shell,.mmspot-nobel-banner,.mmspot-site-nobel-banner,.yhls-inspiration-section,.yhls-spotlines-integration,.mmspot-site-inspiration), body:has(#syh-app.yhls-home-v10982) :is(.mmspot-site-nobel,.mmspot-site-events-shell,.mmspot-nobel-banner,.mmspot-site-nobel-banner,.yhls-inspiration-section,.yhls-spotlines-integration,.mmspot-site-inspiration){display:none!important;visibility:hidden!important} /* Desktop: reduce nested separators and outer outlines; preserve card focus. */ @media(min-width:1024px){ #syh-app.yhls-home-v10982 .yhls-home-hub{padding-top:clamp(14px,1.3vw,22px);padding-bottom:clamp(26px,2.5vw,44px)} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:clamp(32px,3vw,52px);padding-bottom:clamp(33px,3vw,52px)} #syh-app.yhls-home-v10982 .yhls-most-viewed-section{padding-top:clamp(25px,2.4vw,44px);padding-bottom:clamp(34px,2.7vw,48px)} #syh-app.yhls-home-v10982 .yhls-home-feature, #syh-app.yhls-home-v10982 .yhls-books-masthead, #syh-app.yhls-home-v10982 .yhls-most-viewed, #syh-app.yhls-home-v10982 .yhls-most-viewed-card, #syh-app.yhls-home-v10982 .yhls-book-card{ border-color:transparent!important; box-shadow:0 8px 26px rgba(33,85,117,.065); } #syh-app.yhls-home-v10982 .yhls-home-ticker-row{border-color:rgba(172,204,228,.4)} } /* Tablet/foldable: two equal card columns, full canvas, no spill. */ @media(min-width:621px) and (max-width:1023px){ #syh-app.yhls-home-v10982{--yhls-home-gutter:clamp(10px,1.8vw,20px)} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.3vw,16px)} #syh-app.yhls-home-v10982 .yhls-home-feature:last-child{grid-column:auto} } /* Phones: only 8-10px edge, touch controls >= 40px, naturally scrolling books. */ @media(max-width:620px){ #syh-app.yhls-home-v10982{--yhls-home-gutter:clamp(8px,2.3vw,10px);--yhls-home-right-rail:0px} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:12px 0 18px} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:minmax(0,1fr);gap:8px} #syh-app.yhls-home-v10982 .yhls-home-feature{padding:11px 43px 11px 10px;min-height:111px;border-radius:14px;gap:8px;grid-template-columns:clamp(72px,23vw,86px) minmax(0,1fr)} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:clamp(15px,4.1vw,18px);line-height:1.25} #syh-app.yhls-home-v10982 .yhls-home-feature-text small{font-size:clamp(12px,3.4vw,13px);line-height:1.43} #syh-app.yhls-home-v10982 .yhls-home-feature-arrow{width:30px;height:30px;min-height:30px} #syh-app.yhls-home-v10982 .yhls-home-ticker{padding-top:7px;padding-bottom:0} #syh-app.yhls-home-v10982 .yhls-home-ticker-row{padding:9px 10px;border-radius:13px} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:20px;padding-bottom:22px} #syh-app.yhls-home-v10982 .yhls-books-masthead{padding:15px 12px;gap:12px;border-radius:16px} #syh-app.yhls-home-v10982 .yhls-books-toolbar{gap:8px} #syh-app.yhls-home-v10982 .yhls-books-summary{gap:7px;max-width:100%} #syh-app.yhls-home-v10982 .yhls-books-summary>span{min-width:0;padding:8px} #syh-app.yhls-home-v10982 .yhls-most-viewed-section{padding:18px 0 23px} #syh-app.yhls-home-v10982 .yhls-most-viewed{margin:0!important;padding:12px 10px 14px!important;border:0!important;border-radius:15px!important} #syh-app.yhls-home-v10982 .yhls-most-viewed-head{margin-bottom:10px} #syh-app.yhls-home-v10982 .yhls-most-viewed-grid{gap:9px} #syh-app.yhls-home-v10982 .yhls-most-viewed-card{border-color:rgba(188,214,231,.45)} #syh-app.yhls-home-v10982 .yhls-digital-library-art{max-width:100%;margin-left:0;width:100%} } @media(max-width:360px){ #syh-app.yhls-home-v10982 .yhls-home-feature{grid-template-columns:68px minmax(0,1fr);padding-right:39px;min-height:108px} #syh-app.yhls-home-v10982 .yhls-home-feature-media img{max-width:100%;height:auto} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(34px,9.5vw,38px)} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{gap:6px} #syh-app.yhls-home-v10982 .yhls-hero-pill{font-size:11px;padding:7px 8px} } @media(min-width:2000px){ #syh-app.yhls-home-v10982 .yhls-home-feature-grid{column-gap:clamp(16px,1.35vw,28px)} #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr)} } /* Preserve visible keyboard focus while keeping card separators restrained. */ #syh-app.yhls-home-v10982 :is(.yhls-home-feature,.yhls-book-open,.yhls-most-viewed-card,.yhls-hero-pill):focus-visible{outline:3px solid #1677d4!important;outline-offset:3px} /* ========================================================================== * v1.09.78 — CANONICAL EQUAL-WIDTH HOMEPAGE MODULES + SHORTER HERO * All homepage modules share one centered canvas. Hero art is less tall. * ========================================================================== */ #syh-app.yhls-home-v10982{ --yhls-home-max:1520px; --yhls-home-gutter:clamp(10px,2vw,28px); --yhls-home-canvas-width:min(var(--yhls-home-max), calc(100vw - (var(--yhls-home-gutter) * 2))); } #syh-app.yhls-home-v10982 main > :is(section,.syh-section), #syh-app.yhls-home-v10982 main > div[class*="section"], #syh-app.yhls-home-v10982 main > div[class*="spot"], #syh-app.yhls-home-v10982 main > div[class*="inspiration"]{width:100%;max-width:100%;box-sizing:border-box} #syh-app.yhls-home-v10982 :is(.yhls-canonical-header,.yhls-canonical-footer) .syh-shell, #syh-app.yhls-home-v10982 main > :is(section,.syh-section,div[class*="section"],div[class*="spot"],div[class*="inspiration"]) > :is(.syh-shell,.yhls-inspiration-shell,.mmspot-site-shell,.mmspot-shell,.medipharm-shell,.container,.wrap), #syh-app.yhls-home-v10982 main > :is(.yhls-home-masthead,.yhls-home-ticker,.yhls-home-hub,.yhls-books-section,.yhls-most-viewed-section) > .syh-shell{ width:var(--yhls-home-canvas-width)!important; max-width:var(--yhls-home-canvas-width)!important; min-width:0!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important; box-sizing:border-box!important; } #syh-app.yhls-home-v10982 :is(.yhls-home-hero-layout,.yhls-home-ticker-row,.yhls-home-feature-grid,.yhls-books-masthead,.yhls-books-toolbar,.yhls-book-rail,.yhls-most-viewed,.yhls-most-viewed-grid,.yhls-inspiration-integration,.mmspot-site-events-shell,.mmspot-site-nobel,.mmspot-site-spotlines,.mmspot-site-stories){ width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;margin-left:0!important;margin-right:0!important; } #syh-app.yhls-home-v10982 .yhls-home-masthead{padding:12px 0 18px} #syh-app.yhls-home-v10982 .yhls-home-masthead::after{height:74px;bottom:-38px} #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,.97fr) minmax(0,1.03fr);align-items:center;column-gap:clamp(8px,1vw,18px);max-width:none} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{padding:12px 0 18px 4px} #syh-app.yhls-home-v10982 .yhls-home-eyebrow{margin-bottom:18px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(40px,3.9vw,68px);max-width:660px} #syh-app.yhls-home-v10982 .yhls-home-subtitle{font-size:clamp(18px,1.8vw,26px);margin-top:7px} #syh-app.yhls-home-v10982 .yhls-home-desc{margin-top:12px;max-width:510px;font-size:clamp(14px,1.05vw,17px)} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{margin-top:20px;max-width:620px} #syh-app.yhls-home-v10982 .yhls-digital-library-art{width:105%;margin:0 -3% 0 0;aspect-ratio:997/560;max-height:430px;align-self:end} #syh-app.yhls-home-v10982 .yhls-digital-library-art::before{width:12%} #syh-app.yhls-home-v10982 .yhls-digital-library-art img{object-fit:contain;object-position:center center} #syh-app.yhls-home-v10982 .yhls-home-ticker{padding-top:14px} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:20px 0 32px} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{gap:16px} #syh-app.yhls-home-v10982 .yhls-home-feature{min-height:178px;padding:18px 44px 18px 20px;border-radius:22px} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:34px;padding-bottom:42px} #syh-app.yhls-home-v10982 .yhls-most-viewed-section{padding-top:30px;padding-bottom:44px} #syh-app.yhls-home-v10982 :is(.yhls-home-feature,.yhls-books-masthead,.yhls-most-viewed,.yhls-book-card,.yhls-most-viewed-card){border-color:rgba(210,228,238,.35)} #syh-app.yhls-home-v10982 .yhls-home-feature, #syh-app.yhls-home-v10982 .yhls-books-masthead, #syh-app.yhls-home-v10982 .yhls-most-viewed{box-shadow:0 8px 24px rgba(25,84,116,.045)} /* Keep Nobel hidden if injected by external integration. */ #syh-app.yhls-home-v10982 :is(.mmspot-site-nobel,.mmspot-nobel-banner,.mmspot-site-nobel-banner), body:has(#syh-app.yhls-home-v10982) :is(.mmspot-site-nobel,.mmspot-nobel-banner,.mmspot-site-nobel-banner){display:none!important;visibility:hidden!important} @media(max-width:1280px){ #syh-app.yhls-home-v10982{--yhls-home-max:1440px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(38px,4.2vw,60px)} #syh-app.yhls-home-v10982 .yhls-digital-library-art{max-height:390px} } @media(max-width:960px){ #syh-app.yhls-home-v10982 .yhls-home-masthead{padding:18px 0 16px} #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,1fr);gap:6px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{padding:0} #syh-app.yhls-home-v10982 .yhls-digital-library-art{width:100%;max-width:820px;max-height:none;aspect-ratio:997/520;margin:0 auto} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:16px 0 26px} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} #syh-app.yhls-home-v10982 .yhls-home-feature{min-height:148px;padding:15px 40px 15px 14px} } @media(max-width:620px){ #syh-app.yhls-home-v10982{--yhls-home-gutter:clamp(8px,2.1vw,10px);--yhls-home-canvas-width:calc(100vw - (var(--yhls-home-gutter) * 2))} #syh-app.yhls-home-v10982 .yhls-home-masthead{padding:16px 0 12px} #syh-app.yhls-home-v10982 .yhls-home-eyebrow{margin-bottom:12px;font-size:11px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(34px,8.6vw,42px)} #syh-app.yhls-home-v10982 .yhls-home-subtitle{font-size:18px;margin-top:6px} #syh-app.yhls-home-v10982 .yhls-home-desc{font-size:13px;line-height:1.5;margin-top:10px} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{margin-top:14px;gap:7px} #syh-app.yhls-home-v10982 .yhls-hero-pill{min-height:40px;padding:7px 8px;font-size:11px} #syh-app.yhls-home-v10982 .yhls-digital-library-art{width:100%;aspect-ratio:997/500;max-width:none;margin:10px 0 0;max-height:none} #syh-app.yhls-home-v10982 .yhls-home-ticker{padding-top:8px} #syh-app.yhls-home-v10982 .yhls-home-ticker-row{padding:8px 9px;border-radius:12px} #syh-app.yhls-home-v10982 .yhls-home-hub{padding:10px 0 16px} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{grid-template-columns:minmax(0,1fr);gap:8px} #syh-app.yhls-home-v10982 .yhls-home-feature{grid-template-columns:84px minmax(0,1fr);min-height:118px;padding:10px 40px 10px 10px;border-radius:15px;gap:10px} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:16px} #syh-app.yhls-home-v10982 .yhls-home-feature-text small{font-size:12px;line-height:1.42} #syh-app.yhls-home-v10982 .yhls-home-feature-arrow{width:28px;height:28px;right:9px;bottom:9px} #syh-app.yhls-home-v10982 .yhls-books-section{padding-top:18px;padding-bottom:20px} #syh-app.yhls-home-v10982 .yhls-books-masthead{padding:14px 12px;border-radius:15px} #syh-app.yhls-home-v10982 .yhls-most-viewed-section{padding-top:16px;padding-bottom:22px} #syh-app.yhls-home-v10982 .yhls-most-viewed{padding:10px 9px 13px!important;border-radius:14px!important} } @media(max-width:360px){ #syh-app.yhls-home-v10982 .yhls-home-feature{grid-template-columns:72px minmax(0,1fr);min-height:112px;padding-right:36px} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:15px} } html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-home-feature, html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-books-masthead, html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-most-viewed{box-shadow:0 10px 26px rgba(0,0,0,.12)} /* v1.09.79: version selector smoke-check remains alongside shipped styles. */ #syh-app.yhls-home-v10982 .yhls-hero-pill .yhls-pill-icon svg{display:block;width:21px;height:21px;max-width:21px;max-height:21px;fill:none;stroke:currentColor;stroke-width:1.8} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{display:flex;flex-wrap:wrap} #syh-app.yhls-home-v10982 .yhls-home-feature-grid{display:grid} #syh-app.yhls-home-v10982 .yhls-home-feature{display:grid} /* A conservative intrinsic size guards against overly tall digital artwork. */ #syh-app.yhls-home-v10982 .yhls-digital-library-art{overflow:hidden} #syh-app.yhls-home-v10982 .yhls-digital-library-art img{width:100%;height:100%;max-height:100%;object-fit:contain} /* v1.09.81 — 2K/3K/5K fluid, safe-area-aware canonical canvas. * Reuses the canonical theme's live right-rail footprint, updated by theme.js. * No independent dock watcher; no hard-coded 1520px upper limit. */ #syh-app.yhls-home-v10982{ --yhls-home-max:var(--med-host-canvas-max,clamp(1480px,90vw,3000px)); --yhls-home-gutter:var(--med-host-gutter,clamp(12px,2.35vw,48px)); --yhls-home-rail:var(--med-host-right-rail-safe,0px); --yhls-home-canvas-width:min(var(--yhls-home-max),calc(100% - var(--yhls-home-rail) - var(--yhls-home-gutter) - var(--yhls-home-gutter))); --yhls-home-canvas-left:max(var(--yhls-home-gutter),calc((100% - var(--yhls-home-rail) - var(--yhls-home-max)) / 2)); overflow-x:clip; } /* Keep the exact same left alignment for ALL top-level sections and header/footer. * Preserve the right side as an unoccupied NAH Search Dock Pro rail on desktop. */ #syh-app.yhls-home-v10982 :is(.yhls-canonical-header,.yhls-canonical-footer) .syh-shell, #syh-app.yhls-home-v10982 main > :is(section,.syh-section,div[class*="section"],div[class*="spot"],div[class*="inspiration"]) > :is(.syh-shell,.yhls-inspiration-shell,.mmspot-site-shell,.mmspot-shell,.medipharm-shell,.container,.wrap){ width:var(--yhls-home-canvas-width)!important; max-width:var(--yhls-home-canvas-width)!important; min-width:0!important; margin-left:var(--yhls-home-canvas-left)!important; margin-right:0!important; padding-inline:0!important; box-sizing:border-box!important; } #syh-app.yhls-home-v10982 .yhls-home-masthead{padding-block:clamp(9px,.8vw,18px) clamp(8px,.65vw,14px)} #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,.89fr) minmax(0,1.11fr);gap:clamp(8px,1.2vw,30px);align-items:center} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{padding-block:clamp(9px,1vw,18px)} #syh-app.yhls-home-v10982 .yhls-home-eyebrow{margin-bottom:clamp(13px,1.3vw,23px)} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(40px,3vw,76px);max-width:850px} #syh-app.yhls-home-v10982 .yhls-home-subtitle{font-size:clamp(18px,1.5vw,30px)} #syh-app.yhls-home-v10982 .yhls-home-desc{max-width:690px;font-size:clamp(14px,.95vw,19px)} #syh-app.yhls-home-v10982 .yhls-hero-quicklinks{max-width:750px;gap:clamp(7px,.55vw,11px)} #syh-app.yhls-home-v10982 .yhls-digital-library-art{ width:100%;max-width:100%;margin:0!important;aspect-ratio:1115/435; max-height:clamp(300px,22vw,575px);min-height:0;display:flex;align-items:center;justify-content:center; mix-blend-mode:normal;overflow:hidden;border-radius:0;isolation:isolate; } #syh-app.yhls-home-v10982 .yhls-digital-library-art::before{display:none} #syh-app.yhls-home-v10982 .yhls-digital-library-art img{ width:100%;height:100%;object-fit:contain;object-position:center center; /* The image itself has feathered alpha edges. Additional CSS tint keeps the transition natural if dark-mode colors differ from the image. */ display:block;filter:saturate(.95) brightness(1.015); } /* Cards and books continue using one unified rail-aware width. */ #syh-app.yhls-home-v10982 .yhls-home-feature-grid, #syh-app.yhls-home-v10982 .yhls-books-masthead, #syh-app.yhls-home-v10982 .yhls-books-toolbar, #syh-app.yhls-home-v10982 .yhls-book-rail, #syh-app.yhls-home-v10982 .yhls-most-viewed{width:100%!important;max-width:100%!important;margin-inline:0!important} @media(min-width:1920px){ #syh-app.yhls-home-v10982 .yhls-home-feature-grid{gap:clamp(18px,1.2vw,30px)} #syh-app.yhls-home-v10982 .yhls-home-feature{min-height:clamp(174px,8vw,220px)} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-size:clamp(20px,1.16vw,28px)} #syh-app.yhls-home-v10982 .yhls-home-feature-text small{font-size:clamp(14px,.8vw,17px)} } @media(max-width:1199px){ #syh-app.yhls-home-v10982{--yhls-home-rail:0px} } @media(max-width:960px){ #syh-app.yhls-home-v10982 .yhls-home-hero-layout{grid-template-columns:minmax(0,1fr)} #syh-app.yhls-home-v10982 .yhls-home-hero-copy{padding-block:8px 0} #syh-app.yhls-home-v10982 .yhls-digital-library-art{aspect-ratio:1115/435;max-height:none;margin:6px 0 0!important} } @media(max-width:620px){ #syh-app.yhls-home-v10982{ --yhls-home-gutter:clamp(8px,2.1vw,10px); --yhls-home-rail:0px; } #syh-app.yhls-home-v10982 .yhls-home-masthead{padding-block:13px 8px} #syh-app.yhls-home-v10982 .yhls-home-hero-copy h1{font-size:clamp(34px,8.6vw,43px)} #syh-app.yhls-home-v10982 .yhls-home-desc{font-size:13px} #syh-app.yhls-home-v10982 .yhls-digital-library-art{width:100%;height:auto;max-height:none;aspect-ratio:1115/435;margin:8px 0 0!important} } html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-digital-library-art{mix-blend-mode:normal;filter:brightness(.82) saturate(.85)} /* v1.09.81 — Unified biomedical visual system and native lecture catalogue */ #syh-app.yhls-home-v10982{ --yhls-accent:#0876bd;--yhls-ink:#163c5f;--yhls-muted:#607f97; --yhls-surface:#fff;--yhls-surface-soft:#f5faff;--yhls-border:#dceaf2; --yhls-card-radius:20px;--yhls-icon-size:clamp(74px,7.2vw,128px) } #syh-app.yhls-home-v10982 .yhls-lecture-section{padding-block:clamp(18px,2.25vw,46px);background:var(--h-canvas)} #syh-app.yhls-home-v10982 .yhls-lecture-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(17px,1.65vw,28px)} #syh-app.yhls-home-v10982 .yhls-lecture-heading>div{min-width:0;max-width:900px} #syh-app.yhls-home-v10982 .yhls-lecture-kicker{color:#24799e;font-size:12px;font-weight:850;letter-spacing:.11em;line-height:1.45} #syh-app.yhls-home-v10982 .yhls-lecture-heading h2{color:var(--yhls-ink);font-size:clamp(24px,2.35vw,39px);font-weight:830;letter-spacing:-.033em;line-height:1.22;margin:7px 0 9px} #syh-app.yhls-home-v10982 .yhls-lecture-heading p{margin:0;color:var(--yhls-muted);font-size:clamp(13px,1vw,16px);line-height:1.6} #syh-app.yhls-home-v10982 .yhls-lecture-all{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;padding:11px 15px;border-radius:11px;border:1px solid var(--yhls-border);background:#fff;color:#08689d;text-decoration:none;font-size:13px;font-weight:750} #syh-app.yhls-home-v10982 .yhls-lecture-layout{display:grid;grid-template-columns:clamp(216px,18vw,305px) minmax(0,1fr);gap:clamp(12px,1.3vw,23px);align-items:start;min-width:0} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar{min-width:0;max-height:760px;overflow:auto;overscroll-behavior:contain;scrollbar-color:#bbd7e8 transparent;scrollbar-width:thin;padding:16px 13px 18px;border:1px solid var(--yhls-border);border-radius:var(--yhls-card-radius);background:linear-gradient(159deg,#fff,#f7fbfe);box-shadow:0 9px 30px rgba(35,91,126,.04)} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar-top{display:flex;flex-direction:column;gap:4px;padding:3px 6px 13px;margin-bottom:14px;border-bottom:1px solid var(--yhls-border)} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar-top strong{font-size:15px;color:#214d73;line-height:1.3} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar-top>span{font-size:12px;color:#6d8aa0} #syh-app.yhls-home-v10982 .yhls-lecture-cat-search{display:flex;align-items:center;gap:7px;padding:10px;border:1px solid #d8e7f1;border-radius:11px;background:#fff;margin-bottom:12px} #syh-app.yhls-home-v10982 .yhls-lecture-cat-search svg{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:#63869d;stroke-width:2;stroke-linecap:round} #syh-app.yhls-home-v10982 .yhls-lecture-cat-search input{border:0!important;box-shadow:none!important;outline:none!important;background:transparent!important;width:100%;min-width:0;padding:0!important;color:#16425f;font-size:13px} #syh-app.yhls-home-v10982 .yhls-lecture-category-list{list-style:none;padding:0;margin:0;display:grid;gap:2px} #syh-app.yhls-home-v10982 .yhls-lecture-category-list[hidden],#syh-app.yhls-home-v10982 .yhls-lecture-category-children[hidden],#syh-app.yhls-home-v10982 .yhls-lecture-category-node[hidden]{display:none!important} #syh-app.yhls-home-v10982 .yhls-lecture-category-row{display:flex;align-items:center;min-width:0;gap:3px} #syh-app.yhls-home-v10982 .yhls-lecture-expand,#syh-app.yhls-home-v10982 .yhls-lecture-expand-spacer{flex:0 0 22px;width:22px;height:28px;display:grid;place-items:center} #syh-app.yhls-home-v10982 .yhls-lecture-expand{padding:0!important;border:0;background:transparent;color:#668da5;cursor:pointer;border-radius:7px;font-size:21px} #syh-app.yhls-home-v10982 .yhls-lecture-expand span{display:block;transition:transform .16s ease;line-height:1} #syh-app.yhls-home-v10982 .yhls-lecture-expand[aria-expanded="true"] span{transform:rotate(90deg)} #syh-app.yhls-home-v10982 .yhls-lecture-category-link{display:flex;align-items:center;justify-content:space-between;gap:7px;flex:1;min-width:0;min-height:34px;padding:7px 8px;border-radius:9px;color:#365e7b;text-decoration:none;font-size:12px;line-height:1.35;transition:background .15s ease} #syh-app.yhls-home-v10982 .yhls-lecture-category-link>span{min-width:0;overflow-wrap:anywhere} #syh-app.yhls-home-v10982 .yhls-lecture-category-link small{border-radius:9px;padding:3px 5px;background:#e9f3fb;color:#447597;font-size:10px;font-weight:750;white-space:nowrap} #syh-app.yhls-home-v10982 .yhls-lecture-category-link:hover,#syh-app.yhls-home-v10982 .yhls-lecture-category-link.is-active{background:#e6f3fc;color:#07589d} #syh-app.yhls-home-v10982 .yhls-lecture-category-link.is-active{font-weight:800} #syh-app.yhls-home-v10982 .yhls-lecture-all-cat{margin-bottom:7px;min-height:39px;font-weight:760} #syh-app.yhls-home-v10982 .yhls-lecture-category-children{padding-left:8px;margin-left:10px;border-left:1px solid #d4e6f0} #syh-app.yhls-home-v10982 .yhls-lecture-tree-empty{padding:9px 8px;color:#6a8396;font-size:12px} #syh-app.yhls-home-v10982 .yhls-lecture-content{min-width:0} #syh-app.yhls-home-v10982 .yhls-lecture-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px} #syh-app.yhls-home-v10982 .yhls-lecture-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:1 1 430px;max-width:710px;gap:8px} #syh-app.yhls-home-v10982 .yhls-lecture-tabs button{min-width:0;min-height:41px;padding:8px 12px;border:1px solid #d4e5ef;border-radius:11px;background:#fff;color:#254c69;font-size:13px;font-weight:760;cursor:pointer} #syh-app.yhls-home-v10982 .yhls-lecture-tabs button.is-selected{background:#dff0ff;border-color:#b8dafa;color:#065895} #syh-app.yhls-home-v10982 .yhls-lecture-search{display:flex;align-items:center;width:clamp(190px,19vw,270px);max-width:100%;min-width:0;min-height:41px;border:1px solid #d8e7f0;border-radius:11px;background:#fff} #syh-app.yhls-home-v10982 .yhls-lecture-search input{flex:1;min-width:0;padding:9px 0 9px 12px;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:#274d66;font-size:12px} #syh-app.yhls-home-v10982 .yhls-lecture-search button{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;padding:9px;border:0;background:none;color:#1d81b7;cursor:pointer} #syh-app.yhls-home-v10982 .yhls-lecture-search svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round} #syh-app.yhls-home-v10982 .yhls-lecture-result-note{font-size:12px;line-height:1.5;color:#718ca2;margin:0 0 13px;min-height:18px} #syh-app.yhls-home-v10982 .yhls-lecture-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(11px,1vw,19px);min-width:0;align-items:stretch} #syh-app.yhls-home-v10982 .yhls-lecture-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid #e0ebf3;border-radius:17px;background:#fff;box-shadow:0 5px 22px rgba(29,73,100,.045);transition:transform .18s ease,box-shadow .18s ease} #syh-app.yhls-home-v10982 .yhls-lecture-card:hover{transform:translateY(-3px);box-shadow:0 11px 28px rgba(29,73,100,.1)} #syh-app.yhls-home-v10982 .yhls-lecture-thumb{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(140deg,#f2f8fc,#e5f0f8);text-decoration:none} #syh-app.yhls-home-v10982 .yhls-lecture-thumb img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:transparent} #syh-app.yhls-home-v10982 .yhls-lecture-placeholder{display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(circle at 40% 30%,#f9ffff,#e3f3fa 80%)} #syh-app.yhls-home-v10982 .yhls-lecture-placeholder svg{display:block;width:36%;max-width:76px;fill:none;stroke:#6aa9cc;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} #syh-app.yhls-home-v10982 .yhls-lecture-placeholder-label{font-size:22px;font-weight:900;color:#589fc8} #syh-app.yhls-home-v10982 .yhls-lecture-rank{position:absolute;z-index:1;left:10px;top:10px;min-width:31px;height:31px;display:grid;place-items:center;padding:0 6px;background:#263b54;border-radius:10px;color:#fff;box-shadow:0 8px 17px rgba(25,44,60,.15);font-size:13px;font-weight:800} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy{display:flex;flex-direction:column;flex:1;gap:8px;padding:12px 13px 13px;min-width:0} #syh-app.yhls-home-v10982 .yhls-lecture-category-name{display:block;color:#567c9c;font-size:11px;font-weight:760;letter-spacing:.025em;text-transform:uppercase;line-height:1.4} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3{font-size:clamp(13px,.94vw,16px);line-height:1.46;font-weight:780;margin:0;letter-spacing:-.012em;flex:1;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3 a{color:#183e5c;text-decoration:none} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3 a:hover{color:#0870b3} #syh-app.yhls-home-v10982 .yhls-lecture-card-foot{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:6px;padding-top:10px;border-top:1px solid #e7f0f5;font-size:11px;color:#7391a6} #syh-app.yhls-home-v10982 .yhls-lecture-card-foot a{font-size:11px;font-weight:800;color:#1570ac;text-decoration:none;white-space:nowrap} #syh-app.yhls-home-v10982 .yhls-lecture-empty{padding:28px;border:1px dashed #d1e4ef;border-radius:14px;text-align:center;color:#607f95} #syh-app.yhls-home-v10982 .yhls-lecture-actions{display:flex;justify-content:center;margin-top:20px} #syh-app.yhls-home-v10982 .yhls-lecture-actions button{padding:11px 19px;border:1px solid #cde3f0;border-radius:12px;background:#fff;color:#116ba4;font-size:13px;font-weight:800;cursor:pointer} #syh-app.yhls-home-v10982 .yhls-lecture-actions button[hidden],#syh-app.yhls-home-v10982 .yhls-lecture-empty[hidden]{display:none!important} #syh-app.yhls-home-v10982 .yhls-lecture-content[aria-busy="true"] .yhls-lecture-grid{opacity:.55;pointer-events:none} #syh-app.yhls-home-v10982 :is(.yhls-lecture-tabs button,.yhls-lecture-category-link,.yhls-lecture-expand,.yhls-lecture-all,.yhls-lecture-actions button):focus-visible{outline:3px solid #208dde;outline-offset:2px} /* Visual harmonization: same pictorial language and consistent icon anchors. */ #syh-app.yhls-home-v10982 .yhls-home-feature{grid-template-columns:clamp(86px,29%,146px) minmax(0,1fr);gap:clamp(12px,1vw,22px);align-items:center;border-color:rgba(207,229,241,.55)} #syh-app.yhls-home-v10982 .yhls-home-feature-media{display:grid;place-items:center;width:100%;max-width:none;aspect-ratio:1;border-radius:22px;isolation:isolate;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.92),rgba(232,245,255,.32) 56%,transparent 75%)} #syh-app.yhls-home-v10982 .yhls-home-feature-media img{width:92%;height:92%;object-fit:contain;object-position:center;filter:drop-shadow(0 6px 8px rgba(49,94,117,.07))} #syh-app.yhls-home-v10982 .yhls-home-feature-text strong{font-weight:780;letter-spacing:-.024em} @media(min-width:2200px){ #syh-app.yhls-home-v10982 .yhls-lecture-layout{grid-template-columns:clamp(260px,16vw,370px) minmax(0,1fr)} #syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:repeat(5,minmax(0,1fr))} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3{font-size:clamp(15px,.8vw,19px)} } @media(min-width:3800px){#syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:repeat(6,minmax(0,1fr))}} @media(max-width:1200px){ #syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:repeat(3,minmax(0,1fr))} #syh-app.yhls-home-v10982 .yhls-lecture-tabs{flex-basis:330px} } @media(max-width:900px){ #syh-app.yhls-home-v10982 .yhls-lecture-layout{grid-template-columns:200px minmax(0,1fr)} #syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:repeat(2,minmax(0,1fr))} #syh-app.yhls-home-v10982 .yhls-lecture-search{flex:1 1 180px;width:100%} #syh-app.yhls-home-v10982 .yhls-lecture-tabs{max-width:none;flex:1 1 100%} } @media(max-width:680px){ #syh-app.yhls-home-v10982 .yhls-lecture-heading{align-items:flex-start;flex-direction:column;gap:12px} #syh-app.yhls-home-v10982 .yhls-lecture-layout{grid-template-columns:minmax(0,1fr);gap:12px} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar{max-height:310px;border-radius:15px} #syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} #syh-app.yhls-home-v10982 .yhls-lecture-toolbar{gap:8px} #syh-app.yhls-home-v10982 .yhls-lecture-tabs{gap:5px} #syh-app.yhls-home-v10982 .yhls-lecture-tabs button{padding:9px 5px;min-height:39px;font-size:clamp(10px,3vw,12px)} #syh-app.yhls-home-v10982 .yhls-lecture-search{min-height:39px} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy{padding:10px 10px 11px;gap:5px} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3{font-size:13px} #syh-app.yhls-home-v10982 .yhls-lecture-rank{left:7px;top:7px;width:25px;min-width:25px;height:25px;font-size:11px;border-radius:8px} #syh-app.yhls-home-v10982 .yhls-lecture-card-foot{flex-wrap:wrap} #syh-app.yhls-home-v10982 .yhls-home-feature-media{border-radius:15px} #syh-app.yhls-home-v10982 .yhls-home-feature-media img{width:95%;height:95%} } @media(max-width:370px){ #syh-app.yhls-home-v10982 .yhls-lecture-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px} #syh-app.yhls-home-v10982 .yhls-lecture-card-copy h3{font-size:12px} } html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982{ --yhls-ink:#e6f4fd;--yhls-muted:#a7c4d6;--yhls-surface:#142d3d;--yhls-border:#345367 } html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 :is(.yhls-lecture-sidebar,.yhls-lecture-card,.yhls-lecture-tabs button,.yhls-lecture-search,.yhls-lecture-cat-search,.yhls-lecture-all,.yhls-lecture-actions button){background:#142d3d;border-color:#31566a;color:#c9e3f0} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 :is(.yhls-lecture-sidebar-top strong,.yhls-lecture-card-copy h3 a,.yhls-lecture-heading h2){color:#e3f3ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-lecture-tabs button.is-selected{background:#1b5274;color:#e6f8ff} html:is(.yhlsm-dark,.tvm-dark,.nah-sdp-dark-mode,.nah-sdp-night-active,.nah-sdp-night-mode) #syh-app.yhls-home-v10982 .yhls-lecture-category-link.is-active{background:#204a65;color:#e5f5ff} @media(prefers-reduced-motion:reduce){#syh-app.yhls-home-v10982 .yhls-lecture-card{transition:none}} /* v1.09.82: one editorial heading per section, no audit or duplicated labels. */ #syh-app.yhls-home-v10982 .yhls-lecture-heading{align-items:center;margin-bottom:clamp(14px,1.3vw,22px)} #syh-app.yhls-home-v10982 .yhls-lecture-heading h2{margin:0;line-height:1.2} #syh-app.yhls-home-v10982 .yhls-lecture-sidebar-top{padding-bottom:10px;margin-bottom:12px} #syh-app.yhls-home-v10982 .yhls-lecture-result-note:empty{display:none!important} #syh-app.yhls-home-v10982 .yhls-books-heading h2{margin:0} /* Dedicated Inspiration Library remains available on other routes. Homepage only: hide * its old integration even when the separate plugin inserts a delayed widget. */ body.yhls-home-editorial-only :is(.mpi-section,.yhls-inspiration-section,.yhls-inspiration-integration,.mmspot-site-inspiration,[data-medipharm-inspiration-slot],.medipharm-inspiration-home,.medipharm-inspiration-widget){display:none!important;visibility:hidden!important} body:has(#syh-app.yhls-home-v10982) :is(.mpi-section,.yhls-inspiration-section,.yhls-inspiration-integration,.mmspot-site-inspiration,[data-medipharm-inspiration-slot],.medipharm-inspiration-home,.medipharm-inspiration-widget){display:none!important;visibility:hidden!important}