:root{--primary-color: #8263ff;--secondary-color: #6c5ce7;--background-color: #ffffff;--background-color-scroll: #333;--text-color: #333;--font-family: sans-serif;--border-radius: 50px;--color-switch: #ccc;--link-bg-color: #d9d8df;--link-hover-bg-color: #c4c3cc;--background-red: #dc3545;--background-gray: #6c757d;--background-blue: #007bff;--background-avatar: #ccc}:root{--color-primary: #8263ff;--color-secondary: #6c5ce7;--color-background: #ffffff;--color-text: #333;--color-toast-bg: bisque;--color-button-bg: var(--color-primary);--color-button-text: #fff;--spacing-padding: 10px;--border-radius: 12px;--border-radius-toast: 2px}:root{--tooltip-bg-color: black;--tooltip-text-color: #fff;--tooltip-border-radius: 6px;--tooltip-padding: 20px;--tooltip-arrow-size: 20px;--active-border-color: red;--gap: 25px}*{margin:0;padding:0;box-sizing:border-box}body{width:100%;height:105vh;font-family:var(--font-family);font-size:18px;background:linear-gradient(135deg,#8263ff,#6c5ce7);color:var(--text-color)}.links{text-align:center;display:grid;align-items:center;justify-content:center;height:100vh}.links>a{margin-top:20px;font-size:20px;text-decoration:none;color:var(--primary-color);background-color:var(--link-bg-color);padding:10px 20px;border-radius:var(--border-radius);transition:background-color .3s,color .3s}.links>a:hover{background-color:var(--link-hover-bg-color);color:var(--secondary-color)}body{padding:20px}.media-container{position:relative;display:flex;align-items:center;gap:16px}.media-scroller{display:flex;overflow-x:auto;gap:16px;padding:16px;border-radius:8px;scroll-behavior:smooth;width:100%}.media-item{flex:0 0 auto;width:200px;background-color:var(--background-color);border-radius:8px;overflow:hidden;box-shadow:0 4px 8px var(--background-color-scroll);transition:transform .3s ease}.media-item:hover{transform:scale(1.05)}.media-item img{width:100%;height:auto;display:block}.media-item p{padding:8px;text-align:center;font-size:14px;color:#333}.scroll-button{background-color:var(--background-color);border:none;color:var(--color);font-size:24px;padding:15px;cursor:pointer;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease}.scroll-button:hover{background-color:var(--background-color)}.scroll-button.prev{position:absolute;left:-20px;z-index:1}.scroll-button.next{position:absolute;right:-20px;z-index:1}