.glass-search{--bg-color: rgba(255, 255, 255, .25);--highlight: rgba(255, 255, 255, .75);--text: #ffffff;--input-bg: rgba(255, 255, 255, .1);--input-border: rgba(255, 255, 255, .2);--input-focus: rgba(255, 255, 255, .3);position:relative;width:100%;max-width:500px;border-radius:20px;overflow:visible;overflow:hidden;box-shadow:0 6px 24px #0003;transition:all .4s cubic-bezier(.4,0,.2,1)}.glass-filter,.glass-overlay,.glass-specular{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none}.glass-filter{z-index:1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);filter:drop-shadow(0 0 0 rgba(255,255,255,0))}.glass-overlay{z-index:2;background:var(--bg-color)}.glass-specular{z-index:3;box-shadow:inset 0 0 0 1px var(--highlight);border-radius:inherit;pointer-events:none}.glass-content{position:relative;z-index:4;color:var(--text)}.search-container{position:relative;padding:20px 20px 40px;display:flex;align-items:center;transition:padding .4s cubic-bezier(.4,0,.2,1)}.search-container.expanded{padding:25px 20px 45px}.search-icon{position:absolute;left:35px;font-size:18px;color:var(--text);opacity:.8;pointer-events:none;transition:all .4s cubic-bezier(.4,0,.2,1);transform-origin:center}.search-container.expanded .search-icon{transform:scale(1.1);opacity:1}.search-input{width:100%;padding:12px 45px;background:var(--input-bg);border:1px solid var(--input-border);border-radius:12px;color:var(--text);font-size:16px;transition:all .4s cubic-bezier(.4,0,.2,1);will-change:transform,box-shadow,background}.search-input:focus{outline:none;background:var(--input-focus);border-color:var(--highlight);transform:translateY(-2px);box-shadow:0 8px 16px #0000001a}.search-input:focus+.search-icon{opacity:1;transform:scale(1.1) translateY(-2px)}.search-input::placeholder{color:#fff9;transition:opacity .3s ease}.search-input:focus::placeholder{opacity:.4}.search-clear{position:absolute;right:35px;background:none;border:none;color:var(--text);opacity:0;cursor:pointer;font-size:16px;transition:opacity .3s ease;padding:5px;border-radius:50%;display:flex;align-items:center;justify-content:center}.search-clear:hover{background:#ffffff1a}.search-input:not(:placeholder-shown)~.search-clear{opacity:.7;pointer-events:auto}.search-suggestions{padding:0 20px;max-height:0;opacity:0;overflow:hidden;transform:translateY(-10px);transition:all .5s cubic-bezier(.4,0,.2,1);pointer-events:none;margin-top:-20px}.search-suggestions.active{max-height:300px;opacity:1;transform:translateY(0);pointer-events:auto;margin-top:0;padding-bottom:20px}.suggestion-group h4{font-size:14px;margin:0 0 10px;opacity:.7;font-weight:500;color:var(--text)}.suggestion-group ul{list-style:none;padding:0;margin:0}.suggestion-group li{padding:8px 12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:0;transform:translate(-10px);color:var(--text)}.search-suggestions.active .suggestion-group li{opacity:1;transform:translate(0)}.suggestion-group li:nth-child(1){transition-delay:.1s}.suggestion-group li:nth-child(2){transition-delay:.15s}.suggestion-group li:nth-child(3){transition-delay:.2s}.suggestion-group li:hover{background:#ffffff1a;transform:translate(5px)}.suggestion-group li i{opacity:.7;font-size:14px;transition:transform .3s ease}.suggestion-group li:hover i{transform:scale(1.1)}.glass-search{--bg-color: rgba(0, 0, 0, .4);--highlight: rgba(255, 255, 255, .1);--text: #ffffff;--input-bg: rgba(0, 0, 0, .3);--input-border: rgba(255, 255, 255, .15);--input-focus: rgba(0, 0, 0, .5)}.glass-icons-grid{display:flex;gap:16px}.glass-icon{--bg-color: rgba(255, 255, 255, .25);--highlight: rgba(255, 255, 255, .75);--icon-color: #ffffff;--icon-size: 50px;position:relative;width:var(--icon-size);height:var(--icon-size);border-radius:16px;overflow:hidden;background:transparent;cursor:pointer;transition:transform .2s ease;flex-shrink:0}.glass-icon:hover{transform:scale(1.1)}.glass-icon .glass-filter{z-index:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);filter:url(#glass-distortion) saturate(120%) brightness(1.15)}.glass-icon .glass-overlay{z-index:2;background:var(--bg-color)}.glass-icon .glass-specular{z-index:3;box-shadow:inset 1px 1px 1px var(--highlight)}.glass-icon .glass-content{position:relative;z-index:4;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.glass-icon .glass-content svg{width:50%;height:50%;color:var(--icon-color);transition:transform .2s ease}.glass-icon:hover .glass-content svg{transform:scale(.9)}@media(prefers-color-scheme:dark){.glass-icon{--bg-color: rgba(0, 0, 0, .25);--highlight: rgba(255, 255, 255, .15)}}