*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#212529;background:#fff}.app{text-align:center;min-height:100vh;display:flex;flex-direction:column}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);padding:3rem 2rem;color:#fff}.app-header h1{margin:0;font-size:2.5rem;font-weight:700}.app-description{margin:1rem auto 0;font-size:1.1rem;opacity:.9;max-width:600px}.app-main{flex:1;padding:2rem;max-width:1200px;margin:0 auto}.widget-demo-section{margin-bottom:3rem}.widget-demo-section h2{color:#333;margin-bottom:1rem}.widget-demo-section a{color:#667eea;text-decoration:none;font-weight:600}.widget-demo-section a:hover{color:#764ba2;text-decoration:underline}.info-card{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);border:1px solid rgba(102,126,234,.1);border-radius:12px;padding:1.5rem;margin:1.5rem 0;box-shadow:0 4px 6px #00000012,0 1px 3px #0000000f}.info-card-content{width:100%}.info-card-content strong{display:block;color:#2c3e50;font-size:1.1rem;margin-bottom:.5rem}.info-card-content p{margin:0;color:#495057;line-height:1.6}.widget-container{background:#f8f9fa;border:2px dashed #dee2e6;border-radius:8px;padding:2rem;margin:2rem 0;min-height:200px}.integration-info,.next-steps{background:#fff;border:1px solid #e9ecef;border-radius:8px;padding:2rem;margin:2rem 0;text-align:left;box-shadow:0 2px 4px #0000001a}.integration-info h2,.next-steps h2{color:#495057;margin-top:0;margin-bottom:1rem}.integration-info ol,.next-steps ul{padding-left:1.5rem}.integration-info li,.next-steps li{margin-bottom:.5rem;line-height:1.6}code{background:#f1f3f4;padding:.2em .4em;border-radius:3px;font-size:.9em;color:#d73a49}.app-footer{background:#f8f9fa;padding:2rem;border-top:1px solid #e9ecef;margin-top:auto}.app-footer a{color:#667eea;text-decoration:none;font-weight:600}.app-footer a:hover{color:#764ba2;text-decoration:underline}.heart{color:#e74c3c}@media(max-width:768px){.app-header{padding:2rem 1rem}.app-header h1{font-size:2rem}.app-main{padding:1rem}.integration-info,.next-steps{padding:1.5rem}}