.emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:12px;min-height:350px;max-height:calc(100vh - 200px);overflow-y:auto;border:3px solid lightseagreen;padding:16px;border-radius:16px;background-color:#fff;width:100%;max-width:800px;align-items:start;justify-items:center;transition:all .3s ease;box-shadow:0 4px 6px #0000001a}@media (max-width: 768px){.emoji-grid{max-height:calc(100vh - 250px);padding:12px;gap:8px}}@media (max-width: 480px){.emoji-grid{grid-template-columns:repeat(auto-fill,minmax(50px,1fr));padding:8px;gap:6px}}body.dark-mode .emoji-grid{background-color:#1e1e1e;border-color:#3a8b84;box-shadow:0 4px 6px #0003}.emoji-item{text-align:center;width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:calc(1.2em + .5vw);border-radius:12px;cursor:pointer;background-color:#fff;color:inherit;box-shadow:0 2px 4px #0000000d;transition:all .2s ease;opacity:0;animation:fadeIn .3s ease-in-out forwards;position:relative;transform:scale(1)}.emoji-item.selected{background-color:var(--primary-color);color:#fff;box-shadow:0 4px 12px #20b2aa33;transform:scale(1.05)}.emoji-item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a;background-color:#20b2aa1a}.emoji-item.selected:hover{transform:scale(1.05);box-shadow:0 6px 16px #20b2aa4d;background-color:var(--primary-dark)}.emoji-item:active{transform:translateY(0)}.emoji-item.selected:active{transform:scale(1.05)}@media (max-width: 768px){.emoji-item{font-size:calc(1em + .5vw)}}@media (max-width: 480px){.emoji-item{font-size:calc(.9em + .5vw)}}body.dark-mode .emoji-item{background-color:var(--card-background);box-shadow:0 2px 4px #0003}body.dark-mode .emoji-item.selected{background-color:var(--primary-color);box-shadow:0 4px 12px #20b2aa4d}body.dark-mode .emoji-item:hover{box-shadow:0 4px 8px #0000004d;background-color:#20b2aa26}body.dark-mode .emoji-item.selected:hover{box-shadow:0 6px 16px #20b2aa66;background-color:var(--primary-dark)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.search-container{position:relative;width:100%;max-width:600px;margin:0 auto 16px;display:flex;align-items:center}.search-input{width:100%;padding:12px 40px 12px 16px;font-size:calc(1rem + .2vw);border:2px solid #e0e0e0;border-radius:12px;transition:all .2s ease;background-color:#fff;color:#333;outline:none}.search-input:focus{border-color:#20b2aa;box-shadow:0 0 0 3px #20b2aa1a}.search-input::placeholder{color:#999}@media (max-width: 768px){.search-input{padding:10px 36px 10px 14px;font-size:1rem}}body.dark-mode .search-input{background-color:#2a2a2a;border-color:#404040;color:#e0e0e0}body.dark-mode .search-input:focus{border-color:#2a9d8f;box-shadow:0 0 0 3px #2a9d8f1a}body.dark-mode .search-input::placeholder{color:#666}.search-icon{position:absolute;right:10px;font-size:1.2em;color:gray;padding:5px}.filter-container{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;width:100%}@media (max-width: 768px){.filter-container{gap:8px}}.filter-select{min-width:150px;max-width:200px;padding:8px 36px 8px 16px;border:2px solid var(--border-color);border-radius:20px;transition:all .2s ease;background-color:var(--card-background);color:var(--text-color);font-size:.9rem;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:14px}.filter-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #20b2aa1a;outline:none}.filter-select:hover{border-color:var(--primary-color)}body.dark-mode .filter-select:hover{background-color:#2a9d8f1a}body.light-mode .filter-select:hover{background-color:#20b2aa0d}@media (max-width: 768px){.filter-select{min-width:130px;padding:6px 32px 6px 12px}}.filter-select option{background-color:var(--card-background);color:var(--text-color);padding:8px}.emoji-description{width:320px;padding:20px;border:2px solid var(--primary-color);border-radius:16px;background-color:var(--card-background);box-shadow:0 4px 12px #20b2aa1a;transition:all .3s ease;display:flex;flex-direction:column;gap:16px;position:sticky;top:100px}@media (max-width: 1024px){.emoji-description{width:100%;position:static}}body.dark-mode .emoji-description{box-shadow:0 4px 12px #20b2aa33}.selected-emoji{width:50px;height:50px;padding:5px;margin:10px 0;font-size:1.7em;border-radius:20px;background-color:#fff;box-shadow:0 4px 8px #0000001a;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease}.default-message{text-align:center;color:var(--text-color);opacity:.7;font-size:1.1rem;margin:20px 0}.emoji-title{text-transform:capitalize;font-size:1.2rem;font-weight:600;color:var(--text-color);margin:0}.info-section{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;align-items:baseline}.info-label{font-weight:500;color:var(--text-color);opacity:.8}.info-value{color:var(--text-color)}.section-title{font-size:1rem;font-weight:600;color:var(--text-color);margin:0;padding-top:8px;border-top:1px solid var(--border-color)}.related-container{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:15px;margin-top:15px;border:3px outset lightseagreen;border-radius:8px;background-color:#fffc;max-height:200px;overflow-y:auto;align-items:start;justify-items:center}.related-emoji{width:45px;height:45px;font-size:1.6em;display:flex;align-items:center;justify-content:center;border-radius:10px;box-shadow:0 2px 4px #0000001a;opacity:0;animation:relatedFadeIn .3s ease-in-out forwards;cursor:pointer}@keyframes relatedFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.theme-toggle-button{position:relative;display:inline-block;width:50px;height:50px;border-radius:50%;border:none;background-color:transparent;cursor:pointer;display:flex;justify-content:center;align-items:center;box-shadow:0 4px 8px #0003;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;font-size:1.5em}.theme-toggle-button:hover{box-shadow:0 6px 12px #00000026;transform:translateY(-2px)}.app-container{width:100%;max-width:1200px;margin:0 auto;padding:24px;display:flex;flex-direction:column;gap:24px}@media (max-width: 768px){.app-container{padding:16px;gap:16px}}.main-content{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}@media (max-width: 1024px){.main-content{grid-template-columns:1fr}}.search-section{width:100%;max-width:600px;margin:0 auto 8px;display:flex;flex-direction:column;gap:16px}.filter-section{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.app-header{background-color:#20b2aa;background-image:linear-gradient(135deg,lightseagreen,#2a9d8f);padding:16px max(20px,calc((100% - 1400px)/2));width:100%;position:fixed;top:0;left:0;z-index:1000;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease;box-shadow:0 2px 4px #0000001a}.app-header h1{margin:0;font-size:calc(1.5rem + .5vw);color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.1)}@media (max-width: 768px){.app-header{padding:12px 16px}}body.dark-mode .app-header{background-image:linear-gradient(135deg,#2a9d8f,#264653);box-shadow:0 2px 4px #0003}.app-wrapper:where(.astro-FQT3MZRT){width:100%;min-height:100vh;padding-top:60px}