:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .64);--primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--secondary-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--accent-gradient: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);--dark-gradient: linear-gradient(135deg, #232526 0%, #414345 100%);--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--shadow-light: 0 8px 32px 0 rgba(31, 38, 135, .37);--shadow-dark: 0 8px 32px 0 rgba(0, 0, 0, .37)}:root{--color-background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--color-background-soft: var(--glass-bg);--color-background-mute: rgba(255, 255, 255, .05);--color-border: var(--glass-border);--color-border-hover: rgba(255, 255, 255, .4);--color-heading: #ffffff;--color-text: rgba(255, 255, 255, .9);--section-gap: 160px}@media (prefers-color-scheme: dark){:root{--color-background: var(--dark-gradient);--color-background-soft: rgba(0, 0, 0, .3);--color-background-mute: rgba(0, 0, 0, .5);--color-border: rgba(255, 255, 255, .1);--color-border-hover: rgba(255, 255, 255, .3);--color-heading: #ffffff;--color-text: rgba(255, 255, 255, .8)}}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);background-attachment:fixed;transition:all .5s ease;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 80%,rgba(120,119,198,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,119,198,.12) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(120,219,226,.1) 0%,transparent 50%);z-index:-1;animation:float 25s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0) rotate(0)}33%{transform:translateY(-15px) rotate(.5deg)}66%{transform:translateY(-8px) rotate(-.5deg)}}.glass{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);box-shadow:var(--shadow-light)}html{scroll-behavior:smooth}#app{width:100%;max-width:1200px;margin:0 auto;padding:1rem;font-weight:400;position:relative;z-index:1}.layout{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow-light);animation:slideInUp .8s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}a,.purple{text-decoration:none;color:#00f2fe;transition:all .3s ease;padding:4px 8px;border-radius:6px;position:relative;font-weight:500}a:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#4facfe33,#00f2fe33);border-radius:6px;opacity:0;transition:opacity .3s ease;z-index:-1}@media (hover: hover){a:hover{color:#fff;text-shadow:0 0 10px rgba(79,172,254,.6);transform:translateY(-2px)}a:hover:before{opacity:1}}.purple{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;text-shadow:none}@media (min-width: 1024px){body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem}#app{display:grid;padding:2rem;width:100%}.layout{padding:4rem}}@media (prefers-reduced-motion: no-preference){.animate-on-scroll{opacity:0;transform:translateY(30px);transition:all .6s ease-out}.animate-on-scroll.visible{opacity:1;transform:translateY(0)}}