@import "https://fonts.googleapis.com/css2?family=Comic+Neue:wght@400;700&family=Fredoka+One&display=swap";
:root{--icarly-blue:#384c8b;--icarly-green:#a6cc3a;--icarly-purple:#62166f;--icarly-purple-light:#8b2f9b;--icarly-orange:#f5a623;--icarly-pink:#e91e8c;--icarly-magenta:#c71585;--icarly-yellow:gold}*{box-sizing:border-box;margin:0;padding:0}html{font-size:14px}body{background-color:var(--icarly-blue);min-height:100vh;font-family:Comic Neue,cursive;overflow-x:hidden}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes wiggle{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes glow{0%,to{box-shadow:0 0 5px gold}50%{box-shadow:0 0 15px gold,0 0 30px gold}}.icarly-container{max-width:1400px;margin:0 auto;position:relative}.icarly-header{background:linear-gradient(#4a5a8a 0%,#7ba05b 40%,#a6cc3a 100%);border:4px solid #fff;border-bottom:none;grid-template:"homepage homepage rightcol""logo search rightcol"1fr"date search rightcol"/320px 1fr 220px;gap:15px 30px;min-height:280px;padding:15px 250px 25px 30px;display:grid;position:relative;box-shadow:0 0 20px #0000004d}.homepage-btn{color:#fff;cursor:pointer;z-index:20;background:#000;border:3px solid #fff;grid-area:homepage;justify-self:center;align-items:center;gap:8px;margin-bottom:10px;padding:8px 20px;font-size:16px;font-weight:700;text-decoration:none;animation:2s infinite glow;display:flex;box-shadow:4px 4px #0000004d}.homepage-btn:hover{animation:.3s ease-in-out wiggle}.homepage-btn:before{content:"✦";color:var(--icarly-green);animation:3s linear infinite spin}.icarly-logo{background:var(--icarly-magenta);z-index:10;border:4px solid #fff;grid-area:logo;justify-content:center;place-self:start;align-items:center;padding:20px 40px;display:flex;transform:rotate(-3deg);box-shadow:6px 6px #0000004d}.icarly-logo:hover{animation:.3s ease-in-out wiggle}.icarly-logo img{object-fit:contain;width:auto;height:90px}.date-display{color:#fff;text-shadow:2px 2px #0000004d;z-index:5;grid-area:date;align-self:end;font-size:18px;font-weight:700}.lemon-tube{color:tomato;text-shadow:2px 2px #fff;margin-top:5px;font-size:24px;font-weight:700}.search-section{text-align:center;z-index:5;grid-area:search;place-self:center}.search-label{color:#fff;text-shadow:2px 2px #0000004d;margin-bottom:12px;font-size:28px;font-weight:700;animation:4s ease-in-out infinite float}.search-box{align-items:center;gap:12px;display:flex}.search-input{border:3px solid #fff;outline:none;width:280px;padding:10px 20px;font-family:Comic Neue,cursive;font-size:18px;box-shadow:4px 4px #0003}.search-input:focus{box-shadow:6px 6px #0000004d}.search-btn{cursor:pointer;background:#fff;border:3px solid #000;justify-content:center;align-items:center;width:45px;height:45px;font-size:20px;animation:3s ease-in-out infinite float;display:flex;box-shadow:4px 4px #0000004d}.search-btn:hover{transform:scale(1.1)rotate(10deg)}.header-right-column{flex-direction:column;grid-area:rightcol;align-items:center;gap:15px;padding-top:10px;display:flex}.character-image{background:#fff;border:5px solid #fff;width:200px;height:200px;animation:5s ease-in-out infinite float;overflow:hidden;box-shadow:6px 6px #0000004d}.header-buttons{flex-direction:column;align-items:center;gap:10px;width:100%;display:flex}.header-btn{text-align:center;cursor:pointer;border:3px solid #fff;width:180px;padding:10px 15px;font-weight:700;line-height:1.3;text-decoration:none;transition:transform .2s;display:block}.header-btn:hover{transform:translateY(-3px);box-shadow:0 6px #0003}.login-header-btn{color:#fff;background:linear-gradient(#666 0%,#333 100%);font-size:16px}.info-header-btn{color:#fff;background:#ff6b6b;font-size:13px}.info-header-btn .btn-highlight{color:gold}.feedback-header-btn{color:#fff;background:#f44;font-size:14px}.feedback-header-btn small{color:gold;margin-top:2px;font-size:11px;display:block}.character-image{z-index:10;background:#fff;border:6px solid #fff;width:200px;height:200px;animation:5s ease-in-out infinite float;position:absolute;top:15px;right:20px;overflow:hidden;box-shadow:8px 8px #0000004d}.character-image:hover{animation:.3s ease-in-out wiggle}.character-image img{object-fit:cover;width:100%;height:100%}.fun-label{border:3px solid #fff;animation:3s ease-in-out infinite float}.fun-label:hover{animation:.3s ease-in-out wiggle}.nav-tabs{background:linear-gradient(#a6cc3a 0%,#7ba03a 100%);border-left:4px solid #fff;border-right:4px solid #fff;justify-content:center;gap:0;padding:10px 20px 0;display:flex;position:relative}.you-are-here{color:#fff;z-index:100;white-space:nowrap;background:#ff6b6b;border:3px solid #fff;padding:8px 20px;font-size:14px;font-weight:700;animation:2s ease-in-out infinite float;position:absolute;top:-40px;left:50%;transform:translate(-50%);box-shadow:4px 4px #0000004d}.nav-tab{color:#fff;text-transform:uppercase;cursor:pointer;text-shadow:1px 1px #00000080;background:linear-gradient(#9b59b6 0%,#7b3f8c 50%,#62166f 100%);border:3px solid #fff;border-bottom:none;align-items:center;gap:6px;padding:15px 20px;font-family:Comic Neue,cursive;font-size:14px;font-weight:700;text-decoration:none;display:flex;position:relative;top:4px;box-shadow:inset 0 2px 5px #ffffff4d,0 -3px 10px #0003}.nav-tab:first-child{border-radius:15px 0 0}.nav-tab:last-child{border-radius:0 15px 0 0}.nav-tab:hover{background:linear-gradient(#b069c6 0%,#9b4f9c 50%,#82267f 100%);top:2px}.nav-tab.active{color:#62166f;text-shadow:none;background:linear-gradient(#fff 0%,#f0f0f0 100%);padding-bottom:19px;top:0;box-shadow:inset 0 2px 5px #fff,0 -5px 15px #0000001a}.nav-tab-icon{font-size:16px}.content-area{background:var(--icarly-orange);border:4px solid #fff;border-top:none;min-height:500px;padding:50px;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000004d}.decorative-circles{pointer-events:none;position:absolute;inset:0}.circle{background:#90ee90;border:6px solid #7cfc00;border-radius:50%;animation:4s ease-in-out infinite float;position:absolute}.circle-1{width:100px;height:100px;animation-delay:0s;top:15%;left:8%}.circle-2{width:60px;height:60px;animation-delay:.5s;top:35%;left:22%}.circle-3{width:75px;height:75px;animation-delay:1s;top:55%;left:12%}.circle-4{width:85px;height:85px;animation-delay:1.5s;top:25%;right:18%}.circle-5{width:55px;height:55px;animation-delay:2s;top:45%;right:28%}.circle-6{width:70px;height:70px;animation-delay:2.5s;top:65%;right:12%}.circle-7{width:50px;height:50px;animation-delay:3s;top:10%;left:38%}.circle-8{width:80px;height:80px;animation-delay:3.5s;top:70%;left:32%}.video-grid{z-index:1;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:25px;display:grid;position:relative}.loading-message,.error-message{text-align:center;background:#fff;border:4px solid #62166f;padding:60px 20px;box-shadow:6px 6px #0003}.loading-message p{color:#62166f;margin-top:20px;font-size:24px;font-weight:700}.loading-spinner{border:5px solid #ddd;border-top-color:#e91e8c;border-radius:50%;width:50px;height:50px;margin:0 auto;animation:1s linear infinite spin}.error-message{background:#ffe6e6;border-color:#c71585}.error-message h3{color:#c71585;margin-bottom:10px;font-family:Fredoka One,cursive;font-size:32px}.error-message p{color:#62166f;font-size:18px}.video-card{cursor:pointer;background:#fff;border:4px solid #62166f;transition:all .2s;overflow:hidden;box-shadow:6px 6px #0003}.video-card:hover{transform:translate(-3px,-3px);box-shadow:9px 9px #0000004d}.video-thumbnail{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-bottom:4px solid #62166f;padding-top:56.25%;position:relative}.video-thumbnail img{object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.play-overlay{color:#e91e8c;background:#ffffffe6;border:4px solid #e91e8c;justify-content:center;align-items:center;width:70px;height:70px;font-size:28px;transition:all .2s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.video-card:hover .play-overlay{transform:translate(-50%,-50%)scale(1.1)}.duration-badge{color:#fff;background:#000c;border:2px solid #fff;padding:4px 10px;font-size:14px;font-weight:700;position:absolute;bottom:12px;right:12px}.video-info{padding:18px}.video-title{color:#333;margin-bottom:10px;font-size:18px;font-weight:700;line-height:1.3}.video-creator{color:#62166f;font-size:16px;font-weight:700}.blog-posts-container{z-index:1;max-width:800px;margin:0 auto;position:relative}.blog-post{background:#fff;border:4px solid #62166f;margin-bottom:25px;padding:25px;transition:all .2s;box-shadow:6px 6px #0003}.blog-post:hover{transform:translate(-2px,-2px);box-shadow:8px 8px #00000040}.blog-post-header{align-items:center;gap:15px;margin-bottom:15px;display:flex}.profile-pic-weird{background:#a6cc3a;border:4px solid #62166f;width:60px;height:60px;transition:all .2s;overflow:hidden}.profile-pic-weird:hover{transform:scale(1.1)}.profile-pic-weird img{object-fit:cover;width:100%;height:100%}.blog-post-author{color:#62166f;font-size:18px;font-weight:700}.blog-post-date{color:#666;font-size:14px}.blog-post-content{color:#333;margin-bottom:15px;font-size:17px;line-height:1.6}.blog-post-content a{color:#62166f;text-decoration:underline}.thread-indicator{color:#fff;background:linear-gradient(135deg,#a6cc3a,#62166f);border:3px solid #fff;margin-bottom:10px;padding:8px 15px;font-size:14px;font-weight:700;display:inline-block;box-shadow:3px 3px #0003}.repost-badge{color:#fff;background:#62166f;border:2px solid #fff;margin-bottom:10px;padding:5px 12px;font-size:13px;font-weight:700;display:inline-block;box-shadow:2px 2px #0003}.snaps-grid{z-index:1;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:25px;display:grid;position:relative}.snap-item{aspect-ratio:1;cursor:pointer;background:#fff;border:4px solid #62166f;transition:all .2s;overflow:hidden;box-shadow:5px 5px #0003}.snap-item:nth-child(4n+1){border-radius:0}.snap-item:nth-child(4n+2){border-radius:50%}.snap-item:nth-child(4n+3){border-radius:0;transform:rotate(3deg)}.snap-item:nth-child(4n+4){border-radius:0;transform:rotate(-3deg)}.snap-item:hover{z-index:10;box-shadow:8px 8px #0000004d;transform:scale(1.08)!important}.snap-item img{object-fit:cover;width:100%;height:100%;transition:all .2s}.snap-item:hover img{transform:scale(1.1)}.random-play-container{z-index:1;flex-direction:column;justify-content:center;align-items:center;min-height:400px;display:flex;position:relative}.random-play-btn{color:#fff;cursor:pointer;text-shadow:2px 2px #0000004d;background:linear-gradient(#9b59b6 0%,#62166f 100%);border:5px solid #fff;padding:50px 90px;font-family:Comic Neue,cursive;font-size:36px;font-weight:700;animation:4s ease-in-out infinite float;box-shadow:8px 8px #0000004d}.random-play-btn:hover{animation:none;transform:scale(1.05);box-shadow:10px 10px #0006}.random-play-btn:active{transform:scale(.98);box-shadow:4px 4px #0000004d}.site-footer{background:linear-gradient(#62166f 0%,#42164f 100%);border:4px solid #fff;border-top:none;margin-top:0;padding:40px;box-shadow:0 10px 30px #0000004d}.footer-content{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;max-width:1200px;margin:0 auto;display:grid}.footer-links h4,.footer-info h4,.footer-credits h4{color:gold;border-bottom:3px dashed #a6cc3a;margin-bottom:15px;padding-bottom:10px;font-size:20px}.footer-links a,.footer-info p,.footer-credits p{color:#fff;margin-bottom:10px;font-size:16px;text-decoration:none;display:block}.footer-links a:hover{color:#a6cc3a}.floating-star{animation:4s ease-in-out infinite float}@media (max-width:768px){html{font-size:12px}.icarly-container{padding:0 10px}.icarly-header{min-height:auto;padding:15px}.homepage-btn{margin-bottom:10px;padding:6px 15px;font-size:14px;display:inline-block;position:relative;top:auto;left:auto;transform:none}.icarly-logo{text-align:center;margin:10px 0;display:block;position:relative!important;top:auto!important;left:auto!important}.date-display{text-align:center;margin:10px 0;font-size:14px;position:relative!important;top:auto!important;right:auto!important}.search-section{width:100%;max-width:none;margin:10px 0;position:relative!important;top:auto!important;right:auto!important}.search-box{flex-direction:row}.search-input{font-size:16px}.login-btn{margin:5px;padding:8px 20px;font-size:14px;display:inline-block;position:relative!important;top:auto!important;right:auto!important}.info-btn,.feedback-btn{margin:5px;padding:10px 15px;font-size:12px;display:inline-block;position:relative!important;bottom:auto!important;right:auto!important}.character-image{width:120px;height:120px;margin:10px auto;position:relative!important;bottom:auto!important;right:auto!important}.nav-tabs{flex-wrap:wrap;gap:5px;padding:5px}.nav-tab{text-align:center;flex:calc(25% - 10px);min-width:80px;padding:10px 15px;font-size:14px}.nav-tab-icon{margin:0 auto 3px;font-size:18px;display:block}.you-are-here{display:none}.content-area{min-height:auto;padding:20px 15px}.video-grid{grid-template-columns:1fr;gap:15px}.video-card{border-width:3px}.video-info{padding:15px}.video-title{font-size:16px}.site-footer{padding:20px 15px}.footer-content{text-align:center;grid-template-columns:1fr;gap:20px}button,.nav-tab,.homepage-btn,.login-btn,.video-card,.random-play-btn{touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-height:44px}.decorative-circles{display:none}.fun-label{padding:8px 15px!important;font-size:14px!important}.fun-label[style*="top: 30px"]{margin-bottom:10px;display:inline-block;position:relative!important;top:auto!important;right:auto!important}.content-area>div[style*="maxWidth: 1000px"]{padding:0 10px}}@media (max-width:480px){.nav-tab{flex:calc(33.333% - 10px);padding:8px 10px;font-size:12px}.nav-tab-icon{font-size:16px}.random-play-btn{padding:30px 50px;font-size:24px}.search-btn{padding:10px 20px}}@media (hover:none) and (pointer:coarse){.video-card:hover{transform:none}.video-card:active{transform:scale(.98)}.nav-tab:hover{transform:none}.nav-tab:active{transform:translateY(2px)}.random-play-btn:hover{animation:4s ease-in-out infinite float;transform:none}.random-play-btn:active{transform:scale(.95)}}@supports (-webkit-touch-callout:none){.video-thumbnail,.snap-item,.video-card{transform:translateZ(0)}input,button{-webkit-appearance:none;border-radius:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
