*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f1f4f1;min-height:100vh;color:#333}.container{max-width:800px;margin:0 auto;padding:2rem;min-height:100vh}header{text-align:center;margin-bottom:3rem;color:#333;padding:2rem;background:#fff;border-radius:12px;box-shadow:0 2px 10px #00000014;position:relative}header h1{font-size:2.5rem;margin-bottom:.5rem;color:#26a69a;font-weight:700}header p{font-size:1.1rem;color:#666}.url-form{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000014;margin-bottom:2rem;border:1px solid #e0e0e0}.input-group{display:flex;gap:1rem}.input-group input{flex:1;padding:1rem;border:2px solid #e1e8ed;border-radius:8px;font-size:1rem;transition:border-color .2s}.input-group input:focus{outline:none;border-color:#26a69a}.input-group button{padding:1rem 2rem;background:#26a69a;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.input-group button:hover:not(:disabled){background:#00695c;transform:translateY(-1px)}.input-group button:disabled{opacity:.6;cursor:not-allowed;transform:none}.stats-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid #e0e0e0}.stats-section h2{margin-bottom:1.5rem;color:#26a69a;border-bottom:2px solid #26a69a;padding-bottom:.5rem;font-weight:600}.empty-state{text-align:center;color:#666;font-style:italic;padding:2rem}.url-list{display:flex;flex-direction:column;gap:1rem}.url-item{border:1px solid #e0e0e0;border-radius:12px;padding:1.5rem;transition:all .2s;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;background:#fff}.url-item:hover{box-shadow:0 4px 15px #26a69a1a;border-color:#26a69a}.url-info{flex:1}.url-actions{display:flex;flex-direction:column;gap:.5rem}.view-btn{background:#26a69a;color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.3rem;white-space:nowrap;font-weight:500}.view-btn:hover{background:#00695c;transform:translateY(-1px);box-shadow:0 4px 12px #26a69a4d}.delete-btn{background:#f44336;color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.3rem;white-space:nowrap;font-weight:500}.delete-btn:hover{background:#d32f2f;transform:translateY(-1px);box-shadow:0 4px 12px #f443364d}.delete-btn:active{transform:translateY(0)}.url-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem;padding:.3rem 0}.url-row:last-child{margin-bottom:0}.url-row strong{font-weight:600;color:#555;min-width:80px}.short-url{color:#26a69a;cursor:pointer;text-decoration:underline;transition:color .2s;font-weight:500}.short-url:hover{color:#00695c}.original-url{color:#666;word-break:break-all;max-width:400px;overflow:hidden;text-overflow:ellipsis}.clicks{background:#26a69a;color:#fff;padding:.3rem .8rem;border-radius:16px;font-weight:600;font-size:.9rem;box-shadow:0 2px 4px #26a69a33}.logout-btn{position:absolute;top:2rem;right:2rem;background:#f44336;color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .2s ease;font-weight:500}.logout-btn:hover{background:#d32f2f;transform:translateY(-1px)}.login-container{max-width:400px;margin:0 auto;padding-top:4rem}.login-form{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid #e0e0e0}.input-group.vertical{flex-direction:column;gap:1rem}.input-group.vertical input{width:100%}.login-info{margin-top:1.5rem;padding:1rem;background:#f9f9f9;border-radius:8px;font-size:.9rem;color:#666}.login-info p{margin:.25rem 0}.login-info strong{color:#333}.date{color:#888;font-size:.9rem}.url-name{color:#26a69a;font-weight:600}.click-details-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid #e0e0e0}.details-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #26a69a}.details-header h2{color:#26a69a;font-weight:600;margin:0}.back-btn{background:#666;color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .2s ease;font-weight:500}.back-btn:hover{background:#555;transform:translateY(-1px)}.url-summary{background:#f8f9fa;padding:1.5rem;border-radius:8px;margin-bottom:2rem;border-left:4px solid #26a69a}.url-summary p{margin-bottom:.5rem;color:#555}.url-summary p:last-child{margin-bottom:0}.clicks-list h3{color:#26a69a;margin-bottom:1rem;font-weight:600}.click-item{border:1px solid #e0e0e0;border-radius:8px;padding:1rem;margin-bottom:1rem;background:#fafafa;transition:all .2s}.click-item:hover{box-shadow:0 2px 8px #0000001a;border-color:#26a69a}.click-info{display:flex;flex-direction:column;gap:.5rem}.click-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.click-row strong{color:#555;min-width:80px;font-weight:600}.click-date{color:#26a69a;font-weight:600}.user-agent{font-size:.9rem;color:#666;word-break:break-all}@media (max-width: 640px){.container{padding:1rem}.input-group{flex-direction:column}.url-item{flex-direction:column;align-items:stretch}.url-actions{flex-direction:row;justify-content:flex-end;margin-top:1rem;padding-top:1rem;border-top:1px solid #f0f0f0}.url-row{flex-direction:column;align-items:flex-start;gap:.3rem}.original-url{max-width:none}}html{line-height:1.5;font-weight:400;color-scheme:light;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;min-width:320px;min-height:100vh}#root{width:100%}