html,body{overflow-x:hidden;width:100%;max-width:100vw}.components-showcase{position:relative;width:100vw;min-height:100vh;overflow-x:hidden;overflow-y:auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.components-showcase *,.components-showcase *:before,.components-showcase *:after{box-sizing:border-box}.background-image{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(102,126,234,.3) 0%,rgba(118,75,162,.3) 25%,rgba(240,147,251,.3) 50%,rgba(245,87,108,.3) 75%,rgba(79,172,254,.3) 100%),url(/react-liquid-glass-kit-demo/assets/bg-bf15bbd3.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;filter:blur(.5px);z-index:-1;transition:background-image .5s ease-in-out}.top-bar{position:fixed;top:0;left:0;right:0;height:60px;background:rgba(0,0,0,.3);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.1);z-index:1000;display:flex;align-items:center;justify-content:center}.top-bar-content{display:flex;align-items:center;width:100%;padding:0 20px;justify-content:space-between}.nav-title{color:#fff;font-size:20px;font-weight:600}.header-icons{display:flex;gap:15px;align-items:center}.header-icons>div{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:12px;color:#fff;font-size:18px;cursor:pointer;transition:all .3s ease;border:1px solid rgba(255,255,255,.2)}.header-icons>div:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}.background-switcher{position:relative;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:6px;padding:6px 10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:.8rem;font-weight:500;white-space:nowrap;min-width:fit-content;width:auto!important;height:auto!important}.background-switcher:hover{background:rgba(255,255,255,.2)!important;transform:translateY(-2px) rotate(90deg)}.background-switcher:after{content:attr(data-bg);position:absolute;bottom:-25px;left:50%;transform:translate(-50%);background:rgba(0,0,0,.8);color:#fff;padding:4px 8px;border-radius:4px;font-size:.7rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease}.background-switcher:hover:after{opacity:1}.main-layout{display:flex;height:100vh;padding-top:60px}.sidebar{width:280px;height:100%;position:fixed;left:0;top:0;z-index:100;display:flex;flex-direction:column}.sidebar-container{height:100%;background:rgba(0,0,0,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-right:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;padding-top:100px}.sidebar-header{padding:0 20px 20px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:20px}.sidebar-header h2{color:#fff;font-size:1.2rem;font-weight:600;margin:0;text-align:center}.sidebar-nav{padding:0 0 20px;flex:1;overflow-y:auto}.sidebar-item{display:flex;align-items:center;gap:15px;width:100%;padding:15px 20px;background:none;border:none;color:#fffc;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease;text-align:left}.sidebar-item:hover{background:rgba(255,255,255,.1);color:#fff}.sidebar-item.active{background:rgba(255,255,255,.15);color:#fff;border-right:3px solid rgba(255,255,255,.6)}.sidebar-item svg{flex-shrink:0}.main-content{flex:1;margin-left:280px;padding:60px 40px 40px;overflow-y:auto;height:calc(100vh - 60px);box-sizing:border-box}.content-section{max-width:1000px;margin:0 auto;padding-bottom:100px;width:100%;box-sizing:border-box}.content-section h1{color:#fff;font-size:2.5rem;font-weight:700;margin:0 0 15px;text-shadow:0 2px 10px rgba(0,0,0,.3)}.content-section p{color:#fffc;font-size:1.2rem;margin:0 0 40px;line-height:1.6}.overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:40px}.overview-card{padding:30px!important;text-align:center;cursor:pointer;transition:all .3s ease}.overview-card:hover{transform:translateY(-8px)}.overview-card svg{color:#ffffffe6;margin-bottom:20px}.overview-card h3{color:#fff;font-size:1.3rem;font-weight:600;margin:0 0 10px}.overview-card p{color:#ffffffb3;font-size:.95rem;margin:0}.component-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:40px;margin-bottom:50px;width:100%;max-width:100%;box-sizing:border-box}.component-card{background:rgba(255,255,255,.08);backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);border:.5px solid rgba(255,255,255,.18);border-radius:24px;padding:35px;box-shadow:0 8px 32px #0000001f,0 2px 16px #00000014,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a;transition:all .3s ease;min-height:220px;margin-bottom:20px;width:100%;box-sizing:border-box}.component-card h3{color:#fff;font-size:1.4rem;font-weight:600;margin:0 0 8px;line-height:1.2}.component-card p{color:#ffffffb3;font-size:.95rem;margin:0 0 20px;line-height:1.4}.button-showcase-container{display:flex;flex-direction:column;gap:30px;margin-bottom:30px;width:100%;max-width:1000px;margin-left:auto;margin-right:auto;box-sizing:border-box}.button-showcase{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:20px;padding:10px}.modal-showcase .button-showcase,.sidebar-showcase .button-showcase{display:flex;justify-content:center;align-items:center;grid-template-columns:none}.button-showcase .glass-button,.button-showcase .glass-morphism--button{padding:12px 20px;border-radius:12px;font-size:.9rem;font-weight:500;transition:all .3s ease;background:rgba(255,255,255,.1);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);box-shadow:0 4px 16px #0000001a,inset 0 1px #fff3,inset 0 -1px #ffffff1a;color:#fff;cursor:pointer;position:relative;overflow:hidden}.button-showcase .glass-button:before,.button-showcase .glass-morphism--button:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:inherit;padding:2px;background:linear-gradient(45deg,rgba(255,255,255,1),rgba(255,255,255,.3),rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,1));background-size:400% 400%;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;opacity:0;transition:opacity .3s ease;animation:none;pointer-events:none}.button-showcase .glass-button:hover:before,.button-showcase .glass-morphism--button:hover:before{opacity:1;animation:glowing-border 4s ease-in-out infinite}.button-showcase .glass-button:hover,.button-showcase .glass-morphism--button:hover{background:rgba(255,255,255,.15);backdrop-filter:blur(25px) saturate(1.8) brightness(1.2);-webkit-backdrop-filter:blur(25px) saturate(1.8) brightness(1.2);transform:translateY(-2px);box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26}.button-showcase .glass-button:active,.button-showcase .glass-morphism--button:active{transform:translateY(0);background:rgba(255,255,255,.2);box-shadow:0 4px 12px #0003,inset 0 2px 4px #0000001a}.button-showcase .glass-button:disabled,.button-showcase .glass-morphism--button:disabled{opacity:.5;cursor:not-allowed;background:rgba(255,255,255,.05);border-color:#ffffff1a;transform:none}.button-showcase .glass-button:disabled:hover,.button-showcase .glass-morphism--button:disabled:hover{background:rgba(255,255,255,.05);transform:none;box-shadow:none}.button-showcase .glass-button:disabled:before,.button-showcase .glass-morphism--button:disabled:before{display:none}@keyframes glowing-border{0%{background-position:0% 0%}25%{background-position:100% 0%}50%{background-position:100% 100%}75%{background-position:0% 100%}to{background-position:0% 0%}}.button-showcase .glass-button[data-glow-color=white]:before,.button-showcase .glass-morphism--button[data-glow-color=white]:before{background:linear-gradient(45deg,rgba(255,255,255,1),rgba(255,255,255,.3),rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,1))}.button-showcase .glass-button[data-glow-color=gray]:before,.button-showcase .glass-morphism--button[data-glow-color=gray]:before{background:linear-gradient(45deg,rgba(108,117,125,1),rgba(108,117,125,.3),rgba(108,117,125,0),rgba(108,117,125,.3),rgba(108,117,125,1))}.button-showcase .glass-button[data-glow-color=green]:before,.button-showcase .glass-morphism--button[data-glow-color=green]:before{background:linear-gradient(45deg,rgba(40,167,69,1),rgba(40,167,69,.3),rgba(40,167,69,0),rgba(40,167,69,.3),rgba(40,167,69,1))}.button-showcase .glass-button[data-glow-color=red]:before,.button-showcase .glass-morphism--button[data-glow-color=red]:before{background:linear-gradient(45deg,rgba(220,53,69,1),rgba(220,53,69,.3),rgba(220,53,69,0),rgba(220,53,69,.3),rgba(220,53,69,1))}.button-showcase .glass-button[data-glow-color=blue]:before,.button-showcase .glass-morphism--button[data-glow-color=blue]:before{background:linear-gradient(45deg,rgba(0,123,255,1),rgba(0,123,255,.3),rgba(0,123,255,0),rgba(0,123,255,.3),rgba(0,123,255,1))}.button-showcase .glass-button[data-glow-effects=false]:before,.button-showcase .glass-morphism--button[data-glow-effects=false]:before{display:none}.button-showcase .glass-button[data-glow-effects=false]:hover:before,.button-showcase .glass-morphism--button[data-glow-effects=false]:hover:before{display:none;animation:none}.button-showcase .glass-button.secondary{background:rgba(108,117,125,.15);border-color:#6c757d66;color:#6c757d}.button-showcase .glass-button.secondary:hover{background:rgba(108,117,125,.25);border-color:#6c757d80;color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26}.button-showcase .glass-button.secondary:active{transform:translateY(0);background:rgba(108,117,125,.3);box-shadow:0 4px 12px #0003,inset 0 2px 4px #0000001a}.button-showcase .glass-button.success{background:rgba(40,167,69,.2);border-color:#28a74566;color:#28a745}.button-showcase .glass-button.success:hover{background:rgba(40,167,69,.3);border-color:#28a74580;color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26}.button-showcase .glass-button.success:active{transform:translateY(0);background:rgba(40,167,69,.35);box-shadow:0 4px 12px #0003,inset 0 2px 4px #0000001a}.button-showcase .glass-button.danger{background:rgba(220,53,69,.2);border-color:#dc354566;color:#dc3545}.button-showcase .glass-button.danger:hover{background:rgba(220,53,69,.3);border-color:#dc354580;color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26}.button-showcase .glass-button.danger:active{transform:translateY(0);background:rgba(220,53,69,.35);box-shadow:0 4px 12px #0003,inset 0 2px 4px #0000001a}.icon-button-showcase{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:20px;padding:10px}.icon-btn{width:60px;height:60px;border-radius:50%;display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;position:relative;overflow:hidden}.icon-btn>*{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.icon-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:inherit;padding:2px;background:linear-gradient(45deg,rgba(255,255,255,1),rgba(255,255,255,.3),rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,1));background-size:400% 400%;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;opacity:0;transition:opacity .3s ease;animation:none;pointer-events:none}.icon-btn:hover:before{opacity:1;animation:glowing-border 4s ease-in-out infinite}.icon-btn:hover{background:rgba(255,255,255,.15);border-color:#fff6;transform:translateY(-2px);box-shadow:0 8px 20px #00000026}.icon-btn:active{transform:translateY(0);background:rgba(255,255,255,.2);box-shadow:0 4px 12px #0003}.icon-btn:disabled{opacity:.5;cursor:not-allowed;background:rgba(255,255,255,.05);border-color:#ffffff1a;transform:none}.icon-btn:disabled:hover{background:rgba(255,255,255,.05);transform:none;box-shadow:none}.icon-btn:disabled:before{display:none}.input-showcase{display:flex;flex-direction:column;gap:20px;margin-top:20px}.input-field{display:flex;flex-direction:column;gap:8px}.input-label{color:#ffffffe6;font-size:.9rem;font-weight:500;margin-bottom:4px}.input-showcase .glass-input{width:100%;padding:12px 16px;border-radius:12px;background:rgba(255,255,255,.08);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);color:#fff;font-size:1rem;box-shadow:0 4px 16px #0000001a,inset 0 1px #fff3,inset 0 -1px #ffffff1a;transition:all .3s ease}.input-showcase .glass-input:focus{outline:none;background:rgba(255,255,255,.12);border-color:#ffffff4d;box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26}.input-showcase .glass-input::placeholder{color:#fff9}.search-input-showcase{margin-top:20px}.search-input-container{position:relative;display:flex;align-items:center;background:rgba(255,255,255,.08);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);border-radius:16px;padding:12px 16px;box-shadow:0 4px 16px #0000001a,inset 0 1px #fff3,inset 0 -1px #ffffff1a;min-height:48px}.search-input-container .glass-morphism--input{display:flex;align-items:center;height:100%;min-height:24px;padding:0;background:transparent;border:none;box-shadow:none}.search-input-container svg{color:#fff9;margin-right:12px}.search-input{background:transparent!important;border:none!important;outline:none!important;color:#fff!important;font-size:1rem!important;width:100%!important;padding:0!important}.search-input-container .glass-morphism--input input{padding:0 16px!important;background:transparent!important;border:none!important;outline:none!important;color:#fff!important;font-size:1rem!important;width:100%!important}.search-input-container .glass-morphism--input input::placeholder{color:#ffffffb3!important;opacity:1!important}.input-showcase .glass-morphism--input,.search-input-container .glass-morphism--input{position:relative;overflow:hidden;display:flex;align-items:center;min-height:48px}.input-showcase .glass-morphism--input{padding:12px 16px;background:rgba(255,255,255,.08);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);border-radius:12px;box-shadow:0 4px 16px #0000001a,inset 0 1px #fff3,inset 0 -1px #ffffff1a}.input-showcase .glass-morphism--input input{padding:0 16px!important;background:transparent!important;border:none!important;outline:none!important;color:#fff!important;font-size:1rem!important;width:100%!important}.input-showcase .glass-morphism--input input::placeholder{color:#ffffffb3!important;opacity:1!important}.input-showcase .glass-morphism--input:before,.search-input-container .glass-morphism--input:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:inherit;padding:2px;background:linear-gradient(45deg,rgba(255,255,255,1),rgba(255,255,255,.3),rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,1));background-size:400% 400%;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;opacity:0;transition:opacity .3s ease;animation:none;pointer-events:none}.input-showcase .glass-morphism--input:focus-within:before,.search-input-container .glass-morphism--input:focus-within:before{opacity:1;animation:glowing-border 4s ease-in-out infinite}.search-input::placeholder{color:#fff9!important}.card-actions{display:flex;gap:15px;margin-top:20px}.card-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.card-header h3{color:#fff;margin:0;font-size:1.3rem;font-weight:600}.radio-showcase,.checkbox-showcase{display:flex;flex-direction:column;gap:15px;margin-top:20px}.chip-showcase{margin-top:20px}.chip-container{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.chip-variants{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.add-chip-btn{display:flex;align-items:center;gap:8px;padding:8px 16px!important;border-radius:20px!important;font-size:.9rem!important}.toast-showcase{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:20px}.tooltip-showcase{display:flex;flex-direction:column;gap:20px;margin-top:20px}.tooltip-row{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.tooltip-icon{width:48px;height:48px;border-radius:12px;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:all .3s ease}.tooltip-icon:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}.tooltip-text{color:#fff;font-size:1rem;font-weight:500;padding:8px 16px;border-radius:8px;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.2);cursor:pointer;transition:all .3s ease}.tooltip-text:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}.modal-controls{display:flex;gap:15px;justify-content:flex-end;margin-top:30px}.modal-controls .glass-button{padding:12px 24px!important;background:rgba(255,255,255,.1)!important;backdrop-filter:blur(20px) saturate(1.6) brightness(1.1)!important;-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1)!important;border:.5px solid rgba(255,255,255,.2)!important;border-radius:12px!important;color:#fff!important;font-weight:500!important;transition:all .3s ease!important}.modal-controls .glass-button:hover{background:rgba(255,255,255,.15)!important;transform:translateY(-2px)!important}.device-list{display:flex;flex-direction:column;gap:15px;margin-bottom:30px}.device-item{display:flex;align-items:center;gap:15px;padding:15px 20px;background:rgba(255,255,255,.05);backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);border:.5px solid rgba(255,255,255,.1);border-radius:16px;color:#fff;font-weight:500;transition:all .3s ease;cursor:pointer}.device-item:hover{background:rgba(255,255,255,.1);border-color:#fff3;transform:translateY(-2px)}.device-item span{font-size:1rem}.glass-controls-section{margin-bottom:40px}.control-panel{padding:30px!important}.control-header{text-align:center;margin-bottom:30px}.control-header h2{color:#fff;font-size:1.8rem;margin:15px 0 10px;font-weight:600}.control-header p{color:#fffc;font-size:1rem;margin:0}.controls-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px}.control-group{display:flex;flex-direction:column;gap:12px}.control-group label{display:flex;align-items:center;gap:8px;color:#fff;font-weight:500;font-size:.95rem}.control-slider{width:100%;height:6px;border-radius:3px;background:rgba(255,255,255,.2);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.control-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.9);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #0003}.control-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.9);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #0003}.preview-section{margin-bottom:40px}.preview-container{padding:40px!important}.preview-header{text-align:center;margin-bottom:40px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.1)}.preview-header h2{color:#fff;font-size:1.8rem;margin:15px 0 10px;font-weight:600}.preview-header p{color:#fffc;font-size:1rem;margin:0}.preview-demo{margin-top:40px;padding-top:30px;border-top:1px solid rgba(255,255,255,.1);text-align:center}.preview-demo h3{color:#fff;font-size:1.4rem;margin:0 0 10px;font-weight:600}.preview-demo p{color:#fffc;font-size:.95rem;margin:0 0 25px}.preview-content{display:flex;justify-content:center;gap:30px;flex-wrap:wrap}.preview-item{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;background:rgba(255,255,255,.05);border-radius:16px;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.preview-item:hover{background:rgba(255,255,255,.1);transform:translateY(-5px)}.preview-item span{color:#fff;font-weight:500;font-size:.9rem}@media (max-width: 1024px){.sidebar{width:240px}.main-content{margin-left:240px;padding:30px}.component-grid{grid-template-columns:1fr}.overview-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media (max-width: 768px){.sidebar{width:100%;height:auto;position:relative;top:0}.main-layout{flex-direction:column;padding-top:0}.main-content{margin-left:0;padding:20px}.sidebar-container{border-right:none!important;border-bottom:1px solid rgba(255,255,255,.1)!important}.sidebar-nav{display:flex;overflow-x:auto;padding:15px 20px;gap:10px}.sidebar-item{flex-shrink:0;padding:10px 15px;border-radius:20px;white-space:nowrap}.sidebar-item.active{border-right:none;border-bottom:3px solid rgba(255,255,255,.6)}.content-section h1{font-size:2rem}.header-icons{gap:10px}.header-icons>div{width:35px;height:35px}.button-showcase-container{gap:20px}.button-showcase{grid-template-columns:1fr;gap:12px}.icon-button-showcase{grid-template-columns:repeat(2,1fr);gap:15px}.toast-showcase,.controls-grid{grid-template-columns:1fr}.preview-content{gap:20px}}@media (max-width: 480px){.content-section h1{font-size:1.8rem}.component-card{padding:20px!important}.button-showcase-container{gap:15px}.button-showcase{grid-template-columns:1fr;gap:10px;padding:5px}.icon-button-showcase{grid-template-columns:1fr;gap:12px;padding:5px}.preview-content{flex-direction:column;align-items:center}}::selection{background:rgba(255,255,255,.3);color:#fff}::-moz-selection{background:rgba(255,255,255,.3);color:#fff}.app-footer{background:rgba(0,0,0,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.1);padding:20px 0;margin-top:40px}.footer-content{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.copyright{color:#fffc;font-size:.9rem;margin:0;font-weight:500}.footer-links{display:flex;gap:20px;align-items:center}.footer-link{display:flex;align-items:center;gap:8px;color:#ffffffe6;text-decoration:none;font-size:.9rem;font-weight:500;padding:8px 12px;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.footer-link:hover{background:rgba(255,255,255,.1);border-color:#fff3;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.footer-link svg{transition:transform .3s ease}.footer-link:hover svg{transform:scale(1.1)}@media (max-width: 768px){.footer-content{flex-direction:column;text-align:center;gap:15px}.footer-links{gap:15px}.footer-link{padding:6px 10px;font-size:.85rem}}@media (max-width: 480px){.footer-links{flex-direction:column;gap:10px}.footer-link{width:100%;justify-content:center}}.documentation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:30px;margin-top:30px}.props-section{margin:20px 0}.props-section h4{color:#ffffffe6;font-size:1.1rem;font-weight:600;margin-bottom:15px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}.props-list{display:flex;flex-direction:column;gap:12px}.prop-item{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:12px;transition:all .3s ease}.prop-item:hover{background:rgba(255,255,255,.08);border-color:#ffffff26;transform:translateY(-1px)}.prop-item code{background:rgba(0,123,255,.2);color:#4fc3f7;padding:4px 8px;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.85rem;font-weight:600;border:1px solid rgba(0,123,255,.3)}.prop-item span{color:#ffffffb3;font-size:.85rem;font-weight:500;margin-left:8px;font-style:italic}.prop-item p{color:#fffc;font-size:.9rem;margin:8px 0 0;line-height:1.4}@media (max-width: 768px){.documentation-grid{grid-template-columns:1fr;gap:20px}.props-list{gap:10px}.prop-item{padding:10px}.prop-item code{font-size:.8rem;padding:3px 6px}.prop-item span{font-size:.8rem}.prop-item p{font-size:.85rem}}.glass-properties-control{background:rgba(255,255,255,.05);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:20px;margin-bottom:30px;width:100%;box-sizing:border-box}.control-header{display:flex;align-items:center;gap:10px;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.1)}.control-header h3{color:#fff;font-size:1.1rem;font-weight:600;margin:0}.control-header p{color:#ffffffb3;font-size:.85rem;margin:0 0 0 auto}.controls-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.control-group{display:flex;flex-direction:column;gap:8px}.control-group label{display:flex;align-items:center;gap:8px;color:#ffffffe6;font-size:.85rem;font-weight:500}.control-slider{width:100%;height:6px;border-radius:3px;background:rgba(255,255,255,.1);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.control-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#007bff,#0056b3);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #007bff4d;transition:all .2s ease}.control-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #007bff66}.control-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#007bff,#0056b3);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #007bff4d;transition:all .2s ease}.control-slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 4px 12px #007bff66}@media (max-width: 768px){.controls-grid{grid-template-columns:1fr;gap:12px}.control-header{flex-direction:column;align-items:flex-start;gap:5px}.control-header p{margin-left:0}}.code-snippet{background:rgba(0,0,0,.3);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;margin-top:30px;margin-bottom:100px;overflow:hidden;width:100%;box-sizing:border-box}.code-header{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;background:rgba(0,0,0,.2);border-bottom:1px solid rgba(255,255,255,.1)}.code-title{display:flex;align-items:center;gap:10px;color:#fff;font-weight:500;font-size:.9rem}.language-badge{background:rgba(0,123,255,.2);color:#007bff;padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:600;border:1px solid rgba(0,123,255,.3)}.copy-button{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:8px 12px;color:#fff;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s ease}.copy-button:hover{background:rgba(255,255,255,.15);transform:translateY(-1px)}.copy-button.copied{background:rgba(40,167,69,.2);border-color:#28a74566;color:#28a745}.code-content{padding:20px;background:rgba(0,0,0,.1);overflow-x:auto}.code-content pre{margin:0;font-family:Fira Code,Monaco,Consolas,Courier New,monospace;font-size:.85rem;line-height:1.5;color:#e6e6e6;white-space:pre-wrap;word-wrap:break-word}.code-content code{color:inherit;background:none;padding:0;border-radius:0;font-family:inherit}.language-tsx .token.tag{color:#ff6b6b}.language-tsx .token.attr-name{color:#4ecdc4}.language-tsx .token.attr-value{color:#ffe66d}.language-tsx .token.punctuation{color:#a8a8a8}.language-tsx .token.keyword{color:#ff9ff3}.language-tsx .token.string{color:#ffe66d}.language-tsx .token.number{color:#4ecdc4}.language-tsx .token.boolean{color:#ff6b6b}.language-tsx .token.function{color:#4ecdc4}.language-tsx .token.comment{color:#6c757d;font-style:italic}@media (max-width: 768px){.code-header{padding:12px 15px;flex-direction:column;gap:10px;align-items:flex-start}.code-content{padding:15px}.code-content pre{font-size:.8rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.glass-surface{align-items:center;display:flex;justify-content:center;overflow:hidden;position:relative;transition:opacity .26s ease-out}.glass-surface__filter{height:100%;top:0;right:0;bottom:0;left:0;opacity:0;pointer-events:none;position:absolute;width:100%;z-index:-1}.glass-surface__content{align-items:center;border-radius:inherit;display:flex;flex-direction:column;height:100%;justify-content:center;padding:.5rem;position:relative;width:100%;z-index:1}.glass-surface--svg{-webkit-backdrop-filter:var(--filter-id,url(#glass-filter)) saturate(var(--glass-saturation,1));backdrop-filter:var(--filter-id,url(#glass-filter)) saturate(var(--glass-saturation,1));background:light-dark(hsl(0 0% 100%/var(--glass-frost,0)),hsl(0 0% 0%/var(--glass-frost,0)));box-shadow:inset 0 0 2px 1px light-dark(color-mix(in oklch,#000,transparent 85%),color-mix(in oklch,#fff,transparent 65%)),inset 0 0 10px 4px light-dark(color-mix(in oklch,#000,transparent 90%),color-mix(in oklch,#fff,transparent 85%)),0 4px 16px #11111a0d,0 8px 24px #11111a0d,0 16px 56px #11111a0d,inset 0 4px 16px #11111a0d,inset 0 8px 24px #11111a0d,inset 0 16px 56px #11111a0d}.glass-surface--fallback{backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.18);box-shadow:0 8px 32px #0000001f,0 2px 16px #00000014,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a,0 0 0 .5px #ffffff0d}@media (prefers-color-scheme:dark){.glass-surface--fallback{backdrop-filter:blur(40px) saturate(1.6) brightness(1.2) contrast(1.3);-webkit-backdrop-filter:blur(40px) saturate(1.6) brightness(1.2) contrast(1.3);background:hsla(0,0%,100%,.05);border:.5px solid hsla(0,0%,100%,.15);box-shadow:0 8px 32px #0003,0 2px 16px #00000026,inset 0 1px #fff3,inset 0 -1px #ffffff14,0 0 0 .5px #ffffff08}}@supports not (backdrop-filter:blur(10px)){.glass-surface--fallback{background:hsla(0,0%,100%,.25);box-shadow:inset 0 1px #fff9,inset 0 -1px #fff6,0 8px 32px #1f26874d,0 2px 16px #1f268733}.glass-surface--fallback:before{background:hsla(0,0%,100%,.1);border-radius:inherit;content:"";filter:blur(10px);top:0;right:0;bottom:0;left:0;position:absolute;z-index:-1}}@supports not (backdrop-filter:blur(10px)){@media (prefers-color-scheme:dark){.glass-surface--fallback{background:rgba(0,0,0,.4)}.glass-surface--fallback:before{background:hsla(0,0%,100%,.05)}}}.glass-surface:focus-visible{outline:2px solid light-dark(#007aff,#0a84ff);outline-offset:2px}.glass-modal-overlay{align-items:center;animation:modalFadeIn .3s ease-out;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:rgba(0,0,0,.5);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:9999}.glass-modal-content{animation:modalSlideIn .3s ease-out;backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.18);border-radius:24px;box-shadow:0 16px 48px #0003,0 8px 24px #00000026,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a;max-height:80vh;max-width:500px;overflow-y:auto;padding:40px;width:90%}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}@media (max-width:768px){.glass-modal-content{margin:20px;max-width:95%;padding:30px 20px}}.glass-sidebar-overlay{animation:sidebarFadeIn .3s ease-out;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);background:rgba(0,0,0,.3);bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999}.glass-sidebar-content{backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.18);bottom:0;box-shadow:0 16px 48px #0003,0 8px 24px #00000026,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a;height:100vh;overflow-y:auto;padding:40px;position:fixed;top:0}.glass-sidebar-left{animation:sidebarSlideInLeft .3s ease-out;border-radius:0 24px 24px 0;left:0}.glass-sidebar-right{animation:sidebarSlideInRight .3s ease-out;border-radius:24px 0 0 24px;right:0}.glass-sidebar-left,.glass-sidebar-right{bottom:0;height:100vh;top:0}@keyframes sidebarFadeIn{0%{opacity:0}to{opacity:1}}@keyframes sidebarSlideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes sidebarSlideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media (max-width:768px){.glass-sidebar-content{padding:30px 20px;width:100%!important}.glass-sidebar-left,.glass-sidebar-right{border-radius:0}}.glass-radio{align-items:center;cursor:pointer;display:flex;gap:12px;padding:8px 0;transition:all .3s ease}.glass-radio.disabled{cursor:not-allowed;opacity:.6}.glass-radio-input{display:none}.glass-radio-custom{backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);background:hsla(0,0%,100%,.08);border:2px solid hsla(0,0%,100%,.2);border-radius:50%;flex-shrink:0;height:20px;position:relative;transition:all .3s ease;width:20px}.glass-radio-custom:after{background:hsla(0,0%,100%,.9);border-radius:50%;content:"";height:8px;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s ease;width:8px}.glass-radio-input:checked+.glass-radio-custom{background:hsla(0,0%,100%,.15);border-color:#fff6;box-shadow:0 4px 16px #0000001a,inset 0 1px #ffffff4d,inset 0 -1px #ffffff1a}.glass-radio-input:checked+.glass-radio-custom:after{opacity:1}.glass-radio:hover .glass-radio-custom{background:hsla(0,0%,100%,.12);border-color:#ffffff4d}.glass-radio.disabled:hover .glass-radio-custom{background:hsla(0,0%,100%,.08);border-color:#fff3}.glass-radio-label{color:#fff;font-size:1rem;font-weight:500;-webkit-user-select:none;user-select:none}.glass-radio.disabled .glass-radio-label{color:#fff9}.glass-checkbox{align-items:center;cursor:pointer;display:flex;gap:12px;padding:8px 0;transition:all .3s ease}.glass-checkbox.disabled{cursor:not-allowed;opacity:.6}.glass-checkbox-input{display:none}.glass-checkbox-custom{backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);background:hsla(0,0%,100%,.08);border:2px solid hsla(0,0%,100%,.2);border-radius:6px;flex-shrink:0;height:20px;position:relative;transition:all .3s ease;width:20px}.glass-checkbox-custom:after{color:#fff;content:"✓";font-size:12px;font-weight:700;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s ease}.glass-checkbox-input:checked+.glass-checkbox-custom{background:hsla(0,0%,100%,.15);border-color:#fff6;box-shadow:0 4px 16px #0000001a,inset 0 1px #ffffff4d,inset 0 -1px #ffffff1a}.glass-checkbox-input:checked+.glass-checkbox-custom:after{opacity:1}.glass-checkbox:hover .glass-checkbox-custom{background:hsla(0,0%,100%,.12);border-color:#ffffff4d}.glass-checkbox.disabled:hover .glass-checkbox-custom{background:hsla(0,0%,100%,.08);border-color:#fff3}.glass-checkbox-label{color:#fff;font-size:1rem;font-weight:500;-webkit-user-select:none;user-select:none}.glass-checkbox.disabled .glass-checkbox-label{color:#fff9}.glass-chip{align-items:center;backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.6) brightness(1.1);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.2);border-radius:20px;box-shadow:0 4px 16px #0000001a,inset 0 1px #fff3,inset 0 -1px #ffffff1a;cursor:default;display:inline-flex;gap:8px;padding:8px 16px;transition:all .3s ease}.glass-chip:hover{background:hsla(0,0%,100%,.12);border-color:#ffffff4d;box-shadow:0 8px 24px #00000026,inset 0 1px #ffffff4d,inset 0 -1px #ffffff26;transform:translateY(-2px)}.glass-chip.disabled{cursor:not-allowed;opacity:.6}.glass-chip.disabled:hover{background:hsla(0,0%,100%,.08);border-color:#fff3;transform:none}.glass-chip-primary{background:rgba(59,130,246,.15);border-color:#3b82f64d}.glass-chip-primary:hover{background:rgba(59,130,246,.25);border-color:#3b82f666}.glass-chip-success{background:rgba(34,197,94,.15);border-color:#22c55e4d}.glass-chip-success:hover{background:rgba(34,197,94,.25);border-color:#22c55e66}.glass-chip-warning{background:rgba(245,158,11,.15);border-color:#f59e0b4d}.glass-chip-warning:hover{background:rgba(245,158,11,.25);border-color:#f59e0b66}.glass-chip-danger{background:rgba(239,68,68,.15);border-color:#ef44444d}.glass-chip-danger:hover{background:rgba(239,68,68,.25);border-color:#ef444466}.glass-chip-small{border-radius:16px;padding:4px 12px}.glass-chip-small .glass-chip-label{font-size:.75rem}.glass-chip-medium{border-radius:20px;padding:8px 16px}.glass-chip-medium .glass-chip-label{font-size:.875rem}.glass-chip-large{border-radius:24px;padding:12px 20px}.glass-chip-large .glass-chip-label{font-size:1rem}.glass-chip-label{color:#fff;font-weight:500;white-space:nowrap}.glass-chip-remove{align-items:center;background:none;border:none;border-radius:50%;color:#ffffffb3;cursor:pointer;display:flex;font-size:18px;font-weight:700;height:20px;justify-content:center;line-height:1;padding:0;transition:all .3s ease;width:20px}.glass-chip-remove:hover{background:hsla(0,0%,100%,.1);color:#fff}.glass-toast{animation:toastSlideIn .3s ease-out;max-width:400px;min-width:300px;position:fixed;z-index:10000}.glass-toast.hidden{animation:toastSlideOut .3s ease-in}.glass-toast-content{align-items:center;backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.18);border-radius:16px;box-shadow:0 16px 48px #0003,0 8px 24px #00000026,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a;display:flex;gap:12px;padding:16px 20px}.glass-toast-top-right{right:20px;top:20px}.glass-toast-top-left{left:20px;top:20px}.glass-toast-bottom-right{bottom:20px;right:20px}.glass-toast-bottom-left{bottom:20px;left:20px}.glass-toast-top-center{left:50%;top:20px;transform:translate(-50%)}.glass-toast-bottom-center{bottom:20px;left:50%;transform:translate(-50%)}.glass-toast-success .glass-toast-icon{color:#22c55ee6}.glass-toast-error .glass-toast-icon{color:#ef4444e6}.glass-toast-warning .glass-toast-icon{color:#f59e0be6}.glass-toast-info .glass-toast-icon{color:#3b82f6e6}.glass-toast-icon{flex-shrink:0;font-size:18px;font-weight:700}.glass-toast-message{color:#fff;flex:1;font-size:.95rem;font-weight:500;line-height:1.4}.glass-toast-close{align-items:center;background:none;border:none;border-radius:50%;color:#ffffffb3;cursor:pointer;display:flex;flex-shrink:0;font-size:20px;font-weight:700;height:24px;justify-content:center;line-height:1;padding:0;transition:all .3s ease;width:24px}.glass-toast-close:hover{background:hsla(0,0%,100%,.1);color:#fff}@keyframes toastSlideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes toastSlideOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100%)}}.glass-toast-top-left{animation:toastSlideInLeft .3s ease-out}.glass-toast-top-left.hidden{animation:toastSlideOutLeft .3s ease-in}.glass-toast-bottom-left{animation:toastSlideInLeft .3s ease-out}.glass-toast-bottom-left.hidden{animation:toastSlideOutLeft .3s ease-in}.glass-toast-top-center{animation:toastSlideInDown .3s ease-out}.glass-toast-top-center.hidden{animation:toastSlideOutUp .3s ease-in}.glass-toast-bottom-center{animation:toastSlideInUp .3s ease-out}.glass-toast-bottom-center.hidden{animation:toastSlideOutDown .3s ease-in}@keyframes toastSlideInLeft{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes toastSlideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-100%)}}@keyframes toastSlideInDown{0%{opacity:0;transform:translate(-50%) translateY(-100%)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toastSlideOutUp{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-100%)}}@keyframes toastSlideInUp{0%{opacity:0;transform:translate(-50%) translateY(100%)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toastSlideOutDown{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(100%)}}@media (max-width:768px){.glass-toast{max-width:calc(100vw - 40px);min-width:280px}.glass-toast-bottom-left,.glass-toast-bottom-right,.glass-toast-top-left,.glass-toast-top-right{left:20px;right:20px;transform:none}}.glass-tooltip-trigger{display:inline-block;position:relative}.glass-tooltip{animation:tooltipFadeIn .2s ease-out;pointer-events:none;position:absolute;z-index:10000}.glass-tooltip-content{backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);-webkit-backdrop-filter:blur(40px) saturate(1.8) brightness(1.1) contrast(1.2);background:hsla(0,0%,100%,.08);border:.5px solid hsla(0,0%,100%,.18);border-radius:12px;box-shadow:0 8px 32px #0003,0 4px 16px #00000026,inset 0 1px #ffffff40,inset 0 -1px #ffffff1a;color:#fff;font-size:.875rem;font-weight:500;line-height:1.4;padding:8px 12px;white-space:nowrap}.glass-tooltip-arrow{height:0;position:absolute;width:0}.glass-tooltip-arrow-top{border-top:6px solid hsla(0,0%,100%,.18);top:100%}.glass-tooltip-arrow-bottom,.glass-tooltip-arrow-top{border-left:6px solid transparent;border-right:6px solid transparent;left:50%;transform:translate(-50%)}.glass-tooltip-arrow-bottom{border-bottom:6px solid hsla(0,0%,100%,.18);bottom:100%}.glass-tooltip-arrow-left{border-left:6px solid hsla(0,0%,100%,.18);left:100%}.glass-tooltip-arrow-left,.glass-tooltip-arrow-right{border-bottom:6px solid transparent;border-top:6px solid transparent;top:50%;transform:translateY(-50%)}.glass-tooltip-arrow-right{border-right:6px solid hsla(0,0%,100%,.18);right:100%}.glass-tooltip-bottom,.glass-tooltip-top{transform:translate(-50%)}.glass-tooltip-left,.glass-tooltip-right{transform:translateY(-50%)}@keyframes tooltipFadeIn{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.glass-tooltip-bottom{animation:tooltipFadeInBottom .2s ease-out}@keyframes tooltipFadeInBottom{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.glass-tooltip-left{animation:tooltipFadeInLeft .2s ease-out}@keyframes tooltipFadeInLeft{0%{opacity:0;transform:translateY(-50%) translate(-4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.glass-tooltip-right{animation:tooltipFadeInRight .2s ease-out}@keyframes tooltipFadeInRight{0%{opacity:0;transform:translateY(-50%) translate(4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}@media (max-width:768px){.glass-tooltip-content{font-size:.8rem;padding:6px 10px}.glass-tooltip-arrow{border-width:4px}}@media (prefers-color-scheme:dark){.glass-tooltip-content{backdrop-filter:blur(40px) saturate(1.6) brightness(1.2) contrast(1.3);-webkit-backdrop-filter:blur(40px) saturate(1.6) brightness(1.2) contrast(1.3);background:hsla(0,0%,100%,.05);border:.5px solid hsla(0,0%,100%,.15)}}@supports not (backdrop-filter:blur(10px)){.glass-tooltip-content{background:rgba(0,0,0,.8);border:1px solid hsla(0,0%,100%,.2)}}
