:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;padding:2rem}h1{font-size:3.2em;line-height:1.1}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.sn-notifications-container{--sn-success-color: rgb(111, 207, 151);--sn-success-progress-color: rgb(84, 170, 120);--sn-error-color: rgb(235, 87, 87);--sn-error-progress-color: rgb(192, 69, 69);--sn-warning-color: rgb(242, 201, 76);--sn-warning-progress-color: rgb(196, 166, 79);--sn-info-color: rgb(81, 205, 243);--sn-info-progress-color: rgb(84, 169, 196);--sn-notifications-gap: 20px;--sn-notifications-padding: 20px;--sn-notify-width: 320px;--sn-notify-radius: 6px;--sn-notify-transition-timing-function: ease;--sn-notify-transition-duration: .5s;--sn-notify-autoclose-timeout: 30s;--sn-notify-padding: .75em;--sn-notify-icon-size: 2em;--sn-notify-close-icon-size: 1em;--sn-notify-border-size: 1px;--sn-notify-border-color: transparent;--sn-notify-border-style: solid;--sn-notify-progress-color: rgb(51, 51, 51);--sn-notify-close-icon-color: rgb(51, 51, 51);--sn-notify-title-color: rgb(51, 51, 51);--sn-notify-text-color: rgb(77, 77, 77);--sn-notify-shadow-color: transparent;--sn-notify-progress-height: 5px;pointer-events:none;width:100%;max-width:100%;max-height:100vh;min-height:100vh;position:fixed;z-index:9999;top:0;right:0;bottom:0;left:0;display:grid;grid-auto-rows:min-content;align-content:flex-start;grid-gap:var(--sn-notifications-gap);gap:var(--sn-notifications-gap);padding:var(--sn-notifications-padding)}.sn-notifications-container.sn-is-x-center{justify-content:center}.sn-notifications-container.sn-is-y-center{align-content:center;justify-content:flex-end}.sn-notifications-container.sn-is-center{justify-content:center;align-content:center}.sn-notifications-container.sn-is-left{justify-content:flex-start}.sn-notifications-container.sn-is-right{justify-content:flex-end}.sn-notifications-container.sn-is-top{align-content:flex-start}.sn-notifications-container.sn-is-bottom{align-content:flex-end}.sn-notify{pointer-events:auto;transition-timing-function:var(--sn-notify-transition-timing-function);transition-duration:var(--sn-notify-transition-duration);transition-property:transform,opacity;border-radius:var(--sn-notify-radius);background-color:var(--sn-notify-background-color, transparent);border:var(--sn-notify-border-size) var(--sn-notify-border-style) var(--sn-notify-border-color);padding:var(--sn-notify-padding);box-sizing:border-box;display:flex;align-items:center;overflow:hidden;position:relative;text-decoration:none;width:var(--sn-notify-width)}.sn-notify-icon{display:flex;justify-content:center;align-items:center;flex-shrink:0;width:var(--sn-notify-icon-size);height:var(--sn-notify-icon-size);margin-right:.75em;color:var(--sn-notify-icon-color)}.sn-notify-close{position:absolute;right:.75em;top:.75em;-webkit-user-select:none;user-select:none;cursor:pointer;display:flex;justify-content:center;align-items:center;height:var(--sn-notify-close-icon-size);width:var(--sn-notify-close-icon-size);color:var(--sn-notify-close-icon-color)}.sn-notify-title{font-size:1rem;font-weight:600;padding-right:calc(var(--sn-notify-padding) + var(--sn-notify-close-icon-size));color:var(--sn-notify-title-color)}.sn-notify-text{font-size:.875rem;margin-top:.25rem;color:var(--sn-notify-text-color)}.sn-notify-outline{--sn-notify-background-color: rgb(255, 255, 255);--sn-notify-border-color: var(--sn-success-color);box-shadow:0 2px 26px var(--sn-notify-shadow-color)}.sn-notify-outline.sn-notify-success{--sn-notify-border-color: var(--sn-success-color);--sn-notify-icon-color: var(--sn-success-color);--sn-notify-shadow-color: rgba(82, 215, 0, .1)}.sn-notify-outline.sn-notify-error{--sn-notify-border-color: var(--sn-error-color);--sn-notify-icon-color: var(--sn-error-color);--sn-notify-shadow-color: rgba(215, 0, 0, .1)}.sn-notify-outline.sn-notify-warning{--sn-notify-border-color: var(--sn-warning-color);--sn-notify-icon-color: var(--sn-warning-color);--sn-notify-shadow-color: rgba(242, 201, 76, .1)}.sn-notify-outline.sn-notify-info{--sn-notify-border-color: var(--sn-info-color);--sn-notify-icon-color: var(--sn-info-color);--sn-notify-shadow-color: rgba(84, 175, 202, .1)}.sn-notify-outline .sn-notify-title{--sn-notify-title-color: rgb(51, 51, 51)}.sn-notify-outline .sn-notify-text{--sn-notify-text-color: rgb(77, 77, 77)}.sn-notify-outline .sn-notify-close{--sn-notify-close-icon-color: rgb(130, 130, 130)}.sn-notify-filled{--sn-notify-title-color: rgb(51, 51, 51);--sn-notify-text-color: rgb(51, 51, 51);--sn-notify-icon-color: rgb(51, 51, 51);--sn-notify-close-icon-color: rgb(51, 51, 51)}.sn-notify-filled.sn-notify-success{--sn-notify-background-color: var(--sn-success-color)}.sn-notify-filled.sn-notify-error{--sn-notify-background-color: var(--sn-error-color)}.sn-notify-filled.sn-notify-warning{--sn-notify-background-color: var(--sn-warning-color)}.sn-notify-filled.sn-notify-info{--sn-notify-background-color: var(--sn-info-color)}.sn-notify-fade{opacity:0;will-change:opacity}.sn-notify-fade-in{opacity:1}.sn-notify-slide{opacity:0;will-change:opacity,transform;transform:translate3d(var(--sn-notify-x),var(--sn-notify-y),0)}.sn-is-left .sn-notify-slide{--sn-notify-x: -100%;--sn-notify-y: 0}.sn-is-right .sn-notify-slide,.sn-is-y-center:not(.sn-is-left) .sn-notify-slide{--sn-notify-x: 100%;--sn-notify-y: 0}.sn-is-top.sn-is-x-center .sn-notify-slide,.sn-is-x-center .sn-notify-slide{--sn-notify-y: -100%;--sn-notify-x: 0}.sn-is-bottom.sn-is-x-center .sn-notify-slide{--sn-notify-y: 100%;--sn-notify-x: 0}.sn-notify-slide-in{opacity:1;transform:translateZ(0)}.sn-notify-autoclose{padding-bottom:calc(var(--sn-notify-padding) + var(--sn-notify-progress-height))}.sn-notify-autoclose.sn-notify-success{--sn-notify-progress-color: var(--sn-success-progress-color)}.sn-notify-autoclose.sn-notify-error{--sn-notify-progress-color: var(--sn-error-progress-color)}.sn-notify-autoclose.sn-notify-warning{--sn-notify-progress-color: var(--sn-warning-progress-color)}.sn-notify-autoclose.sn-notify-info{--sn-notify-progress-color: var(--sn-info-progress-color)}.sn-notify-autoclose:before{content:"";display:block;position:absolute;left:0;bottom:0;will-change:width;width:100%;height:var(--sn-notify-progress-height);border-radius:0 999px 999px 0;background-color:var(--sn-notify-progress-color);animation:progress var(--sn-notify-autoclose-timeout) linear forwards}.sn-notify-content{padding-right:calc(var(--sn-notify-close-icon-size) + 2px)}@keyframes progress{to{width:0%}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:Open Sans,sans-serif;margin:0;padding:0;background-color:#fff;color:#14171a}.header{display:flex;justify-content:space-between;align-items:center;padding:.7rem 2rem;background-color:#03446a;color:#fff}.logo{height:28px}.nav a{color:#fff;margin:0 1rem;text-decoration:none}.nav a:hover{text-decoration-line:underline;text-decoration-style:double}.hero{display:flex;flex-direction:column;gap:1rem;align-items:center;text-align:center;padding:4rem 2rem;background-color:#bbe8ff;color:#14171a}.sub-heading{font-size:24px}.theme-selector button{margin:.5rem;padding:.5rem 1rem;border-radius:5px;cursor:pointer}.theme-btn{background-color:#03446a;color:#fff;border:none}.selected-theme{border:1.4px solid #03446a;color:#03446a}.selected-theme:hover{border:1.4px solid #1da1f2;color:#fff}.theme-selector button:hover{background-color:#1da1f2}.generate-button{width:max-content;padding:1rem 2rem;background-color:#1da1f2;color:#fff;border:none;border-radius:5px;cursor:pointer;margin-top:10px}.generate-button:hover{background-color:#03446a}.output{padding:2rem;background-color:#fff}.output h2{color:#14171a;margin-bottom:1.5rem}.output .theme-selected{text-align:center!important;font-size:20px;margin-bottom:10px}.output-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.avatar-container,.username-container{display:flex;justify-content:flex-end;gap:1rem}.avatar-border{width:150px;height:150px;border-radius:50%;border:4px solid #1da1f2;padding:5px;box-shadow:0 4px 8px #0000001a}.avatar{width:100%;height:100%;border-radius:50%;object-fit:cover}.username{font-size:1.5rem;font-weight:700;color:#14171a;margin:0}.copy-btn{height:2rem;align-self:end;border:none;cursor:pointer}.toggle-btn{border:none;outline:none;vertical-align:middle;cursor:pointer}.regenerate-button{padding:.75rem 1.5rem;background-color:#1da1f2;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .3s ease}.regenerate-button:hover{background-color:#0e7bb8}.theme-showcase{padding:3rem 2rem;background-color:#f5f8fa;display:flex;flex-direction:column;justify-content:space-around;gap:2rem;align-items:center}.theme-showcase .theme-heading{font-size:32px;text-align:left!important;align-self:start;padding:0 2rem}.theme-cards{display:flex;justify-content:flex-start;gap:1rem;flex-wrap:wrap}.theme-card{display:flex;flex-direction:column;gap:10px;background-color:#fff;padding:1rem;margin:1rem;border-radius:5px;width:250px;text-align:center;border:1.5px solid #a4d8f2}.theme-card button{padding:.5rem 1rem;background-color:#1da1f2;color:#fff;border:none;border-radius:5px;cursor:pointer}.theme-card button:hover{background-color:#03446a}.footer{text-align:center;padding:1rem;background-color:#14171a;color:#fff;margin-top:1rem}.footer-links a{color:#fff;margin:0 1rem;text-decoration:none}.social-icons a{color:#fff;margin:0 .5rem;text-decoration:none}.about{padding:3rem 4rem;background-color:#fff;color:#14171a}.about h2{color:#14171a;margin-bottom:1rem;font-size:32px}.about h3{color:#0e7bb8;margin-top:1.5rem;margin-bottom:1rem}.about p{font-size:1.1rem;line-height:1.6;margin-bottom:1rem}.about ul{list-style-type:square;padding:0}.about ul li{margin:.5rem 0;border-radius:5px}.about ul li::marker{color:#1da1f2}.about .example-desc{margin:0}.examples{margin:12px 0}.examples a{display:inline-block;margin:.5rem;padding:.5rem 1rem;background-color:#1da1f2;color:#fff;text-decoration:none;border-radius:5px}.examples a:hover{background-color:#0e7bb8}.scroll-to-top{position:fixed;bottom:20px;right:20px;z-index:1000}.scroll-button{background-color:#1da1f2;color:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:20px;cursor:pointer;box-shadow:0 2px 5px #0003;transition:background-color .3s ease}.scroll-button:hover{background-color:#0e7bb8}
