:root{--cream-bg: #FFF8E7;--pencil-gray: #4A4A4A;--accent-blue: #5B7FA5;--ruled-line: #C8D8E8;--margin-red: #E8A0A0;--error-red: #D32F2F;--text-dark: #333333;--handwritten-font: "Patrick Hand", cursive;--sketchy-border: 2.5px solid var(--pencil-gray);--notebook-shadow: 0 4px 10px rgba(0, 0, 0, .08);--transition-speed: .3s;--ease: cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body.pencil-paper{background-color:#f0f0f0;font-family:var(--handwritten-font);color:var(--pencil-gray);line-height:1.6}.notebook-page{background-color:var(--cream-bg);background-image:linear-gradient(var(--ruled-line) 1px,transparent 1px);background-size:100% 32px;position:relative;padding:40px 60px;border:var(--sketchy-border);box-shadow:var(--notebook-shadow);border-radius:8px;max-width:1100px;margin:2rem auto}.notebook-page:before{content:"";position:absolute;top:0;left:50px;width:1.5px;height:100%;background-color:var(--margin-red);z-index:0}.notebook-page>*{position:relative;z-index:1}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;max-width:1200px;margin:0 auto}.logo-img{height:60px;transition:transform var(--transition-speed)}.logo-img:hover{transform:rotate(-3deg) scale(1.05)}.nav-links{display:flex;list-style:none;gap:2rem;align-items:center}.nav-links a{text-decoration:none;color:var(--pencil-gray);font-size:1.4rem;font-weight:700;position:relative}.nav-links a:hover{color:var(--accent-blue)}.btn-sketch{display:inline-block;padding:.8rem 2rem;font-size:1.5rem;text-decoration:none;font-weight:700;border:var(--sketchy-border);border-radius:12px;transition:transform var(--transition-speed),background var(--transition-speed);cursor:pointer}.btn-sketch.primary{background-color:var(--pencil-gray);color:var(--cream-bg)}.btn-sketch.primary:hover{background-color:var(--accent-blue);transform:translateY(-4px) rotate(1deg)}.btn-sketch.secondary{color:var(--pencil-gray)}.btn-sketch.secondary:hover{background-color:#5b7fa51a;transform:translateY(-2px) rotate(-1deg)}.section{padding:3rem 1.5rem;max-width:1200px;margin:0 auto;text-align:center}.section-title{font-size:3rem;margin-bottom:2.5rem;color:var(--pencil-gray);text-transform:uppercase;letter-spacing:2px}.games-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.5rem}.game-card{padding:2.5rem;transition:transform var(--transition-speed);cursor:pointer}.game-card:hover{transform:scale(1.03) rotate(2deg)}.game-name{font-size:2.2rem;margin-bottom:1rem}.features-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:3rem;margin-top:3rem}.feature-item .icon{font-size:3rem;margin-bottom:1rem;display:block}.feature-item h3{font-size:2rem;margin-bottom:.8rem}.ranks-display{display:flex;justify-content:center;align-items:center;gap:4rem;flex-wrap:wrap}.rank-badge img{width:120px;height:auto;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.rank-badge:hover img{transform:scale(1.1) rotate(5deg);cursor:pointer}.footer{text-align:center;padding:3rem 0}.footer-content{padding:20px 40px;font-size:1.2rem}.hero-card{margin-top:0;padding:80px 60px}.sketch-title{font-size:4.5rem;margin-bottom:1.5rem}.hero-subtitle{font-size:1.8rem;margin-bottom:3rem;max-width:800px;margin-left:auto;margin-right:auto}.cta-group{display:flex;gap:2rem;justify-content:center}@media(max-width:768px){.sketch-title{font-size:3rem}.nav-links{display:none}.notebook-page{padding:30px 40px}.cta-group{flex-direction:column}}