@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Sora:wght@100..800&display=swap";*{transition:all .2s cubic-bezier(.09,-.09,0,1)}:root{--bs-body-bg: #f8f9fa;--bs-body-color: #212529;--sidebar-bg: #ffffff;--sidebar-border: #dee2e6;--card-bg: #ffffff;--card-shadow: rgba(0, 0, 0, .05);--preview-bg: #f1f3f5;--code-bg: #212529;--code-color: #e9ecef;--range-track-bg: #dee2e6;--link-color: #495057;--link-hover-bg: #e9ecef;--link-active-color: #0d6efd;--easing-ease-out-improv: cubic-bezier(.09, -.09, 0, 1);--easing-fast-out-slow-in: cubic-bezier(0, 0, .2, 1)}[data-bs-theme=dark]{--bs-body-bg: #121212;--bs-body-color: #e9ecef;--sidebar-bg: #1e1e1e;--sidebar-border: #343a40;--card-bg: #1e1e1e;--card-shadow: rgba(255, 255, 255, .05);--preview-bg: #2c2c2c;--code-bg: #181818;--code-color: #f8f9fa;--range-track-bg: #495057;--link-color: #adb5bd;--link-hover-bg: #343a40;--link-active-color: #3b82f6}body{font-family:Inter,sans-serif;background-color:var(--bs-body-bg);color:var(--bs-body-color)}.fill-container{width:100vw;height:100vh;display:flex;flex-direction:row;position:relative}.root{width:100%;height:100%}.sidebar{background-color:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);transition:all .35s var(--easing-fast-out-slow-in);display:flex;flex-direction:column;min-width:270px}.sidebar .nav-link{font-size:1rem;font-weight:500;color:var(--link-color);border-radius:.375rem;margin:.1rem 1rem;padding:.65rem 1rem;transition:none}.sidebar .nav-link i{margin-right:1rem}.sidebar .nav-link:hover{background-color:var(--link-hover-bg)}.sidebar .nav-link.active{background-color:var(--link-hover-bg);color:var(--bs-text-light);font-weight:600;box-shadow:0 2px 4px #00000021}.sidebar .sidebar-header{padding:0 1.5rem 1rem}.sidebar-footer{margin-top:auto;padding:1rem;display:flex;justify-content:space-between}.content{flex-grow:1;padding:1rem;padding-top:20px;overflow-y:auto}.tool-card{background-color:var(--card-bg);border:none;border-radius:.75rem;box-shadow:0 4px 6px var(--card-shadow)}.preview-area{display:flex;justify-content:center;align-items:center;min-height:300px;background-color:var(--preview-bg);border-radius:.5rem;overflow:hidden}#box-shadow-preview,#border-radius-preview{width:150px;height:150px;background-color:#0d6efd}#text-shadow-preview,#text-properties-preview{font-size:3.5rem;font-weight:700;color:#0d6efd}#gradient-preview{width:100%;height:100%;min-height:300px;border-radius:.5rem}#transform-preview{width:150px;height:150px;background-color:#0d6efd;border-radius:.75rem;transition:transform .2s}.tool-code-output{position:relative;padding:0rem;border-radius:.5rem;white-space:pre-wrap;word-break:break-all}.copy-btn{height:1.9rem;position:absolute;top:calc(50% - .95rem);right:.75rem;border:none;border-radius:1em}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:8px;background:var(--range-track-bg);border-radius:5px;outline:none;opacity:.7;transition:opacity .2s}input[type=range]:hover{opacity:1}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#0d6efd;cursor:pointer;border-radius:50%}input[type=range]::-moz-range-thumb{width:20px;height:20px;background:#0d6efd;cursor:pointer;border-radius:50%}.gradient-stop{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.theme-toggle-btn{color:var(--link-color);font-size:1.25rem;padding:.5rem;margin-left:.5rem}.theme-toggle-btn:hover{color:var(--link-active-color);background-color:var(--link-hover-bg)}.font-selector{position:relative}.font-dropdown-menu-search-icon{background-color:var(--bs-body-bg);border:none}.font-dropdown-menu-search-box:focus{outline:none!important;border:none!important;box-shadow:none!important}.font-dropdown-menu{position:absolute;z-index:1000;width:100%;max-height:300px;overflow-y:auto;border:1px solid var(--sidebar-border);border-radius:.5rem;box-shadow:0 4px 6px var(--card-shadow)}.font-dropdown-menu-header{border-bottom:2px solid var(--sidebar-border);padding:.2rem}.font-dropdown-list{max-height:250px;overflow-y:auto}.font-dropdown-list .list-group-item{padding:.5rem 1rem}.font-dropdown-list .list-group-item:hover{background-color:var(--link-hover-bg)}.font-dropdown-menu{transform-origin:top center;transition:transform .2s ease-out,opacity .2s ease-out;opacity:0;transform:scaleY(0)}.font-dropdown-menu.show{opacity:1;transform:scaleY(1)}.sidebar{position:fixed;top:0;left:-270px;width:260px;height:100%;z-index:1050}.sidebar.open{left:0}.sidebar-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000073;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:1040;transition:background .4s var(--easing-fast-out-slow-in)}.hamburger-btn{border:none;font-size:1.8rem;z-index:1049;cursor:pointer;color:var(--link-color);background-color:transparent}.content-titlebar{width:100%;text-align:left;padding-left:1rem;padding-top:.5rem;padding-bottom:.5rem;background:transparent;box-shadow:0 4px 4px #0000000f}.hamburger-btn:hover{color:var(--link-active-color)}.close-btn{background:none;border:none;font-size:1.3rem;padding:0;padding-left:1.5rem;padding-bottom:.8rem;padding-top:1rem;width:100%;text-align:left;cursor:pointer;color:var(--link-color)}.close-btn:hover{color:var(--link-active-color)}.font-sora{font-size:1.5rem;font-weight:600;font-family:Sora,sans-serif;text-align:center}@media (max-width: 768px){.content{overflow-y:visible;overflow-x:auto;padding-top:.8em}.sidebar{overflow-y:scroll}.sidebar-header{padding-bottom:.8rem!important}}@media (min-width: 768px){.sidebar{position:static;left:0!important;height:100vh;width:240px;border-right:1px solid var(--sidebar-border)}.hamburger-btn,.close-btn,.sidebar-overlay{display:none}}.color-picker-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1050;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.color-picker-dialog{background-color:var(--card-bg);border-radius:.5rem;box-shadow:0 10px 25px #0003;width:90%;max-width:400px;max-height:90vh;overflow:hidden;position:relative}.color-picker-titlebar{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--sidebar-border);background-color:var(--sidebar-bg)}.color-picker-titlebar span{font-weight:600;font-size:1.1rem}.color-picker-tabs{display:flex;border-bottom:1px solid var(--sidebar-border);background-color:var(--sidebar-bg)}.color-picker-tabs .tab{flex:1;padding:.75rem 1rem;background:none;border:none;color:var(--link-color);cursor:pointer;transition:all .2s;font-weight:500}.color-picker-tabs .tab:hover{background-color:var(--link-hover-bg)}.color-picker-tabs .tab.active{background-color:var(--link-active-color);color:#fff;font-weight:600}.color-picker-content{padding:1.5rem;max-height:60vh;overflow-y:auto}.color-picker-content h4{margin-bottom:1rem;font-size:1.1rem;font-weight:600}.color-preview{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:1rem;background-color:var(--preview-bg);border-radius:.375rem}.color-swatch{width:50px;height:50px;border-radius:.375rem;border:2px solid var(--sidebar-border);flex-shrink:0}.hex-input{flex:1;font-family:monospace;font-size:.9rem}.color-inputs{display:flex;flex-direction:column;gap:1rem}.color-inputs .input-group{display:flex;flex-direction:column;gap:.5rem}.color-inputs .input-group label{font-weight:500;font-size:.9rem;color:var(--bs-body-color)}.color-inputs .input-group input[type=range]{width:100%;height:6px;border-radius:3px;background:var(--range-track-bg);outline:none;-webkit-appearance:none}.color-inputs .input-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--link-active-color);cursor:pointer;border:2px solid white;box-shadow:0 2px 4px #0003}.color-inputs .input-group input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--link-active-color);cursor:pointer;border:2px solid white;box-shadow:0 2px 4px #0003}.color-inputs .input-group input[type=number]{width:80px;font-size:.9rem;text-align:center}.color-picker-actions{display:flex;gap:.75rem;padding:1rem 1.5rem;border-top:1px solid var(--sidebar-border);background-color:var(--sidebar-bg);justify-content:flex-end}.color-picker-actions .btn{padding:.5rem 1rem;border-radius:.375rem;font-weight:500;transition:all .2s}.color-picker-actions .btn-secondary{background-color:transparent;border:1px solid var(--sidebar-border);color:var(--bs-body-color)}.color-picker-actions .btn-secondary:hover{background-color:var(--link-hover-bg)}.color-picker-actions .btn-primary{background-color:var(--link-active-color);border:1px solid var(--link-active-color);color:#fff}.color-picker-actions .btn-primary:hover{background-color:#0b5ed7;border-color:#0b5ed7}@media (max-width: 576px){.color-picker-dialog{width:95%;margin:1rem}.color-picker-content,.color-picker-actions{padding:1rem}.color-preview{flex-direction:column;align-items:stretch}.hex-input{text-align:center}}.color-picker-button{display:flex;flex-direction:column;gap:.5rem}.color-picker-trigger{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border:2px solid var(--sidebar-border);border-radius:.375rem;background-color:var(--card-bg);color:var(--bs-body-color);cursor:pointer;transition:all .2s;font-family:monospace;font-size:.9rem;font-weight:500;min-height:44px}.color-picker-trigger:hover:not(:disabled){border-color:var(--link-active-color);box-shadow:0 0 0 .2rem #0d6efd40}.color-picker-trigger:focus{outline:none;border-color:var(--link-active-color);box-shadow:0 0 0 .2rem #0d6efd40}.color-picker-trigger:disabled{opacity:.6;cursor:not-allowed}.color-picker-trigger .color-value{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);font-weight:600}.color-picker-trigger i{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);font-size:1.1rem}.gradient-color-picker-trigger{width:40px;height:40px;border:2px solid var(--sidebar-border);border-radius:.375rem;background-color:var(--card-bg);color:var(--bs-body-color);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;flex-shrink:0}.gradient-color-picker-trigger:hover:not(:disabled){border-color:var(--link-active-color);box-shadow:0 0 0 .2rem #0d6efd40}.gradient-color-picker-trigger:focus{outline:none;border-color:var(--link-active-color);box-shadow:0 0 0 .2rem #0d6efd40}.gradient-color-picker-trigger:disabled{opacity:.6;cursor:not-allowed}.gradient-color-picker-trigger i{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);font-size:1rem}.gradient-color-picker-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1050;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.gradient-color-picker-dialog{background-color:var(--card-bg);border-radius:.5rem;box-shadow:0 10px 25px #0003;width:90%;max-width:350px;max-height:90vh;overflow:hidden;position:relative}.gradient-color-picker-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--sidebar-border);background-color:var(--sidebar-bg)}.gradient-color-picker-header span{font-weight:600;font-size:1rem}.gradient-color-picker-content{padding:1.5rem;max-height:60vh;overflow-y:auto}.gradient-color-picker-actions{display:flex;gap:.75rem;padding:1rem 1.5rem;border-top:1px solid var(--sidebar-border);background-color:var(--sidebar-bg);justify-content:flex-end}._focused_93c18_1,._focused_93c18_1:hover{background-color:#0d6efd;color:#fff}div.spinner{position:relative;width:54px;height:54px;display:inline-block;margin-left:50%;margin-right:50%;padding:10px;border-radius:10px}div.spinner div{width:10%;height:18%;background:#fff;position:absolute;left:49%;top:43%;opacity:0;border-radius:50px;animation:fade 1s linear infinite}@keyframes fade{0%{opacity:1}to{opacity:.25}}div.spinner div.bar1{transform:rotate(0) translateY(-130%);animation-delay:0s}div.spinner div.bar2{transform:rotate(30deg) translateY(-130%);animation-delay:-.9167s}div.spinner div.bar3{transform:rotate(60deg) translateY(-130%);animation-delay:-.833s}div.spinner div.bar4{transform:rotate(90deg) translateY(-130%);animation-delay:-.7497s}div.spinner div.bar5{transform:rotate(120deg) translateY(-130%);animation-delay:-.667s}div.spinner div.bar6{transform:rotate(150deg) translateY(-130%);animation-delay:-.5837s}div.spinner div.bar7{transform:rotate(180deg) translateY(-130%);animation-delay:-.5s}div.spinner div.bar8{transform:rotate(210deg) translateY(-130%);animation-delay:-.4167s}div.spinner div.bar9{transform:rotate(240deg) translateY(-130%);animation-delay:-.333s}div.spinner div.bar10{transform:rotate(270deg) translateY(-130%);animation-delay:-.2497s}div.spinner div.bar11{transform:rotate(300deg) translateY(-130%);animation-delay:-.167s}div.spinner div.bar12{transform:rotate(330deg) translateY(-130%);animation-delay:-.0833s}