*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif}
html,body{width:100%;height:100%;overflow-x:hidden}
body{background:linear-gradient(180deg,#000428,#004e92);color:#fff;min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:20px 15px;position:relative}
body::before{content:'';position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(180deg,#000428,#004e92);z-index:-1}

.panel-overlay{
    position:fixed;inset:0;
    background:rgba(0,0,0,0.6);
    backdrop-filter:blur(3px);
    z-index:1100;
    opacity:0;pointer-events:none;
    transition:opacity 0.3s ease;
}
.panel-overlay.active{opacity:1;pointer-events:all;}

.menu-hamburger{
    position:fixed;top:20px;left:20px;
    display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;
    width:46px;height:46px;
    background:rgba(0,0,0,0.5);
    border:none;border-radius:14px;
    cursor:pointer;padding:0;
    transition:all 0.3s ease;backdrop-filter:blur(12px);
    z-index:1001;
    box-shadow:0 0 0 1.5px rgba(0,255,204,0.45),0 0 18px rgba(0,255,204,0.15);
}
.menu-hamburger:hover{
    background:rgba(0,255,204,0.08);
    box-shadow:0 0 0 1.5px rgba(0,255,204,0.9),0 0 28px rgba(0,255,204,0.45);
    transform:scale(1.07);
}
.menu-hamburger span{
    display:block;height:2px;
    background:linear-gradient(90deg,#00ffcc,#00aaff);
    border-radius:2px;
    transition:all 0.38s cubic-bezier(0.68,-0.55,0.265,1.55);
    transform-origin:center;
    box-shadow:0 0 6px rgba(0,255,204,0.5);
}
.menu-hamburger span:nth-child(1){width:22px;}
.menu-hamburger span:nth-child(2){width:15px;}
.menu-hamburger span:nth-child(3){width:19px;}
.menu-hamburger:hover span:nth-child(2){width:22px;}
.menu-hamburger.active span:nth-child(1){width:20px;transform:translateY(8px) rotate(45deg);}
.menu-hamburger.active span:nth-child(2){opacity:0;transform:scaleX(0);}
.menu-hamburger.active span:nth-child(3){width:20px;transform:translateY(-8px) rotate(-45deg);}

.side-panel{
    position:fixed;top:0;left:0;
    width:272px;height:100%;
    background:rgba(3,8,22,0.97);
    border-right:1px solid rgba(0,255,204,0.18);
    z-index:1200;
    display:flex;flex-direction:column;
    transform:translateX(-100%);
    transition:transform 0.38s cubic-bezier(0.25,0.46,0.45,0.94);
    backdrop-filter:blur(24px);
    box-shadow:8px 0 50px rgba(0,0,0,0.7);
}
.side-panel.open{transform:translateX(0);}

.panel-header{
    padding:20px 18px 16px;
    border-bottom:1px solid rgba(0,255,204,0.1);
    background:linear-gradient(180deg,rgba(0,255,204,0.04) 0%,transparent 100%);
}
.panel-header-top{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:14px;
}
.panel-title-wrap{display:flex;align-items:center;gap:7px;}


.panel-lightning-icon{
    width:22px;height:22px;flex-shrink:0;
    filter:drop-shadow(0 0 5px rgba(255,180,0,0.9)) drop-shadow(0 0 12px rgba(255,80,0,0.6));
    animation:boltPulse 2s ease-in-out infinite;
}
@keyframes boltPulse{
    0%,100%{filter:drop-shadow(0 0 4px rgba(255,200,0,0.8)) drop-shadow(0 0 10px rgba(255,80,0,0.5));transform:scale(1);}
    50%{filter:drop-shadow(0 0 8px rgba(255,220,0,1)) drop-shadow(0 0 20px rgba(255,100,0,0.9));transform:scale(1.08);}
}
.panel-title{
    font-size:0.7rem;font-weight:800;color:#e8f4ff;
    letter-spacing:3.5px;text-transform:uppercase;
}
.panel-close{
    background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);
    color:#555;font-size:1.15rem;width:28px;height:28px;
    border-radius:7px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    transition:all 0.2s;line-height:1;
}
.panel-close:hover{background:rgba(255,70,70,0.12);color:#ff6b6b;border-color:rgba(255,70,70,0.2);}


.panel-visits-row{
    display:flex;align-items:center;gap:10px;
    background:rgba(0,255,204,0.04);
    border:1px solid rgba(0,255,204,0.14);
    border-radius:12px;padding:10px 12px;
}


.eye-wrap{
    width:52px;height:32px;flex-shrink:0;
    position:relative;cursor:default;
}
.eye-svg{width:52px;height:32px;overflow:visible;}


.eyelid-top{
    transform-origin:24px 15px;
    transform:translateY(-13px);
    transition:transform 0s;
}
.eyelid-bot{
    transform-origin:24px 15px;
    transform:translateY(13px);
    transition:transform 0s;
}


@keyframes lidTopClose{
    0%{transform:translateY(-13px);}
    18%{transform:translateY(0px);}
    38%{transform:translateY(0px);}
    100%{transform:translateY(-13px);}
}
@keyframes lidBotClose{
    0%{transform:translateY(13px);}
    18%{transform:translateY(0px);}
    38%{transform:translateY(0px);}
    100%{transform:translateY(13px);}
}
.eye-wrap.blink .eyelid-top{
    animation:lidTopClose 0.55s cubic-bezier(0.25,0.1,0.25,1) forwards;
}
.eye-wrap.blink .eyelid-bot{
    animation:lidBotClose 0.55s cubic-bezier(0.25,0.1,0.25,1) forwards;
}

@keyframes pupilDrift{
    0%,100%{transform:translate(0,0);}
    25%{transform:translate(1px,-0.5px);}
    75%{transform:translate(-1px,0.5px);}
}
.eye-wrap circle:nth-of-type(3){animation:pupilDrift 4s ease-in-out infinite;}


@keyframes eyeGlowPulse{
    0%,100%{opacity:0.5;}50%{opacity:1;}
}
.eye-wrap ellipse:last-of-type{animation:eyeGlowPulse 3s ease-in-out infinite;}

.panel-visits-info{display:flex;flex-direction:column;gap:1px;min-width:0;}
.panel-visits-label{
    font-size:0.6rem;color:rgba(255,255,255,0.35);
    letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap;
}
.panel-visits-count{
    font-size:1.3rem;font-weight:800;color:#00ffcc;
    text-shadow:0 0 12px rgba(0,255,204,0.6);
    line-height:1;letter-spacing:-0.5px;
    transition:transform 0.15s;
}

.panel-visits-count.pop{transform:scale(1.15);}

.panel-body{flex:1;overflow-y:auto;padding:18px;}
.panel-section{margin-bottom:20px;}
.panel-section-label{
    font-size:0.62rem;letter-spacing:2.5px;text-transform:uppercase;
    color:rgba(0,255,204,0.45);font-weight:700;margin-bottom:12px;
    padding-bottom:7px;border-bottom:1px solid rgba(0,255,204,0.08);
}
.panel-categories-placeholder{
    display:flex;flex-direction:column;align-items:center;
    padding:26px 12px;text-align:center;
    background:rgba(0,255,204,0.03);border:1px dashed rgba(0,255,204,0.15);
    border-radius:12px;gap:9px;
}
.cat-soon-icon svg{width:32px;height:32px;fill:rgba(0,255,204,0.3);}
.cat-soon-text{font-size:0.85rem;font-weight:700;color:rgba(0,255,204,0.55);}
.cat-soon-sub{font-size:0.7rem;color:rgba(255,255,255,0.25);line-height:1.5;}

.panel-footer{
    padding:14px 18px 24px;
    border-top:1px solid rgba(0,255,204,0.08);
    display:flex;align-items:center;gap:12px;
}
.panel-footer-label{
    font-size:0.65rem;letter-spacing:1.5px;text-transform:uppercase;
    color:rgba(255,255,255,0.25);font-weight:600;flex:1;
}
.discord-icon-btn{
    width:38px;height:38px;flex-shrink:0;
    background:linear-gradient(135deg,#5865F2,#7289DA);
    border:none;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:all 0.25s ease;
    box-shadow:0 3px 12px rgba(88,101,242,0.4);
}
.discord-icon-btn:hover{transform:scale(1.13) translateY(-1px);box-shadow:0 6px 22px rgba(88,101,242,0.65);}
.discord-icon-btn svg{width:19px;height:19px;fill:#fff;}



.chat-btn{
    position:fixed;bottom:30px;left:30px;
    width:56px;height:56px;
    background:linear-gradient(45deg,#00ffcc,#00d4aa,#00ffcc);
    background-size:200% 200%;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;z-index:1000;
    box-shadow:0 0 25px rgba(0,255,204,0.5),0 0 50px rgba(0,255,204,0.3),0 4px 15px rgba(0,255,204,0.4);
    transition:all 0.3s ease;
    border:2px solid rgba(255,255,255,0.3);
    padding:0;
    animation:pulseChat 3s ease-in-out infinite,gradientShift 4s ease infinite;
    overflow:hidden;
}
@keyframes pulseChat{0%,100%{box-shadow:0 0 25px rgba(0,255,204,0.5),0 0 50px rgba(0,255,204,0.3),0 4px 15px rgba(0,255,204,0.4)}50%{box-shadow:0 0 35px rgba(0,255,204,0.7),0 0 70px rgba(0,255,204,0.5),0 6px 20px rgba(0,255,204,0.6)}}
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.chat-btn::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,0.1),transparent);transform:rotate(45deg);animation:shine 3s linear infinite}
@keyframes shine{0%{transform:translateX(-100%) translateY(-100%) rotate(45deg)}100%{transform:translateX(100%) translateY(100%) rotate(45deg)}}
.chat-btn:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 0 40px rgba(0,255,204,0.8),0 0 80px rgba(0,255,204,0.6),0 8px 25px rgba(0,255,204,0.5);border-color:rgba(255,255,255,0.5)}
.chat-btn svg{width:28px;height:28px;fill:#000;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2))}


.chat-container{
    position:fixed;bottom:100px;left:30px;
    width:350px;height:500px;
    background:rgba(0,0,0,0.95);border-radius:15px;
    box-shadow:0 10px 40px rgba(0,255,204,0.3);
    border:2px solid rgba(0,255,204,0.5);z-index:999;
    display:flex;flex-direction:column;overflow:hidden;backdrop-filter:blur(15px);
    transform:scale(0.8);opacity:0;pointer-events:none;
    transform-origin:bottom left;
    transition:all 0.4s cubic-bezier(0.68,-0.55,0.265,1.55);
}
.chat-container.active{transform:scale(1);opacity:1;pointer-events:auto}
.chat-container.hidden{transform:scale(0.8);opacity:0;pointer-events:none}

.chat-header{background:linear-gradient(45deg,#00ffcc,#00d4aa);padding:15px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}
.chat-header-left{display:flex;align-items:center;gap:10px;flex:1}
.chat-user-icon{width:40px;height:40px;background:white;border-radius:50%;display:flex;align-items:center;justify-content:center}
.chat-user-icon svg{width:24px;height:24px;fill:#00ffcc}
.chat-username{font-weight:600;color:#000;font-size:0.9rem}
.chat-messages{flex:1;overflow-y:auto;padding:15px;background:rgba(0,0,0,0.3)}
.chat-message{padding:10px;border-radius:10px;margin-bottom:10px;animation:slideIn 0.3s ease;position:relative}
@keyframes slideIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.message-header{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.message-actions{margin-left:auto;display:flex;gap:4px;opacity:0;transition:opacity 0.2s}
.chat-message:hover .message-actions{opacity:1}
.msg-action-btn{background:none;border:none;cursor:pointer;font-size:0.9rem;padding:2px 4px;transition:transform 0.2s}
.msg-action-btn:hover{transform:scale(1.2)}
.message-reply-container{background:rgba(0,255,204,0.1);border-left:3px solid #00ffcc;padding:6px 10px;margin-bottom:5px;margin-left:33px;border-radius:5px;cursor:pointer;font-size:0.75rem}
.message-reply-container:hover{background:rgba(0,255,204,0.15)}
.reply-username{color:#00ffcc;font-weight:600;margin-bottom:2px}
.reply-text{color:#999;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:250px}
.chat-reply-preview{background:rgba(0,255,204,0.1);border-left:3px solid #00ffcc;padding:8px;margin-bottom:8px;border-radius:5px;display:none;position:relative}
.chat-reply-preview.active{display:block}
.reply-preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.reply-preview-username{color:#00ffcc;font-weight:600;font-size:0.8rem}
.reply-preview-close{background:none;border:none;color:#ff6b6b;cursor:pointer;font-size:1.2rem;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center}
.reply-preview-text{color:#ddd;font-size:0.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.message-icon{width:25px;height:25px;background:rgba(0,255,204,0.2);border-radius:50%;display:flex;align-items:center;justify-content:center}
.message-icon svg{width:14px;height:14px;fill:#00ffcc}
.message-username{font-weight:bold;color:#00ffcc;font-size:0.85rem}
.message-time{font-size:0.7rem;color:#999;margin-left:auto}
.message-text{color:#ddd;line-height:1.4;word-wrap:break-word;padding-left:33px;font-size:0.85rem}
.message-url{color:#3b82f6;text-decoration:underline;cursor:pointer;transition:all 0.2s}
.message-url:hover{color:#60a5fa}
.message-media-container{margin-top:8px;padding-left:33px}
.message-image-wrapper{position:relative;display:inline-block;max-width:100%;border-radius:8px;overflow:hidden;background:rgba(0,0,0,0.3)}
.message-image{max-width:100%;max-height:150px;display:block;border-radius:8px}
.image-download-btn{position:absolute;top:5px;right:5px;background:rgba(0,255,204,0.9);border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:all 0.3s}
.message-image-wrapper:hover .image-download-btn{opacity:1}
.image-download-btn svg{width:12px;height:12px;fill:#000}
.video-thumb-container{width:180px;height:110px;border-radius:8px;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center;position:relative;border:2px solid rgba(0,255,204,0.5);transition:all 0.3s;cursor:pointer}
.video-thumb-container:hover{border-color:#00ffcc;box-shadow:0 4px 15px rgba(0,255,204,0.4)}
.video-thumb-container.youtube{width:220px;height:130px}
.video-thumb-container.tiktok{width:120px;height:180px}
.video-thumb-container.discord{width:120px;height:180px}
.video-thumb-container.instagram{width:120px;height:180px}
.video-thumb-container.facebook{width:200px;height:120px}
.video-thumb-container iframe{width:100%;height:100%;border:none;pointer-events:none}
.video-thumb-container.controls-active iframe{pointer-events:auto}
.video-thumb-container video{width:100%;height:100%;object-fit:cover}
.video-thumb-container video::-webkit-media-controls{display:flex!important}
.video-thumb-container.controls-active video::-webkit-media-controls{display:flex!important}
.video-maximize-btn{position:absolute;top:5px;right:5px;width:28px;height:28px;background:rgba(0,255,204,0.9);border-radius:5px;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all 0.2s;border:none}
.video-thumb-container.controls-active .video-maximize-btn{display:flex}
.video-maximize-btn:hover{transform:scale(1.1);background:#00ffcc}
.video-maximize-btn svg{width:16px;height:16px;fill:#000}
.video-download-btn{position:absolute;top:5px;left:5px;width:28px;height:28px;background:rgba(0,255,204,0.9);border-radius:5px;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:10;transition:all 0.2s;border:none}
.video-thumb-container.controls-active .video-download-btn{display:flex}
.video-download-btn:hover{transform:scale(1.1);background:#00ffcc}
.video-download-btn svg{width:16px;height:16px;fill:#000}
.video-label{position:absolute;bottom:3px;left:3px;background:rgba(0,0,0,0.8);color:#fff;font-size:0.6rem;padding:2px 5px;border-radius:3px;font-weight:600}
.video-thumb-img{width:100%;height:100%;object-fit:cover}
.video-play-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;background:rgba(0,255,204,0.9);border-radius:50%;display:flex;align-items:center;justify-content:center;pointer-events:none}
.video-play-center svg{width:20px;height:20px;fill:#000;margin-left:3px}
.video-fullscreen-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.95);z-index:10000;display:none;align-items:center;justify-content:center;flex-direction:column}
.video-fullscreen-modal.active{display:flex}
.video-fullscreen-close{position:absolute;top:20px;right:20px;background:rgba(255,255,255,0.2);border:none;color:#fff;font-size:2rem;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s}
.video-fullscreen-close:hover{background:rgba(255,255,255,0.3);transform:scale(1.1)}
.video-fullscreen-content{width:90%;max-width:900px;height:80%;max-height:600px;background:#000;border-radius:15px;overflow:hidden}
.video-fullscreen-content iframe,.video-fullscreen-content video{width:100%;height:100%;border:none}
.game-mention{background:linear-gradient(45deg,#00ffcc,#00d4aa);color:#000;padding:2px 8px;border-radius:5px;font-weight:600;cursor:pointer;display:inline-block;transition:all 0.2s ease}
.game-mention:hover{transform:scale(1.05);box-shadow:0 2px 8px rgba(0,255,204,0.4)}
.user-mention{background:linear-gradient(45deg,#5865F2,#7289DA);color:#fff;padding:2px 8px;border-radius:5px;font-weight:600;cursor:pointer;display:inline-block;transition:all 0.2s ease}
.user-mention:hover{transform:scale(1.05);box-shadow:0 2px 8px rgba(88,101,242,0.4)}
.chat-input-section{padding:12px 15px;background:rgba(0,0,0,0.5);border-top:1px solid rgba(0,255,204,0.3);flex-shrink:0}
.chat-input-container{display:flex;gap:6px;align-items:center}
#chatMessageInput{flex:1;padding:10px 12px;border:2px solid rgba(0,255,204,0.5);border-radius:20px;background:rgba(255,255,255,0.05);color:#fff;font-size:0.85rem;outline:none;min-width:0}
#chatMessageInput::placeholder{color:rgba(255,255,255,0.5)}
#chatSendBtn{background:linear-gradient(45deg,#00ffcc,#00d4aa);color:#000;border:none;padding:10px 18px;border-radius:20px;cursor:pointer;font-weight:600;font-size:0.85rem;transition:all 0.2s ease;white-space:nowrap;flex-shrink:0}
#chatSendBtn:hover{transform:scale(1.05)}
#chatSendBtn:disabled{opacity:0.5;cursor:not-allowed}
#imageInput{display:none}
.image-upload-btn{background:linear-gradient(45deg,#00ffcc,#00d4aa);color:#000;border:none;padding:10px 12px;border-radius:20px;cursor:pointer;font-weight:600;font-size:0.85rem;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;flex-shrink:0}
.image-upload-btn:hover{transform:scale(1.05)}
.image-upload-btn:disabled{opacity:0.5;cursor:not-allowed}
.image-upload-btn svg{width:16px;height:16px;fill:#000;flex-shrink:0}
.suggestions-popup{position:absolute;bottom:100%;left:0;right:0;background:rgba(0,0,0,0.95);border:1px solid rgba(0,255,204,0.5);border-radius:10px;margin-bottom:5px;max-height:180px;overflow-y:auto;z-index:1000;display:none}
.suggestions-popup.active{display:block}
.suggestion-item-chat{padding:10px 15px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.1);transition:background 0.2s;display:flex;justify-content:space-between;align-items:center}
.suggestion-item-chat:hover{background:rgba(0,255,204,0.2)}
.suggestion-item-chat:last-child{border-bottom:none}
.suggestion-icon{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:10px}
.suggestion-icon.game{background:rgba(0,255,204,0.2)}
.suggestion-icon.game svg{fill:#00ffcc}
.suggestion-icon.user{background:rgba(88,101,242,0.2)}
.suggestion-icon.user svg{fill:#7289DA}
.suggestion-icon svg{width:16px;height:16px}
.suggestion-info{flex:1}
.suggestion-name{color:#fff;font-size:0.85rem}
.suggestion-type{color:#999;font-size:0.7rem}
.loading-chat{text-align:center;padding:20px;color:#999;font-size:0.85rem}
.vip-badge{position:absolute;top:10px;right:10px;width:35px;height:35px;background:linear-gradient(45deg,#ffd700,#ffb347);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;box-shadow:0 2px 10px rgba(255,215,0,0.4);transition:all 0.3s ease;border:2px solid rgba(255,255,255,0.3)}
.vip-badge:hover{transform:scale(1.1) rotate(5deg);box-shadow:0 4px 20px rgba(255,215,0,0.6);border-color:rgba(255,255,255,0.6)}
.vip-badge svg{width:20px;height:20px;fill:#333}
.copy-btn{position:absolute;top:10px;left:10px;background:transparent;border:none;cursor:pointer;padding:4px 6px;font-size:0.7rem;font-weight:700;color:#3b82f6;transition:all 0.2s ease;z-index:15;text-shadow:0 1px 3px rgba(0,0,0,0.8)}
.copy-btn:hover{transform:scale(1.1);color:#60a5fa;text-shadow:0 0 8px rgba(59,130,246,0.6)}
h1{font-size:clamp(1.5rem,4vw,3rem);margin-bottom:20px;text-shadow:0 0 15px #00ffcc;animation:neonGlow 1.5s infinite alternate;text-align:center;padding:0 10px}
@keyframes neonGlow{from{text-shadow:0 0 10px #00ffcc}to{text-shadow:0 0 20px #00ffcc,0 0 30px #00ffcc}}
.search-container{width:100%;max-width:400px;margin-bottom:30px;position:relative}
.search-bar{width:100%;padding:12px 15px;border:2px solid #00ffcc;border-radius:25px;background:rgba(255,255,255,0.05);color:#fff;font-size:1rem;outline:none;transition:all 0.3s ease;backdrop-filter:blur(10px)}
.search-bar::placeholder{color:rgba(255,255,255,0.6)}
.search-bar:focus{border-color:#ff00ff;box-shadow:0 0 20px rgba(255,0,255,0.3)}
.search-suggestions{position:absolute;top:100%;left:0;right:0;background:rgba(0,0,0,0.9);border-radius:15px;backdrop-filter:blur(15px);border:1px solid rgba(0,255,204,0.3);max-height:200px;overflow-y:auto;z-index:100;display:none;margin-top:5px}
.suggestion-item{padding:10px 15px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.1);transition:all 0.3s ease;display:flex;justify-content:space-between;align-items:center}
.suggestion-item:hover{background:rgba(0,255,204,0.1)}
.suggestion-acronym{color:#00ffcc;font-weight:600;font-size:0.9rem}
.coverflow-container{width:100%;max-width:1200px;height:500px;position:relative;display:flex;justify-content:center;align-items:center;user-select:none;overflow:visible;margin-bottom:20px;perspective:1500px}
.coverflow-track{position:relative;width:100%;height:100%;transform-style:preserve-3d;touch-action:pan-y pinch-zoom;padding:0 100px}
.script-card{position:absolute;left:50%;top:50%;width:320px;height:450px;background:rgba(255,255,255,0.1);border-radius:20px;padding:20px;text-align:center;box-shadow:0 0 20px rgba(0,255,204,0.4);backdrop-filter:blur(15px);border:1px solid rgba(0,255,204,0.3);transform:translateX(-50%) translateY(-50%);pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;transition:all 0.6s cubic-bezier(0.25,0.46,0.45,0.94)}
.script-card.active{pointer-events:auto;box-shadow:0 0 30px rgba(0,255,204,0.6);border:2px solid rgba(0,255,204,0.5)}
.card-image{width:100%;height:200px;object-fit:cover;border-radius:15px;margin-bottom:15px;background:rgba(255,255,255,0.1)}
.card-content{flex-grow:1;display:flex;flex-direction:column;justify-content:center}
.card-title{font-size:1.5rem;margin-bottom:10px;color:#00ffcc;text-shadow:0 0 10px rgba(0,255,204,0.5)}
.card-description{font-size:0.9rem;color:#ddd;line-height:1.4;margin-bottom:15px}
.button-container{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.btn{flex:1;min-width:130px;padding:12px 20px;background:linear-gradient(45deg,#ff00ff,#00ffcc);color:#000;border:none;border-radius:25px;text-decoration:none;font-weight:600;font-size:0.9rem;cursor:pointer;transition:all 0.3s ease;text-align:center;display:inline-block}
.btn:hover{transform:scale(1.05);box-shadow:0 5px 15px rgba(0,255,204,0.4)}
.navigation{display:flex;gap:20px;margin-bottom:20px}
.nav-btn{width:45px;height:45px;border-radius:50%;background:rgba(255,255,255,0.1);border:2px solid #00ffcc;color:#00ffcc;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s}
.nav-btn:hover{background:rgba(0,255,204,0.2);transform:scale(1.1)}
.indicators{display:flex;gap:8px;margin-bottom:20px}
.indicator{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.3);cursor:pointer;transition:all 0.3s}
.indicator.active{background:#00ffcc;transform:scale(1.2)}
.footer{text-align:center;color:rgba(255,255,255,0.6);font-size:0.8rem;margin-top:auto;padding:20px}

@media(max-width:768px){
    .menu-hamburger{top:15px;left:15px;width:42px;height:42px;}
    .side-panel{width:250px;}
    .chat-btn{width:50px;height:50px;bottom:20px;left:20px;}
    .chat-btn svg{width:26px;height:26px;}
    .chat-container{width:90%;height:70vh;left:5%;bottom:80px;}
    .coverflow-container{max-width:90%;height:450px;}
    .script-card{width:280px;height:400px;padding:18px;}
    .card-image{height:160px;}
    .card-title{font-size:1.3rem;}
    .card-description{font-size:0.85rem;}
    .btn{min-width:110px;font-size:0.8rem;padding:10px 15px;}
    .coverflow-track{padding:0 50px;}
}
@media(max-width:480px){
    body{padding:15px 5px;}
    .menu-hamburger{top:10px;left:10px;width:38px;height:38px;}
    .side-panel{width:80vw;}
    .panel-visits-count{font-size:1.1rem;}
    .eye-wrap,.eye-svg{width:44px;height:28px;}
    .chat-btn{width:46px;height:46px;bottom:15px;left:15px;}
    .chat-btn svg{width:24px;height:24px;}
    .chat-container{width:92%;left:4%;bottom:72px;}
    .search-container{max-width:95%;}
    .coverflow-container{max-width:95%;height:400px;}
    .script-card{width:240px;height:360px;padding:15px;}
    .card-image{height:140px;}
    .card-title{font-size:1.1rem;}
    .card-description{font-size:0.8rem;margin-bottom:10px;}
    .btn{min-width:90px;font-size:0.75rem;padding:8px 12px;}
    .nav-btn{width:40px;height:40px;font-size:1rem;}
    .coverflow-track{padding:0 30px;}
}
