:root{--color-bg: #090D16;--color-bg-elevated: #0F1420;--color-surface: #151B28;--color-card: #131A29;--color-border: #1E293B;--color-border-hover: #334155;--color-border-neon: rgba(99, 102, 241, .4);--color-text-primary: #F8FAFC;--color-text-secondary: #94A3B8;--color-text-muted: #64748B;--color-accent: #6366F1;--color-accent-hover: #818CF8;--gradient-cta: linear-gradient(135deg, #6366F1 0%, #8B5CF6 50%, #A78BFA 100%);--gradient-cta-hover: linear-gradient(135deg, #818CF8 0%, #A78BFA 50%, #C4B5FD 100%);--gradient-text: linear-gradient(135deg, #FFFFFF 0%, #CBD5E1 50%, #94A3B8 100%);--gradient-brand: linear-gradient(135deg, #6366F1 0%, #A855F7 100%);--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--shadow-card: 0 4px 20px -2px rgba(0, 0, 0, .5), 0 2px 6px -1px rgba(0, 0, 0, .4);--shadow-card-hover: 0 10px 30px -4px rgba(99, 102, 241, .25), 0 4px 12px -2px rgba(0, 0, 0, .5);--glow-accent: 0 0 20px rgba(99, 102, 241, .35);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--max-width: 1140px;--header-height: 64px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--color-bg);color:var(--color-text-primary);line-height:1.5;min-height:100vh;overflow-x:hidden}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover)}.app{display:flex;flex-direction:column;min-height:100vh}.container{width:100%;max-width:var(--max-width);margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}.main-content{flex:1;padding-top:24px;padding-bottom:40px}.nav-header{position:sticky;top:0;z-index:100;height:var(--header-height);background:#090d16eb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:100%;max-width:var(--max-width);margin:0 auto;padding:0 16px;gap:12px}.nav-logo{display:flex;align-items:center;gap:8px;font-size:1.125rem;font-weight:800;letter-spacing:-.02em;color:var(--color-text-primary);flex-shrink:0}.nav-logo svg{color:var(--color-accent)}.nav-logo span{background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-right-cluster{display:flex;align-items:center;gap:12px}.nav-links{display:flex;align-items:center;gap:4px;list-style:none}.nav-links a{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:var(--radius-sm);font-size:.8125rem;font-weight:600;color:var(--color-text-secondary);transition:all var(--transition-fast)}.nav-links a:hover,.nav-links a.active{color:var(--color-text-primary);background:var(--color-surface)}.nav-links a.active{background:#6366f126;color:var(--color-accent);border:1px solid var(--color-border-neon)}.nav-auth-controls{display:flex;align-items:center}.nav-guest-block{display:flex;align-items:center;gap:8px}.btn-nav-login{display:inline-flex;align-items:center;gap:5px;padding:7px 12px;border-radius:var(--radius-sm);background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);font-size:.8125rem;font-weight:600;transition:all var(--transition-fast)}.btn-nav-login:hover{border-color:var(--color-accent);color:var(--color-accent)}.btn-nav-signup{display:inline-flex;align-items:center;padding:7px 14px;border-radius:var(--radius-sm);background:var(--gradient-cta);color:#fff!important;font-size:.8125rem;font-weight:700;transition:opacity var(--transition-fast),transform var(--transition-fast)}.btn-nav-signup:hover{opacity:.92;transform:translateY(-1px)}.nav-authenticated-block{display:flex;align-items:center;gap:10px}.nav-user-greeting{display:inline-flex;align-items:center;gap:6px;font-size:.8125rem;font-weight:600;color:var(--color-text-secondary);background:var(--color-surface);border:1px solid var(--color-border);padding:6px 10px;border-radius:999px}.nav-user-name{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-nav-logout{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:var(--radius-sm);background:transparent;border:1px solid var(--color-border);color:var(--color-text-muted);font-size:.8125rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.btn-nav-logout:hover{border-color:var(--color-error);color:var(--color-error);background:#ef444414}.shortener-page{display:flex;flex-direction:column;align-items:center;width:100%}.shortener-hero{text-align:center;width:100%;margin-bottom:24px}.shortener-hero h1{font-size:1.875rem;font-weight:800;line-height:1.2;letter-spacing:-.03em;margin-bottom:12px}.shortener-hero h1 .gradient-text{background:var(--gradient-cta);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.shortener-hero p{font-size:.9375rem;color:var(--color-text-secondary);line-height:1.6;max-width:540px;margin:0 auto}.shortener-card{width:100%;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-card);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.shortener-card:hover{border-color:var(--color-border-neon)}.form-field-group{display:flex;flex-direction:column;gap:8px}.form-label{display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.label-badge-hint{font-size:.7188rem;font-weight:700;color:var(--color-accent-hover);text-transform:none;letter-spacing:.02em}.form-label-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.forgot-password-link{font-size:.75rem;font-weight:600;color:var(--color-accent)}.forgot-password-link:hover{text-decoration:underline}.input-group{display:flex;flex-direction:column;gap:12px;width:100%}.input-group input{width:100%;min-height:48px;padding:12px 16px;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:inherit;font-size:.9375rem;outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input-group input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #6366f133}.input-group input.input-error{border-color:var(--color-error)}.btn-shorten{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;background:var(--gradient-cta);color:#fff;font-family:inherit;font-size:.9375rem;font-weight:700;border:none;border-radius:var(--radius-sm);cursor:pointer;box-shadow:0 4px 14px #6366f159;transition:transform var(--transition-fast),opacity var(--transition-fast)}.btn-shorten:hover:not(:disabled){opacity:.92;transform:translateY(-1px)}.btn-shorten:disabled{opacity:.6;cursor:not-allowed}.error-banner{display:flex;align-items:center;gap:8px;margin-top:14px;padding:10px 14px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-sm);color:#fca5a5;font-size:.8125rem}.error-text{display:block;font-size:.75rem;color:var(--color-error);margin-top:4px;font-weight:500}.result-card{margin-top:20px;background:var(--color-bg-elevated);border:1px solid var(--color-border-neon);border-radius:var(--radius-md);padding:16px;display:flex;flex-direction:column;gap:14px;animation:slideUp .25s ease-out}.result-info{display:flex;flex-direction:column;gap:4px;min-width:0}.result-tag{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--color-accent-hover)}.result-short-url{font-size:1.125rem;font-weight:800;color:#fff;word-break:break-all}.result-long-url{font-size:.8125rem;color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn-copy{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:10px 18px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:.875rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.btn-copy:hover{border-color:var(--color-accent);color:var(--color-accent)}.btn-copy.copied{background:#10b9811f;border-color:var(--color-success);color:var(--color-success)}.auth-page{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:16px 0}.auth-card{width:100%;max-width:460px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:28px 24px;box-shadow:var(--shadow-card);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.auth-card:hover{border-color:var(--color-border-neon)}.auth-header{text-align:center;margin-bottom:24px}.auth-icon-badge{width:48px;height:48px;border-radius:var(--radius-md);background:#6366f11f;border:1px solid var(--color-border-neon);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--color-accent)}.auth-header h1{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin-bottom:8px}.auth-header p{color:var(--color-text-secondary);font-size:.875rem;line-height:1.5}.auth-form{display:flex;flex-direction:column;gap:18px}.form-group{display:flex;flex-direction:column;gap:6px}.input-with-icon{position:relative;display:flex;align-items:center;width:100%}.input-icon{position:absolute;left:14px;color:var(--color-text-muted);display:flex;align-items:center;pointer-events:none}.input-with-icon input{width:100%;min-height:46px;padding:11px 40px 11px 42px;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-family:inherit;font-size:.9375rem;outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input-with-icon input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #6366f133}.input-with-icon input.input-error{border-color:var(--color-error)!important;box-shadow:0 0 0 3px #ef444433}.btn-toggle-password{position:absolute;right:12px;background:transparent;border:none;color:var(--color-text-muted);cursor:pointer;display:flex;align-items:center;padding:4px}.btn-toggle-password:hover{color:var(--color-text-primary)}.strength-meter-container{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}.strength-bar-bg{flex:1;height:4px;background:var(--color-surface);border-radius:999px;overflow:hidden}.strength-bar-fill{height:100%;transition:width .3s ease,background-color .3s ease}.strength-bar-fill.weak{background:var(--color-error)}.strength-bar-fill.fair{background:var(--color-warning)}.strength-bar-fill.good{background:#3b82f6}.strength-bar-fill.strong{background:var(--color-success)}.strength-label{font-size:.6875rem;text-transform:uppercase;letter-spacing:.05em}.strength-label.weak{color:var(--color-error)}.strength-label.fair{color:var(--color-warning)}.strength-label.good{color:#3b82f6}.strength-label.strong{color:var(--color-success)}.checkbox-group{margin:4px 0}.checkbox-container{display:inline-flex;align-items:flex-start;gap:12px;cursor:pointer;font-size:.8125rem;color:var(--color-text-secondary);-webkit-user-select:none;user-select:none;position:relative;line-height:1.4}.checkbox-container input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;height:0;width:0;margin:0;pointer-events:none}.checkmark{position:relative;top:1px;left:0;width:20px;height:20px;background-color:var(--color-bg-elevated);border:1.5px solid var(--color-border);border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 1px 2px #0006}.checkbox-container:hover input~.checkmark{border-color:var(--color-accent);background-color:var(--color-surface)}.checkbox-container input:checked~.checkmark{background:var(--gradient-cta);border-color:transparent;box-shadow:0 0 14px #6366f180,0 2px 6px #0000004d;transform:scale(1.04)}.checkmark:after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #FFFFFF;border-width:0 2.2px 2.2px 0;transform:rotate(45deg) scale(0);opacity:0;transition:transform .22s cubic-bezier(.34,1.56,.64,1),opacity .15s ease-in-out}.checkbox-container input:checked~.checkmark:after{transform:rotate(45deg) scale(1);opacity:1}.checkbox-text{color:var(--color-text-secondary)}.checkbox-text a{color:var(--color-accent);text-decoration:underline;text-underline-offset:2px}.checkbox-text a:hover{color:var(--color-accent-hover)}.btn-auth-submit{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;background:var(--gradient-cta);color:#fff;font-family:inherit;font-size:.9375rem;font-weight:700;border:none;border-radius:var(--radius-sm);cursor:pointer;box-shadow:0 4px 14px #6366f159;transition:transform var(--transition-fast),opacity var(--transition-fast)}.btn-auth-submit:hover:not(:disabled){opacity:.92;transform:translateY(-1px)}.btn-auth-submit:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.auth-footer{margin-top:24px;text-align:center;border-top:1px solid var(--color-border);padding-top:16px}.auth-footer p{font-size:.8125rem;color:var(--color-text-secondary)}.auth-link{font-weight:700;color:var(--color-accent)}.auth-link:hover{text-decoration:underline}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:.8125rem;font-weight:600;color:var(--color-text-muted)}.back-link:hover{color:var(--color-text-primary)}.auth-success-view{text-align:center;padding:12px 0}.success-icon-badge{width:64px;height:64px;border-radius:50%;background:#10b9811f;border:1px solid rgba(16,185,129,.3);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--color-success)}.auth-success-view h1{font-size:1.5rem;font-weight:800;margin-bottom:8px}.auth-success-view p{color:var(--color-text-secondary);font-size:.875rem;line-height:1.6}.demo-reset-notice{margin-top:16px;padding:12px;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-sm);text-align:left;font-size:.75rem}.demo-reset-notice span{display:block;color:var(--color-text-muted);margin-bottom:4px}.demo-reset-link{color:var(--color-accent);word-break:break-all;font-weight:600}.dashboard-page{width:100%}.dashboard-header{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.dashboard-header h1{font-size:1.625rem;font-weight:800;letter-spacing:-.02em;line-height:1.2}.dashboard-header p{color:var(--color-text-secondary);font-size:.875rem}.sync-status{display:inline-flex;align-items:center;gap:8px;color:var(--color-accent)!important;font-weight:500}.sync-dot{width:8px;height:8px;border-radius:50%;background:var(--color-accent);animation:pulse 1.5s infinite}.btn-refresh{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);font-size:.8125rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.btn-refresh:hover:not(:disabled){border-color:var(--color-border-hover);color:var(--color-text-primary)}.btn-refresh.spinning svg{animation:spin .8s linear infinite}.bento-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:24px}.card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:20px;box-shadow:var(--shadow-card);transition:transform var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base)}.card:hover{border-color:var(--color-border-neon);transform:translateY(-2px);box-shadow:var(--shadow-card-hover)}.card-icon{width:36px;height:36px;border-radius:var(--radius-sm);background:#6366f11f;display:flex;align-items:center;justify-content:center;margin-bottom:12px;color:var(--color-accent)}.card-label{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:6px}.card-value{display:block;font-size:1.875rem;font-weight:800;letter-spacing:-.03em;color:var(--color-text-primary)}.table-card{padding:20px;overflow:hidden}.table-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.table-header-row h2{font-size:1.125rem;font-weight:700}.record-count-badge{font-size:.75rem;font-weight:600;color:var(--color-text-secondary);background:var(--color-surface);border:1px solid var(--color-border);padding:4px 10px;border-radius:999px}.table-wrapper{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.data-table{width:100%;border-collapse:collapse;font-size:.875rem;text-align:left}.data-table th{padding:10px 12px;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);border-bottom:1px solid var(--color-border);white-space:nowrap}.data-table td{padding:14px 12px;border-bottom:1px solid rgba(30,41,59,.6);color:var(--color-text-secondary);vertical-align:middle}.data-table tbody tr:hover{background:#6366f10a}.col-destination{max-width:140px}.destination-url{display:inline-flex;align-items:center;gap:4px;color:var(--color-text-secondary);max-width:100%}.destination-url:hover{color:var(--color-text-primary)}.destination-url .url-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px;display:inline-block}.col-shortlink{white-space:nowrap}.shortlink-anchor{font-weight:700;color:var(--color-accent)}.click-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:.75rem;font-weight:700;background:#6366f11f;color:var(--color-accent-hover);border:1px solid rgba(99,102,241,.25)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 16px;text-align:center;color:var(--color-text-muted);gap:12px}.empty-state svg{width:40px;height:40px;opacity:.5}.skeleton-card{pointer-events:none}.skeleton-line{background:linear-gradient(90deg,#151b28 25%,#1f293d,#151b28 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:6px}.skeleton-sm{width:35%;height:14px;margin-bottom:12px}.skeleton-md{width:50%;height:18px}.skeleton-lg{width:70%;height:32px}.skeleton-full{width:100%;height:40px;margin-bottom:10px}.ad-placeholder{width:100%;height:90px;min-height:90px;background:var(--color-bg-elevated);border:1px dashed var(--color-border);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--color-text-muted);font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-top:32px;overflow:hidden}.notfound-page{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:50vh;padding:32px 16px}.notfound-code{font-size:5rem;font-weight:900;line-height:1;background:var(--gradient-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}.notfound-page h2{font-size:1.375rem;font-weight:700;margin-bottom:8px}.notfound-page p{color:var(--color-text-secondary);font-size:.9375rem;max-width:400px;margin-bottom:24px}.btn-home{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;background:var(--gradient-cta);color:#fff;font-size:.9375rem;font-weight:700;border-radius:var(--radius-sm);transition:opacity var(--transition-fast)}.btn-home:hover{opacity:.9;color:#fff}.footer{border-top:1px solid var(--color-border);padding:20px 0;margin-top:auto}.footer-inner{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.footer p{font-size:.75rem;color:var(--color-text-muted)}.footer-links{display:flex;gap:16px;list-style:none}.footer-links a{font-size:.75rem;color:var(--color-text-muted)}.footer-links a:hover{color:var(--color-text-secondary)}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.fade-in{animation:fadeIn .35s ease-out}@media (min-width: 640px){.dashboard-header{flex-direction:row;align-items:center;justify-content:space-between}.btn-refresh{align-self:auto}.bento-grid{grid-template-columns:repeat(2,1fr)}.destination-url .url-text{max-width:220px}.col-destination{max-width:260px}.nav-links a{padding:8px 12px;font-size:.875rem}.nav-user-name{max-width:140px}}@media (min-width: 768px){.container{padding-left:24px;padding-right:24px}.main-content{padding-top:40px;padding-bottom:56px}.shortener-hero h1{font-size:2.75rem}.shortener-card{max-width:680px;padding:32px;margin:0 auto}.auth-card{padding:36px 32px}.input-group{flex-direction:row}.btn-shorten{flex-shrink:0}.result-card{flex-direction:row;align-items:center;justify-content:space-between;padding:20px 24px}.destination-url .url-text{max-width:340px}.col-destination{max-width:380px}.ad-placeholder{height:250px;min-height:250px}.footer-inner{flex-direction:row;justify-content:space-between}}@media (min-width: 1024px){.shortener-hero h1{font-size:3.25rem}.destination-url .url-text{max-width:480px}.col-destination{max-width:520px}}