/* Shared viewport scrollbar — matches the Frontend Mentorship course exactly. */
html{scrollbar-width:thin;scrollbar-color:#6d5bd0 #edf1f8}
html::-webkit-scrollbar{width:12px}
html::-webkit-scrollbar-track{background:linear-gradient(180deg,#eef2f8,#f8f9fc);border-inline-start:1px solid #e0e5ef}
html::-webkit-scrollbar-thumb{min-height:4.5rem;border:3px solid transparent;border-radius:999px;background:linear-gradient(180deg,#8b5cf6,#4f7de8) padding-box;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
html::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#7c3aed,#2563eb) padding-box}
html[data-theme="dark"]{scrollbar-color:#38bdf8 #091522}
html[data-theme="dark"]::-webkit-scrollbar-track{background:linear-gradient(180deg,#081421,#0d1d2d);border-inline-start-color:#1f3347}
html[data-theme="dark"]::-webkit-scrollbar-thumb{border-color:transparent;background:linear-gradient(180deg,#67e8f9,#0ea5e9 52%,#6366f1) padding-box;box-shadow:0 0 .75rem rgba(56,189,248,.32)}
html[data-theme="dark"]::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#a5f3fc,#38bdf8 52%,#818cf8) padding-box}