:root{--primary: #0066FF;--primary-dark: #004499;--primary-light: #3385FF;--accent: #FF6B35;--accent-hover: #FF8255;--text: #333333;--text-light: #666666;--text-lighter: #999999;--bg-white: #FFFFFF;--bg-light: #F8FAFC;--bg-lighter: #F1F5F9;--border: #E2E8F0;--shadow: 0 4px 20px rgba(0, 102, 255, .1);--shadow-hover: 0 8px 30px rgba(0, 102, 255, .2);--radius: 12px;--radius-sm: 8px;--transition: all .3s ease}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Noto Sans SC,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6;color:var(--text);background-color:var(--bg-white);min-height:100vh}.app{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1}a{color:inherit;text-decoration:none}ul{list-style:none}img{max-width:100%;height:auto}button{cursor:pointer;border:none;background:none;font-family:inherit}input,textarea{font-family:inherit;font-size:inherit}.container{max-width:1200px;margin:0 auto;padding:0 20px}.section{padding:80px 0}.section-title{text-align:center;margin-bottom:60px}.section-title h2{font-size:36px;font-weight:700;color:var(--text);margin-bottom:16px}.section-title p{font-size:18px;color:var(--text-light)}.section-title .highlight{color:var(--primary)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 32px;font-size:16px;font-weight:500;border-radius:var(--radius);transition:var(--transition);cursor:pointer}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-hover)}.btn-outline{border:2px solid var(--primary);color:var(--primary);background:transparent}.btn-outline:hover{background:var(--primary);color:#fff}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{background:var(--accent-hover);transform:translateY(-2px)}@media (max-width: 768px){.section{padding:60px 0}.section-title h2{font-size:28px}.section-title p{font-size:16px}.container{padding:0 16px}.btn{padding:12px 24px;font-size:14px}}@media (max-width: 480px){.section{padding:40px 0}.section-title h2{font-size:24px}.section-title{margin-bottom:40px}.btn{padding:10px 20px;font-size:13px}}.header{position:fixed;top:0;left:0;right:0;z-index:1000;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:var(--transition)}.header.scrolled{box-shadow:0 2px 20px #00000014}.header-container{max-width:1200px;margin:0 auto;padding:16px 20px;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:10px}.logo-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;font-weight:700}.logo-text{font-size:22px;font-weight:700;color:var(--text)}.nav{display:flex;align-items:center;gap:8px}.nav-link{padding:10px 20px;font-size:15px;font-weight:500;color:var(--text-light);border-radius:var(--radius-sm);transition:var(--transition)}.nav-link:hover{color:var(--primary);background:#0066ff0d}.nav-link.active{color:var(--primary);background:#0066ff1a}.header-actions{display:flex;align-items:center;gap:20px}.phone-link{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--primary)}.phone-icon{font-size:16px;margin-right:6px}.menu-toggle{display:none;flex-direction:column;gap:5px;padding:8px}.menu-toggle span{width:24px;height:2px;background:var(--text);border-radius:2px;transition:var(--transition)}.mobile-menu{display:none;padding:0 20px 20px;background:#fff;border-top:1px solid var(--border)}.mobile-nav-link{display:block;padding:16px 0;font-size:16px;font-weight:500;color:var(--text);border-bottom:1px solid var(--border)}.mobile-nav-link.active{color:var(--primary)}.mobile-phone{display:block;padding:16px 0;font-size:16px;font-weight:500;color:var(--primary);text-align:center}@media (max-width: 768px){.nav{display:none}.nav.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;padding:20px;box-shadow:var(--shadow)}.menu-toggle{display:flex}.menu-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.menu-toggle.open span:nth-child(2){opacity:0}.menu-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}.mobile-menu{display:block}.phone-link span:last-child{display:none}.logo-text{font-size:18px}.logo-icon{width:32px;height:32px;font-size:16px}.header-container{padding:12px 16px}}.footer{background:linear-gradient(180deg,#0f172a,#1e293b);color:#fff;padding-top:60px}.footer-container{max-width:1200px;margin:0 auto;padding:0 20px}.footer-main{display:grid;grid-template-columns:1.5fr 2fr;gap:60px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}.footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:20px}.footer-logo .logo-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;font-weight:700}.footer-logo .logo-text{font-size:22px;font-weight:700;color:#fff}.footer-desc{color:#ffffffb3;font-size:14px;line-height:1.8;margin-bottom:24px}.footer-contact{display:flex;flex-direction:column;gap:12px}.contact-item{display:flex;align-items:center;gap:10px;color:#fffc;font-size:14px}.contact-icon{font-size:16px;color:var(--primary, #0066FF)}.footer-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.footer-col h4{font-size:16px;font-weight:600;margin-bottom:20px;color:#fff}.footer-col ul{display:flex;flex-direction:column;gap:12px}.footer-col a{color:#ffffffb3;font-size:14px;transition:var(--transition)}.footer-col a:hover{color:var(--primary-light)}.social-links{display:flex;gap:12px}.social-link{width:40px;height:40px;background:#ffffff1a;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;transition:var(--transition)}.social-link:hover{background:var(--primary);transform:translateY(-2px)}.footer-bottom{padding:20px 0;display:flex;justify-content:center;gap:8px;color:#ffffff80;font-size:13px}@media (max-width: 768px){.footer-main{grid-template-columns:1fr;gap:40px}.footer-nav{grid-template-columns:repeat(2,1fr)}.footer-col:last-child{grid-column:span 2}}@media (max-width: 480px){.footer-nav{grid-template-columns:1fr}.footer-col:last-child{grid-column:span 1}}.hero{position:relative;background:linear-gradient(135deg,#0f0f23,#1a1a3e);min-height:700px;display:flex;align-items:center;overflow:hidden}.hero-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.hero-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 30% 50%,rgba(0,102,255,.15) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(0,212,255,.1) 0%,transparent 40%)}.hero-pattern{position:absolute;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}.hero-content{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:100px 20px}.hero-badge{display:inline-block;padding:8px 20px;background:#0066ff26;border:1px solid rgba(0,102,255,.3);border-radius:50px;color:#00d4ff;font-size:14px;font-weight:500;margin-bottom:24px}.hero-title{font-size:56px;font-weight:800;color:#fff;line-height:1.2;margin-bottom:24px}.hero-title .highlight{background:linear-gradient(135deg,#00d4ff,#06f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-desc{font-size:18px;color:#ffffffb3;line-height:1.8;margin-bottom:40px;max-width:500px}.hero-actions{display:flex;gap:16px}.hero-visual{position:relative;height:400px}.visual-card{position:absolute;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:20px 28px;display:flex;align-items:center;gap:12px;color:#fff;font-weight:500}.visual-card .card-icon{font-size:28px;display:inline-flex;align-items:center;justify-content:center}.card-1{top:20px;left:0;animation:float 6s ease-in-out infinite}.card-2{top:140px;right:20px;animation:float 6s ease-in-out infinite 1s}.card-3{bottom:40px;left:60px;animation:float 6s ease-in-out infinite 2s}.visual-circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:280px;height:280px;border:2px dashed rgba(0,212,255,.3);border-radius:50%;animation:rotate 30s linear infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.advantages-bar{background:#0003;padding:30px 0;position:relative;z-index:1}.advantages-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}.advantage-item{text-align:center}.advantage-num{display:block;font-size:42px;font-weight:800;color:#00d4ff;margin-bottom:8px}.advantage-label{font-size:16px;color:#ffffffb3}.services-section{background:var(--bg-white)}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.service-card{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);padding:40px 30px;transition:var(--transition)}.service-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover);border-color:var(--primary)}.service-icon{font-size:48px;margin-bottom:20px;color:var(--primary)}.service-card h3{font-size:22px;font-weight:600;margin-bottom:12px;color:var(--text)}.service-card>p{color:var(--text-light);margin-bottom:20px;line-height:1.7}.service-features{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.service-features li{padding:6px 14px;background:var(--bg-lighter);border-radius:50px;font-size:13px;color:var(--text-light)}.service-link{color:var(--primary);font-weight:500;transition:var(--transition)}.service-link:hover{color:var(--primary-dark)}.process-section{background:var(--bg-light)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;position:relative}.process-step{text-align:center;padding:30px 20px;position:relative}.step-num{display:inline-block;width:60px;height:60px;line-height:60px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 100%);border-radius:50%;color:#fff;font-size:20px;font-weight:700;margin-bottom:20px}.process-step h3{font-size:20px;font-weight:600;margin-bottom:12px;color:var(--text)}.process-step p{color:var(--text-light);line-height:1.6}.step-arrow{position:absolute;right:-20px;top:50%;transform:translateY(-30px);color:var(--primary);font-size:24px;opacity:.5}.cases-section{background:var(--bg-white)}.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.case-card{background:var(--bg-white);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);transition:var(--transition)}.case-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover)}.case-image{height:160px;overflow:hidden}.case-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.case-card:hover .case-image img{transform:scale(1.05)}.case-content{padding:30px}.case-category{display:inline-block;padding:6px 14px;background:var(--case-color, var(--primary));color:#fff;border-radius:50px;font-size:12px;font-weight:500;margin-bottom:16px}.case-card h3{font-size:20px;font-weight:600;margin-bottom:12px;color:var(--text)}.case-card p{color:var(--text-light);line-height:1.7}.case-hover{padding:0 30px 30px}.cases-more{text-align:center;margin-top:50px}.cta-section{background:linear-gradient(135deg,#0f0f23,#1a1a3e);padding:100px 0}.cta-content{text-align:center}.cta-content h2{font-size:40px;font-weight:700;color:#fff;margin-bottom:16px}.cta-content p{font-size:18px;color:#ffffffb3;margin-bottom:32px}@media (max-width: 1024px){.hero-content{grid-template-columns:1fr;text-align:center}.hero-desc{margin:0 auto 40px}.hero-actions{justify-content:center}.hero-visual{display:none}.advantages-grid,.services-grid,.process-grid{grid-template-columns:repeat(2,1fr)}.step-arrow{display:none}.cases-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.hero{min-height:auto;padding:100px 0 60px}.hero-title{font-size:32px}.hero-badge{font-size:12px;padding:6px 16px}.hero-desc{font-size:16px}.hero-actions{flex-direction:column;gap:12px}.hero-actions .btn{width:100%}.advantages-grid{grid-template-columns:repeat(2,1fr);gap:16px}.advantage-num{font-size:28px}.advantage-label{font-size:13px}.advantages-bar{padding:20px 0}.services-grid,.process-grid,.cases-grid{grid-template-columns:1fr}.service-card,.case-card,.process-step{padding:24px 20px}.cta-section{padding:60px 0}.cta-content h2{font-size:28px}.cta-content p{font-size:16px}}@media (max-width: 480px){.hero-title{font-size:26px}.hero-badge{font-size:11px}.advantage-item{padding:10px 0}.advantage-num,.cta-content h2{font-size:24px}}.page-header{background:linear-gradient(135deg,#0f0f23,#1a1a3e);padding:80px 0 60px;text-align:center;position:relative}.page-header:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}.page-header h1{font-size:48px;font-weight:700;color:#fff;margin-bottom:16px;position:relative}.page-header p{font-size:18px;color:#ffffffb3;position:relative}.page-header .highlight{background:linear-gradient(135deg,#00d4ff,#06f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.services-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.service-detail-card{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);padding:40px;transition:var(--transition)}.service-detail-card:hover{box-shadow:var(--shadow);border-color:var(--primary)}.service-detail-icon{font-size:56px;margin-bottom:20px;color:var(--primary)}.service-detail-card h3{font-size:24px;font-weight:600;margin-bottom:16px;color:var(--text)}.service-detail-desc{color:var(--text-light);margin-bottom:16px;line-height:1.7}.service-detail-text{color:var(--text);margin-bottom:20px;line-height:1.8;padding:16px;background:var(--bg-light);border-radius:var(--radius-sm)}.service-detail-features{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}.service-detail-features li{padding:8px 16px;background:linear-gradient(135deg,#0066ff1a,#00d4ff1a);border-radius:50px;font-size:14px;color:var(--primary);font-weight:500}@media (max-width: 768px){.page-header{padding:100px 0 40px}.page-header h1{font-size:32px}.page-header p{font-size:16px}.services-detail-grid{grid-template-columns:1fr;gap:20px}.service-detail-card{padding:24px 20px}.service-detail-icon{font-size:40px}.service-detail-card h3{font-size:20px}.service-detail-features li{font-size:12px;padding:6px 12px}}.cases-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.case-detail-card{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:var(--transition)}.case-detail-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}.case-detail-image{height:200px;overflow:hidden}.case-detail-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.case-detail-card:hover .case-detail-image img{transform:scale(1.05)}.case-detail-content{padding:30px}.case-detail-category{display:inline-block;padding:6px 14px;background:var(--case-color, var(--primary));color:#fff;border-radius:50px;font-size:12px;font-weight:500;margin-bottom:16px}.case-detail-card h3{font-size:22px;font-weight:600;margin-bottom:12px;color:var(--text)}.case-detail-client{color:var(--text-light);margin-bottom:12px;font-size:14px}.case-detail-desc{color:var(--text);line-height:1.7;margin-bottom:20px}.case-detail-tech{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.tech-tag{padding:6px 12px;background:var(--bg-lighter);border-radius:50px;font-size:12px;color:var(--text-light)}@media (max-width: 768px){.page-header{padding:100px 0 40px}.page-header h1{font-size:32px}.cases-detail-grid{grid-template-columns:1fr;gap:20px}.case-detail-image{height:160px}.case-detail-content{padding:20px}.case-detail-card h3{font-size:18px}.case-detail-category,.tech-tag{font-size:11px;padding:4px 10px}}.about-intro{background:var(--bg-white)}.about-intro-content{max-width:800px;margin:0 auto;text-align:center}.about-intro-content h2{font-size:36px;font-weight:700;margin-bottom:24px;color:var(--text)}.about-intro-content p{font-size:18px;color:var(--text-light);line-height:1.8;margin-bottom:20px}.about-team{background:var(--bg-light)}.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.team-card{background:var(--bg-white);border-radius:var(--radius);padding:40px 24px;text-align:center;transition:var(--transition);border:1px solid var(--border)}.team-card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}.team-avatar{width:80px;height:80px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:#fff;font-size:28px;font-weight:700}.team-card h3{font-size:20px;font-weight:600;margin-bottom:8px;color:var(--text)}.team-position{color:var(--primary);font-weight:500;margin-bottom:12px}.team-desc{color:var(--text-light);font-size:14px}.about-timeline{background:var(--bg-white)}.timeline{max-width:800px;margin:0 auto;position:relative}.timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--border);transform:translate(-50%)}.timeline-item{display:flex;align-items:center;margin-bottom:40px;position:relative}.timeline-item:nth-child(odd){flex-direction:row-reverse}.timeline-item:nth-child(odd) .timeline-content{text-align:right;padding-right:60px;padding-left:0}.timeline-item:nth-child(2n) .timeline-content{padding-left:60px}.timeline-year{position:absolute;left:50%;transform:translate(-50%);background:var(--primary);color:#fff;padding:8px 20px;border-radius:50px;font-weight:600;font-size:14px;z-index:1}.timeline-content{flex:1}.timeline-content h3{font-size:20px;font-weight:600;margin-bottom:8px;color:var(--text)}.timeline-content p{color:var(--text-light)}@media (max-width: 768px){.page-header{padding:100px 0 40px}.page-header h1{font-size:32px}.about-intro-content h2{font-size:28px}.about-intro-content p{font-size:16px;text-align:left}.team-grid{grid-template-columns:repeat(2,1fr);gap:16px}.team-card{padding:24px 16px}.team-avatar{width:60px;height:60px;font-size:22px}.team-card h3{font-size:16px}.team-position{font-size:13px}.team-desc{font-size:12px}.timeline:before{left:20px}.timeline-item,.timeline-item:nth-child(odd){flex-direction:column;align-items:flex-start;padding-left:50px;margin-bottom:30px}.timeline-item:nth-child(odd) .timeline-content,.timeline-item:nth-child(2n) .timeline-content{text-align:left;padding-left:0;padding-right:0}.timeline-year{left:20px;transform:translate(-50%);padding:6px 16px;font-size:12px}.timeline-content h3{font-size:16px}.timeline-content p{font-size:14px}}.contact-section{background:var(--bg-white)}.contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:60px}.contact-info h2{font-size:32px;font-weight:700;margin-bottom:40px;color:var(--text)}.contact-item{display:flex;gap:20px;margin-bottom:30px}.contact-icon{font-size:32px;color:var(--primary);min-width:32px;text-align:center}.contact-item h3{font-size:18px;font-weight:600;margin-bottom:8px;color:var(--text)}.contact-item p{color:var(--text-light)}.contact-form-wrapper h2{font-size:32px;font-weight:700;margin-bottom:30px;color:var(--text)}.contact-form{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);padding:40px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-group{margin-bottom:20px}.form-group label{display:block;font-weight:500;margin-bottom:8px;color:var(--text)}.form-group input,.form-group textarea,.form-group select{width:100%;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:15px;transition:var(--transition);background:var(--bg-white)}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0066ff1a}.form-group textarea{resize:vertical;min-height:120px}.form-status{padding:14px;border-radius:var(--radius-sm);margin-bottom:20px;font-weight:500}.form-status.success{background:#10b9811a;color:#10b981;border:1px solid rgba(16,185,129,.3)}.form-status.error{background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3)}@media (max-width: 1024px){.contact-grid{grid-template-columns:1fr;gap:40px}}@media (max-width: 768px){.page-header{padding:100px 0 40px}.page-header h1{font-size:32px}.contact-info h2,.contact-form-wrapper h2{font-size:24px;margin-bottom:24px}.contact-item{gap:16px;margin-bottom:20px}.contact-icon{font-size:24px}.contact-item h3{font-size:16px}.contact-item p{font-size:14px}.form-row{grid-template-columns:1fr}.form-group{margin-bottom:16px}.form-group input,.form-group textarea,.form-group select{padding:12px 14px;font-size:14px}.contact-form{padding:20px}}.admin-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f0f23,#1a1a3e);padding:20px}.login-box{background:var(--bg-white);border-radius:var(--radius);padding:48px;width:100%;max-width:420px;box-shadow:0 20px 60px #0000004d}.login-box h2{font-size:28px;font-weight:700;text-align:center;margin-bottom:32px;color:var(--text)}.login-box .form-group{margin-bottom:20px}.login-box .form-group label{display:block;font-weight:500;margin-bottom:8px;color:var(--text)}.login-box .form-group input{width:100%;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:15px;transition:var(--transition)}.login-box .form-group input:focus{outline:none;border-color:var(--primary)}.login-box .error-message{color:#ef4444;font-size:14px;margin-bottom:16px;text-align:center}.login-box .btn-block{margin-top:8px}.login-hint{text-align:center;margin-top:20px;color:var(--text-lighter);font-size:14px}.admin-container{min-height:100vh;background:var(--bg-light)}.admin-header{background:var(--bg-white);padding:20px 40px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}.admin-header h2{font-size:24px;font-weight:600;color:var(--text)}.messages-list{padding:40px}.no-messages{text-align:center;color:var(--text-lighter);font-size:18px;padding:60px;background:var(--bg-white);border-radius:var(--radius)}.messages-list table{width:100%;background:var(--bg-white);border-radius:var(--radius);border-collapse:collapse;overflow:hidden;box-shadow:var(--shadow)}.messages-list th,.messages-list td{padding:16px;text-align:left;border-bottom:1px solid var(--border)}.messages-list th{background:var(--bg-lighter);font-weight:600;color:var(--text);font-size:14px}.messages-list td{color:var(--text);font-size:14px}.messages-list tr:hover{background:var(--bg-light)}.message-content{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-link{color:var(--primary);background:none;border:none;cursor:pointer;font-size:14px;padding:6px 12px;border-radius:var(--radius-sm);transition:var(--transition)}.btn-link:hover{background:#0066ff1a}.btn-delete{color:#ef4444;background:none;border:none;cursor:pointer;font-size:14px;padding:6px 12px;border-radius:var(--radius-sm);transition:var(--transition)}.btn-delete:hover{background:#ef44441a}@media (max-width: 1200px){.messages-list{overflow-x:auto}.messages-list table{min-width:1000px}}@media (max-width: 768px){.login-box{padding:32px 24px}.login-box h2{font-size:24px;margin-bottom:24px}.admin-header{padding:16px 20px;flex-direction:column;gap:12px;text-align:center}.admin-header h2{font-size:20px}.messages-list{padding:20px}.no-messages{padding:40px 20px;font-size:16px}.messages-list th,.messages-list td{padding:12px 8px;font-size:12px}.message-content{max-width:100px}.btn-link,.btn-delete{font-size:12px;padding:4px 8px}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--bg-white);border-radius:var(--radius);width:90%;max-width:500px;box-shadow:0 20px 60px #0000004d;animation:slideUp .2s ease}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--border)}.modal-header h3{font-size:18px;font-weight:600;color:var(--text)}.modal-close{font-size:28px;color:var(--text-lighter);background:none;border:none;cursor:pointer;line-height:1;transition:var(--transition)}.modal-close:hover{color:var(--text)}.modal-body{padding:24px}.modal-body textarea{width:100%;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:15px;font-family:inherit;resize:vertical;transition:var(--transition)}.modal-body textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0066ff1a}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid var(--border)}.modal-footer .btn{padding:10px 24px}@media (max-width: 480px){.modal-content{width:95%;margin:16px}.modal-header,.modal-body,.modal-footer{padding:16px}}
