/* Native RyanCV scroll mode, with stable pixel sizes and a real document flow. */
html{scroll-padding-top:28px}
html body.by-system-layout.body-style-scroll{overflow-x:hidden;overflow-y:auto;--by-sticky-top:28px}
html body.by-system-layout.body-style-scroll.admin-bar{--by-sticky-top:60px}
html body.by-system-layout.body-style-scroll .page_wrap{display:block!important;height:auto!important;min-height:100dvh;padding:28px 0 48px!important;overflow:visible!important}
html body.by-system-layout.body-style-scroll .page .container.opened{display:grid!important;grid-template-columns:72px 340px minmax(0,1fr);column-gap:22px;align-items:start;position:relative!important;width:calc(100% - 72px)!important;max-width:1480px!important;height:auto!important;max-height:none!important;min-height:0!important;margin:0 auto!important;padding:0!important;overflow:visible}
html body.by-system-layout.body-style-scroll .page .container.opened>.header{grid-column:1;grid-row:1;position:sticky!important;top:var(--by-sticky-top)!important;left:auto!important;width:72px!important;height:auto!important;align-self:start;transform:none!important;z-index:20}
html body.by-system-layout.body-style-scroll .page .container.opened>.card-started{grid-column:2;grid-row:1;position:sticky!important;top:var(--by-sticky-top)!important;left:auto!important;width:100%!important;height:min(700px,calc(100dvh - 104px))!important;min-height:0!important;align-self:start;transform:none!important}
html body.by-system-layout.body-style-scroll .page .container.opened>.card-started .profile{height:100%!important;min-height:0!important}
html body.by-system-layout.body-style-scroll .page .container.opened>#by-main{display:block!important;grid-column:3;grid-row:1;min-width:0;position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;max-height:none!important;margin:0!important;overflow:visible}
html body.by-system-layout.body-style-scroll .page .container.opened .card-inner{display:block!important;position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;max-height:none!important;min-height:0!important;margin:0 0 24px!important;opacity:1!important;visibility:visible!important;animation:none!important;transform:none!important;scroll-margin-top:28px}
html body.by-system-layout.body-style-scroll .card-inner .card-wrap{height:auto!important;max-height:none!important;overflow:visible!important;padding:0!important}
html body.by-system-layout.body-style-scroll .by-main>.card-inner:last-child{margin-bottom:0!important}
html body.by-system-layout.body-style-scroll .by-content{padding:34px 32px!important;font-size:16px;line-height:1.8}
html body.by-system-layout.body-style-scroll .by-content h1{font-size:38px;line-height:1.25}
html body.by-system-layout.body-style-scroll .by-content .by-lead{font-size:17px!important}
html body.by-system-layout.body-style-scroll .custom-footer{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:100%;margin:0;padding:18px 24px 24px!important;font-size:11px!important;line-height:1.7}
html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .page .container.opened{grid-template-columns:72px minmax(0,1fr);max-width:1260px!important}
html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .page .container.opened>.card-started{display:none!important}
html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .page .container.opened>#by-main{grid-column:2}
html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .by-article{max-width:1120px;padding:36px 42px!important;margin:0 auto}
html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .by-prose{font-size:18px!important;max-width:78ch}
/* One native checkbox, accessible by keyboard and retained by RyanCV for seven days. */
html body.by-system-layout .header .mode-switch-btn{display:block!important;position:relative!important;top:auto;left:auto;width:72px;height:50px;margin:0 0 12px;background:#0c111a;border:1px solid #263440;border-radius:4px;color:#c2d9ef;box-sizing:border-box;overflow:visible}
html body.by-system-layout .mode-switch-btn .tgl{display:block!important;position:absolute!important;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2}
html body.by-system-layout .mode-switch-btn .mode-swich-label{display:block;width:100%;height:100%;margin:0;cursor:pointer}
html body.by-system-layout .mode-switch-btn .mode-swich-label .sw-before,html body.by-system-layout .mode-switch-btn .mode-swich-label .sw-after{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;line-height:1}
html body.by-system-layout .mode-switch-btn svg{width:22px;height:22px}
html body.by-system-layout .mode-switch-btn svg path{fill:currentColor!important}
html body.by-system-layout .mode-switch-btn:focus-within{outline:2px solid var(--by-accent);outline-offset:4px}
@media(min-width:1121px) and (max-width:1350px){
 html body.by-system-layout.body-style-scroll .page .container.opened{width:calc(100% - 48px)!important;grid-template-columns:68px 300px minmax(0,1fr);column-gap:18px}
 html body.by-system-layout.body-style-scroll .page .container.opened>.header{width:68px!important}
 html body.by-system-layout .header .mode-switch-btn{width:68px}
 html body.by-system-layout.body-style-scroll .by-content{padding:28px 26px!important}
 html body.by-system-layout.body-style-scroll .by-content h1{font-size:34px}
 html body.by-system-layout.body-style-scroll .card-started .profile .subtitle{font-size:14px!important}
}
@media(max-width:1120px){
 html body.by-system-layout.body-style-scroll .page .container.opened{display:block!important;width:calc(100% - 40px)!important;max-width:920px!important;padding:0 0 0 88px!important}
 html body.by-system-layout.body-style-scroll .page .container.opened>.header{position:fixed!important;left:max(12px,calc((100vw - 920px)/2))!important;top:var(--by-sticky-top)!important;width:72px!important}
 html body.by-system-layout.body-style-scroll .page .container.opened>.card-started{position:relative!important;top:auto!important;left:auto!important;width:100%!important;height:auto!important;margin-bottom:24px!important}
 html body.by-system-layout.body-style-scroll .page .container.opened>.card-started .profile{height:490px!important}
 html body.by-system-layout.body-style-scroll .by-content{padding:28px!important}
 html body.by-system-layout.body-style-scroll.by-reading-layout .page .container.opened>.card-started{display:none!important}
 html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .by-article{padding:28px!important}
}
@media(max-width:680px){
 html{scroll-padding-top:166px}
 html body.by-system-layout.body-style-scroll .page_wrap{padding:0 0 20px!important}
 html body.by-system-layout.body-style-scroll .page .container.opened{width:100%!important;max-width:none!important;padding:160px 0 0!important}
 html body.by-system-layout.body-style-scroll .page .container.opened>.header{left:0!important;top:0!important;width:100%!important;transform:none!important;perspective:none!important}
 html body.by-system-layout.body-style-scroll.admin-bar .page .container.opened>.header{top:46px!important}
 html body.by-system-layout.body-style-scroll .page .container.opened>.card-started .profile{height:450px!important}
 html body.by-system-layout.body-style-scroll .card-inner{scroll-margin-top:166px}
 html body.by-system-layout.body-style-scroll .by-content,html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .by-article{padding:26px 22px!important}
 html body.by-system-layout.body-style-scroll .by-content h1{font-size:29px}
 html body.by-system-layout.body-style-scroll.by-reading-layout.single-post .by-prose{font-size:17px!important}
 html body.by-system-layout .header .mode-switch-btn{position:fixed!important;left:auto!important;right:14px!important;top:auto!important;bottom:16px!important;width:44px;height:44px;margin:0;border-radius:50%;box-shadow:0 3px 16px #0003;z-index:200}
 html body.by-system-layout.body-style-scroll .custom-footer{padding-right:68px!important}
}
/* Light is a separate blue/white palette; media keeps its original colours. */
html[data-by-theme="dark"]{color-scheme:dark}
html[data-by-theme="light"]{color-scheme:light}
html[data-by-theme="light"] body.by-system-layout{--by-accent:#0966b8;--by-bg:#eef3f9;--by-panel:#fff;--by-text:#26384b;--by-muted:#52667d;--by-line:#d0dce8;background:#eef3f9!important;color:var(--by-text)!important}
html[data-by-theme="light"] body.by-system-layout:before{background:radial-gradient(ellipse at 30% 30%,#c7e1ff55,transparent 60%)}
html[data-by-theme="light"] #by-circuit{opacity:.23}
html[data-by-theme="light"] body.by-system-layout .page .container .card-inner,html[data-by-theme="light"] body.by-system-layout .card-started .profile,html[data-by-theme="light"] body.by-system-layout .header .top-menu,html[data-by-theme="light"] body.by-system-layout .header .profile,html[data-by-theme="light"] body.by-system-layout .header .mode-switch-btn{background:#fff!important;border-color:var(--by-line)!important;color:#17324e;box-shadow:0 8px 30px #19365409}
html[data-by-theme="light"] body.by-system-layout .card-started:after{background:linear-gradient(135deg,#0966b81f,#0966b803)!important}
html[data-by-theme="light"] .by-content,html[data-by-theme="light"] .by-content p{color:var(--by-text)}
html[data-by-theme="light"] .by-content h1,html[data-by-theme="light"] .by-content h2,html[data-by-theme="light"] .by-content h3,html[data-by-theme="light"] .by-content h4,html[data-by-theme="light"] .by-content strong,html[data-by-theme="light"] body.by-system-layout .card-started .profile .title,html[data-by-theme="light"] .header .profile .title,html[data-by-theme="light"] .by-post h3 a,html[data-by-theme="light"] .by-contact-links strong{color:#102b46!important}
html[data-by-theme="light"] .by-content h1 em,html[data-by-theme="light"] .by-eyebrow,html[data-by-theme="light"] .by-kicker,html[data-by-theme="light"] .by-facts strong,html[data-by-theme="light"] .by-timeline time,html[data-by-theme="light"] .by-content a,html[data-by-theme="light"] body.by-system-layout .card-started .profile .subtitle,html[data-by-theme="light"] .header .profile .subtitle{color:var(--by-accent)!important}
html[data-by-theme="light"] .by-content .by-lead,html[data-by-theme="light"] .by-post-info p,html[data-by-theme="light"] .by-case p,html[data-by-theme="light"] .by-expertise p,html[data-by-theme="light"] .by-timeline p,html[data-by-theme="light"] .by-profile-summary p,html[data-by-theme="light"] .by-timeline strong{color:var(--by-muted)}
html[data-by-theme="light"] .by-post,html[data-by-theme="light"] .by-case,html[data-by-theme="light"] .by-diagram,html[data-by-theme="light"] .by-prose pre,html[data-by-theme="light"] .by-prose .by-toc{background:#f6f9fc;border-color:var(--by-line)}
html[data-by-theme="light"] .by-content .by-post h3 a,html[data-by-theme="light"] .by-content .by-case h3{color:#102b46!important}
html[data-by-theme="light"] .by-callout,html[data-by-theme="light"] .by-prose blockquote{background:#edf5fd;color:var(--by-text);border-color:var(--by-accent)}
html[data-by-theme="light"] .by-prose code{background:#eaf2fa;color:#164f7c}
html[data-by-theme="light"] .by-prose pre{color:#173c5e}
html[data-by-theme="light"] .by-prose th{background:#edf3fa;color:#17324e}
html[data-by-theme="light"] .by-tags a,html[data-by-theme="light"] .by-profile-skills li{color:#21577e;background:#edf5fc;border-color:#c5dbee}
html[data-by-theme="light"] .by-blog-filters a,html[data-by-theme="light"] .by-category-tabs a{color:#344f69!important}
html[data-by-theme="light"] .by-blog-filters a[aria-current],html[data-by-theme="light"] .by-blog-filters a:hover,html[data-by-theme="light"] .by-category-tabs a[aria-current]{color:#075ba4!important}
html[data-by-theme="light"] .by-search input{background:#fff;color:#193b59;border-color:#c4d4e4}
html[data-by-theme="light"] .by-search input::placeholder{color:#62778d}
html[data-by-theme="light"] .by-search button{background:#edf5fd;border-color:#a6c5e1;color:#075ba4}
html[data-by-theme="light"] .by-blog-search .by-search{background:#fff;border-color:var(--by-line)}
html[data-by-theme="light"] body.by-system-layout .header .top-menu ul li a{color:#304c67}
html[data-by-theme="light"] body.by-system-layout .header .top-menu ul li.current-menu-item a,html[data-by-theme="light"] body.by-system-layout .header .top-menu ul li.active a,html[data-by-theme="light"] body.by-system-layout .header .top-menu ul li a:hover{color:#0966b8!important}
html[data-by-theme="light"] body.by-system-layout .card-started .profile .social a{color:#245174;border-color:#c9dae9}
html[data-by-theme="light"] body.by-system-layout .card-started .profile .lnks{background:linear-gradient(110deg,#edf5fd,#fff)}
html[data-by-theme="light"] body.by-system-layout .card-started .profile .lnks .lnk{color:#173b5c}
html[data-by-theme="light"] body.by-system-layout .card-started .profile .lnks .lnk .ion{color:#0966b8}
html[data-by-theme="light"] body.by-system-layout .card-started .profile .image img{background:linear-gradient(145deg,#dfebf6,#cbddeb)!important;border-color:#a9c4dc!important}
html[data-by-theme="light"] .custom-footer,html[data-by-theme="light"] .custom-footer a,html[data-by-theme="light"] .custom-footer p{color:#52667d!important}
html[data-by-theme="light"] .by-author strong{color:#102b46}
html[data-by-theme="light"] .by-button:hover{background:#0966b8;color:#fff!important}
html[data-by-theme="light"] a:focus-visible,html[data-by-theme="light"] input:focus-visible{outline-color:#0966b8}
