.url-shortener-container{max-width:1200px;margin:0 auto;padding:1rem;min-height:calc(100vh - 135px)}@media(max-width:768px){.url-shortener-container{padding:.75rem}}.url-shortener-container .page-header{text-align:center;margin-bottom:1.5rem}.url-shortener-container .page-header .page-title{font-size:1.75rem;font-weight:700;color:#1a1a1a;margin-bottom:.75rem;letter-spacing:-.5px;transition:color .3s ease}html.dark .url-shortener-container .page-header .page-title{color:#f8f8f2}@media(min-width:640px){.url-shortener-container .page-header .page-title{font-size:2.5rem}}@media(min-width:1024px){.url-shortener-container .page-header .page-title{font-size:3.5rem}}.url-shortener-container .page-header .page-subtitle{font-size:.85rem;color:#666;max-width:700px;margin:0 auto 1rem;transition:color .3s ease}html.dark .url-shortener-container .page-header .page-subtitle{color:#bd93f9}@media(min-width:640px){.url-shortener-container .page-header .page-subtitle{font-size:1.1rem}}.url-shortener-container .tab-navigation{display:flex;margin-bottom:1rem;border-bottom:1px solid #d1d5db;transition:border-color .3s ease}html.dark .url-shortener-container .tab-navigation{border-color:#44475a}.url-shortener-container .tab-navigation .tab-button{flex:1 1;padding:.75rem 1rem;font-size:1rem;font-weight:500;color:#666;background:rgba(0,0,0,0);border:none;border-bottom:2px solid rgba(0,0,0,0);cursor:pointer;transition:all .2s ease}.url-shortener-container .tab-navigation .tab-button:hover:not(.active){color:#1a1a1a}html.dark .url-shortener-container .tab-navigation .tab-button:hover:not(.active){color:#f8f8f2}.url-shortener-container .tab-navigation .tab-button.active{color:#4a90e2;border-bottom-color:#4a90e2}html.dark .url-shortener-container .tab-navigation .tab-button.active{color:#6be3ff;border-bottom-color:#6be3ff}.url-shortener-container .tab-navigation .tab-button:focus{outline:none}.url-shortener-container .tool-section{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:background .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.url-shortener-container .tool-section:last-of-type{margin-bottom:0}html.dark .url-shortener-container .tool-section{background:#282a36;box-shadow:0 4px 12px rgba(0,0,0,.4)}.url-shortener-container .tool-section .section-title{font-size:1.2rem;font-weight:600;color:#1a1a1a;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}html.dark .url-shortener-container .tool-section .section-title{color:#f8f8f2}.url-shortener-container .form-row{display:flex;flex-direction:column;gap:1rem}@media(min-width:640px){.url-shortener-container .form-row{flex-direction:row}.url-shortener-container .form-row .form-group{flex:1 1;margin-bottom:0}}.url-shortener-container .form-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.url-shortener-container .form-group:last-child{margin-bottom:0}.url-shortener-container .form-group label{font-size:.9rem;font-weight:500;color:#1a1a1a}html.dark .url-shortener-container .form-group label{color:#f8f8f2}.url-shortener-container .form-group .select-input,.url-shortener-container .form-group .text-input,.url-shortener-container .form-group textarea{padding:.75rem 1rem;height:2.75rem;border:1px solid #d1d5db;border-radius:4px;background:#fff;color:#1a1a1a;font-size:.95rem;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;resize:vertical}.url-shortener-container .form-group .select-input[type=number],.url-shortener-container .form-group .text-input[type=number],.url-shortener-container .form-group textarea[type=number]{-moz-appearance:textfield}.url-shortener-container .form-group .select-input[type=number]::-webkit-inner-spin-button,.url-shortener-container .form-group .select-input[type=number]::-webkit-outer-spin-button,.url-shortener-container .form-group .text-input[type=number]::-webkit-inner-spin-button,.url-shortener-container .form-group .text-input[type=number]::-webkit-outer-spin-button,.url-shortener-container .form-group textarea[type=number]::-webkit-inner-spin-button,.url-shortener-container .form-group textarea[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.url-shortener-container .form-group .select-input:focus,.url-shortener-container .form-group .text-input:focus,.url-shortener-container .form-group textarea:focus{outline:none;border-color:#1a1a1a;box-shadow:0 0 0 3px rgba(26,26,26,.2)}html.dark .url-shortener-container .form-group .select-input:focus,html.dark .url-shortener-container .form-group .text-input:focus,html.dark .url-shortener-container .form-group textarea:focus{border-color:#f8f8f2;box-shadow:0 0 0 3px rgba(248,248,242,.2)}.url-shortener-container .form-group .select-input::placeholder,.url-shortener-container .form-group .text-input::placeholder,.url-shortener-container .form-group textarea::placeholder{color:#9ca3af}html.dark .url-shortener-container .form-group .select-input::placeholder,html.dark .url-shortener-container .form-group .text-input::placeholder,html.dark .url-shortener-container .form-group textarea::placeholder{color:#6272a4}html.dark .url-shortener-container .form-group .select-input,html.dark .url-shortener-container .form-group .text-input,html.dark .url-shortener-container .form-group textarea{background:#2e313d;color:#f8f8f2;border-color:#44475a}.url-shortener-container .form-group textarea.text-input{min-height:4rem;height:auto;padding-top:.75rem;padding-bottom:.75rem}.url-shortener-container .form-group .select-wrapper{position:relative;display:block;height:2.75rem;width:100%}.url-shortener-container .form-group .select-wrapper .select-input{cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:2.5rem;width:100%}.url-shortener-container .form-group .select-wrapper .select-input::-ms-expand{display:none}.url-shortener-container .form-group .select-wrapper .select-arrow-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);pointer-events:none;color:#666;transition:color .3s ease}html.dark .url-shortener-container .form-group .select-wrapper .select-arrow-icon{color:#bd93f9}.url-shortener-container .checkbox-group{display:flex;align-items:center;gap:.75rem;cursor:pointer;font-size:.9rem;color:#1a1a1a;margin-bottom:1rem}html.dark .url-shortener-container .checkbox-group{color:#f8f8f2}.url-shortener-container .checkbox-group input[type=checkbox]{width:1.1rem;height:1.1rem;cursor:pointer;accent-color:#4a90e2;flex-shrink:0}html.dark .url-shortener-container .checkbox-group input[type=checkbox]{accent-color:#6be3ff}.url-shortener-container .action-buttons{display:flex;gap:.75rem;justify-content:flex-end;flex-wrap:wrap;margin-top:1rem}@media(max-width:600px){.url-shortener-container .action-buttons{justify-content:stretch}.url-shortener-container .action-buttons .action-button{flex:1 1}}.url-shortener-container .action-button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:4px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:1px solid rgba(0,0,0,0);text-decoration:none;white-space:nowrap}.url-shortener-container .action-button:disabled{cursor:not-allowed;opacity:.6}.url-shortener-container .action-button.primary-button{background:#4a90e2;color:#fff;border-color:#4a90e2}.url-shortener-container .action-button.primary-button:hover:not(:disabled){background:rgb(34.3857142857,117.3857142857,214.6142857143);border-color:rgb(34.3857142857,117.3857142857,214.6142857143);transform:translateY(-1px);box-shadow:0 2px 8px rgba(74,144,226,.3)}html.dark .url-shortener-container .action-button.primary-button{background:#6be3ff;color:#f8f8f2;border-color:#6be3ff}html.dark .url-shortener-container .action-button.primary-button:hover:not(:disabled){background:rgb(56,217.3513513514,255);border-color:rgb(56,217.3513513514,255);box-shadow:0 2px 8px rgba(107,227,255,.3)}.url-shortener-container .action-button.copy-button{background:#22c55e;color:#fff;border-color:#22c55e}.url-shortener-container .action-button.copy-button:hover:not(:disabled){background:rgb(26.4935064935,153.5064935065,73.2467532468);border-color:rgb(26.4935064935,153.5064935065,73.2467532468);transform:translateY(-1px);box-shadow:0 2px 8px rgba(34,197,94,.3)}html.dark .url-shortener-container .action-button.copy-button{background:#50fa7b;color:#f8f8f2;border-color:#50fa7b}html.dark .url-shortener-container .action-button.copy-button:hover:not(:disabled){background:rgb(30.4166666667,248.5833333333,85.6);border-color:rgb(30.4166666667,248.5833333333,85.6);box-shadow:0 2px 8px rgba(80,250,123,.3)}.url-shortener-container .action-button.reset-button{background:#dc2626;color:#fff;border-color:#dc2626}.url-shortener-container .action-button.reset-button:hover:not(:disabled){background:rgb(178.25,28.75,28.75);border-color:rgb(178.25,28.75,28.75);transform:translateY(-1px);box-shadow:0 2px 8px rgba(220,38,38,.3)}html.dark .url-shortener-container .action-button.reset-button{background:#ef4444;color:#f8f8f2;border-color:#ef4444}html.dark .url-shortener-container .action-button.reset-button:hover:not(:disabled){background:hsl(0,84.236453202%,50.1960784314%);border-color:hsl(0,84.236453202%,50.1960784314%);box-shadow:0 2px 8px rgba(239,68,68,.3)}.url-shortener-container .action-button.secondary-button{background:rgba(0,0,0,0);color:#4a90e2;border-color:#4a90e2}.url-shortener-container .action-button.secondary-button:hover:not(:disabled){background:rgba(74,144,226,.1);transform:translateY(-1px)}html.dark .url-shortener-container .action-button.secondary-button{color:#6be3ff;border-color:#6be3ff}html.dark .url-shortener-container .action-button.secondary-button:hover:not(:disabled){background:rgba(107,227,255,.1)}.url-shortener-container .error-message{color:#dc2626;background:rgba(220,38,38,.1);padding:.75rem 1rem;border-radius:4px;margin-top:1rem;font-size:.9rem;border-left:3px solid #dc2626}html.dark .url-shortener-container .error-message{color:#ef4444;background:rgba(239,68,68,.1);border-left-color:#ef4444}.url-shortener-container .output-section-content{flex:1 1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:200px;padding:1rem}.url-shortener-container .shortened-url-display{display:flex;flex-direction:column;gap:.75rem;align-items:center;padding:1rem;background-color:#f9f9f9;border:1px solid #d1d5db;border-radius:8px;margin-bottom:1rem;box-shadow:inset 0 1px 3px rgba(0,0,0,.05)}html.dark .url-shortener-container .shortened-url-display{background-color:#2e313d;border-color:#44475a;box-shadow:inset 0 1px 3px rgba(0,0,0,.25)}.url-shortener-container .shortened-url-display .output-label{font-size:.9rem;color:#666;margin-bottom:.25rem}html.dark .url-shortener-container .shortened-url-display .output-label{color:#bd93f9}.url-shortener-container .shortened-url-display a.short-url-link{font-size:1.1rem;font-weight:600;color:#4a90e2;word-break:break-all;text-decoration:none;transition:color .2s ease,-webkit-text-decoration .2s ease;transition:color .2s ease,text-decoration .2s ease;transition:color .2s ease,text-decoration .2s ease,-webkit-text-decoration .2s ease}.url-shortener-container .shortened-url-display a.short-url-link:hover{text-decoration:underline;color:rgb(34.3857142857,117.3857142857,214.6142857143)}html.dark .url-shortener-container .shortened-url-display a.short-url-link{color:#6be3ff}html.dark .url-shortener-container .shortened-url-display a.short-url-link:hover{color:rgb(158,236.6486486486,255)}.url-shortener-container .shortened-url-display .details-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:.75rem 1rem;gap:.75rem 1rem;width:100%;max-width:400px;margin-top:.75rem;padding-top:.75rem;border-top:1px dashed #d1d5db}html.dark .url-shortener-container .shortened-url-display .details-grid{border-color:#44475a}.url-shortener-container .shortened-url-display .details-grid .detail-item{display:flex;flex-direction:column;text-align:left}.url-shortener-container .shortened-url-display .details-grid .detail-item strong{font-size:.8rem;color:#6b7280}html.dark .url-shortener-container .shortened-url-display .details-grid .detail-item strong{color:#a6adbb}.url-shortener-container .shortened-url-display .details-grid .detail-item span{font-size:.9rem;color:#1a1a1a;word-break:break-all}html.dark .url-shortener-container .shortened-url-display .details-grid .detail-item span{color:#f8f8f2}.url-shortener-container .empty-state{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center;color:#666;min-height:300px}html.dark .url-shortener-container .empty-state{color:#bd93f9}.url-shortener-container .empty-state .empty-icon{opacity:.3;margin-bottom:1rem}.url-shortener-container .empty-state p{font-size:.95rem;max-width:300px;margin:0}.url-shortener-container .ad-placeholder{background-color:#f8fafc;border:1px solid #cbd5e1;border-radius:8px;padding:1rem;text-align:center;font-size:.8rem;color:#64748b;margin-top:2rem;transition:background .3s ease,border-color .3s ease,color .3s ease}html.dark .url-shortener-container .ad-placeholder{background-color:#1a1c24;border-color:#44475a;color:#8be9fd}