:root{--primary:#6366f1;--primary-dark:#5568d3;--secondary:#a855f7;--bg-gradient:linear-gradient(135deg,#6366f1 0%,#a855f7 100%);--bg-dark:#0a0a0a;--bg-card:#1a1a1a;--bg-card-hover:#1f1f1f;--border:#2a2a2a;--border-hover:#3a3a3a;--text:#ededed;--text-light:#a0a0a0;--shadow:0 20px 60px #00000080;--radius:16px}.shortener-page{background:var(--bg-dark);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.gallery-top-header{z-index:10;position:absolute;top:20px;left:20px}.back-button{background:var(--bg-card);border:1px solid var(--border);color:var(--text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;align-items:center;padding:12px 20px;font-size:14px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex;box-shadow:0 4px 20px #0000004d}.back-button:hover{background:var(--bg-card-hover);border-color:var(--primary);transform:translate(-4px);box-shadow:0 6px 30px #6366f166}.back-button .mr-2{margin-right:8px;transition:transform .3s}.back-button:hover .mr-2{transform:translate(-4px)}.shortener-container{background:var(--bg-card);border:1px solid var(--border);border-radius:24px;width:100%;max-width:600px;padding:40px;box-shadow:0 30px 80px #000c}.shortener-container h1{color:var(--text);background:linear-gradient(135deg,#fff 0%,#a0a0a0 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:10px;font-size:36px;font-weight:700}.subtitle{color:var(--text-light);margin-bottom:30px;font-size:14px}.badge{color:#a78bfa;background:linear-gradient(135deg,#6366f133 0%,#a855f733 100%);border:1px solid #a855f74d;border-radius:24px;padding:8px 16px;font-size:13px;font-weight:600;display:inline-block}.input-group{margin-bottom:20px}.input-group label{color:var(--text);margin-bottom:8px;font-size:14px;font-weight:600;display:block}.input-group input[type=url]{border:1px solid var(--border);background:var(--bg-card-hover);width:100%;color:var(--text);border-radius:12px;padding:16px;font-size:16px;transition:all .3s}.input-group input[type=url]::placeholder{color:var(--text-light)}.input-group input[type=url]:focus{border-color:var(--primary);background:#252525;outline:none;box-shadow:0 0 0 3px #6366f11a}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#6366f1 0%,#a855f7 100%);border:none;border-radius:14px;width:100%;padding:16px;font-size:16px;font-weight:700;transition:all .3s;box-shadow:0 4px 20px #6366f166}.btn-primary:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 10px 30px #6366f199}.btn-primary:active{transform:translateY(-1px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.result-card{background:var(--bg-card-hover);border:1px solid var(--border);border-radius:16px;margin-top:30px;padding:24px;animation:.3s ease-out slideIn}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.result-card h3{color:var(--text);margin-bottom:12px;font-size:18px;font-weight:700}.short-url-display{gap:12px;margin-top:12px;display:flex}.short-url-display input{border:1px solid var(--border);background:var(--bg-card);color:var(--text);border-radius:10px;flex:1;padding:14px;font-size:14px;font-weight:500}.copy-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#6366f1 0%,#a855f7 100%);border:none;border-radius:10px;padding:14px 28px;font-weight:700;transition:all .3s;box-shadow:0 4px 20px #6366f166}.copy-btn:hover{transform:translateY(-2px);box-shadow:0 6px 25px #6366f199}.copy-btn.copied{background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 4px 20px #10b98166}.stats-section{border-top:1px solid var(--border);margin-top:16px;padding-top:16px}.stats-item{color:var(--text-light);background:var(--bg-card);border-radius:8px;margin-bottom:10px;padding:8px 12px;font-size:14px}.stats-item strong{color:var(--text);min-width:100px;font-weight:600;display:inline-block}.original-url{word-break:break-all;color:#a78bfa}.error-message{color:#f87171;background:#ef44441a;border:1px solid #ef44444d;border-radius:12px;margin-top:20px;padding:16px 20px;font-size:14px;animation:.3s ease-out slideIn}.footer{text-align:center;color:var(--text-light);margin-top:30px;font-size:12px}.features-list{background:var(--bg-card-hover);border:1px solid var(--border);border-radius:16px;margin-top:30px;padding:24px}.features-list h3{color:var(--text);margin-bottom:16px;font-size:16px;font-weight:700}.feature-item{background:var(--bg-card);color:var(--text-light);border-radius:8px;align-items:center;gap:12px;margin-bottom:12px;padding:10px;font-size:14px;transition:all .3s;display:flex}.feature-item:hover{background:#252525;transform:translate(4px)}.feature-icon{font-size:20px}@media (max-width:768px){.shortener-container{padding:30px 20px}.shortener-container h1{font-size:24px}.short-url-display{flex-direction:column}.copy-btn{width:100%}}