@charset "UTF-8";*{margin:0;padding:0;box-sizing:border-box}body{color:#fff;background-color:#1b1a1f}.Inter{font-family:Inter}.Poppins{font-family:Poppins}.Roboto{font-family:Roboto}.Merriweather{font-family:Merriweather}main{max-width:700px;margin:auto;padding:16px;display:flex;flex-direction:column;align-items:center}#header{padding:30px;margin-bottom:1em;width:100%;height:130px;display:flex;gap:40px;align-items:center;justify-content:center;background-image:linear-gradient(#222127,#36353c)}#header h1{font-size:1.8em}select{appearance:none;background-color:#222;color:#e5e5e5;border:1px solid #2f2f2f;border-radius:10px;padding:12px 40px 12px 14px;margin-right:10px;font-size:1em;width:100%;max-width:220px;cursor:pointer}select{background-image:url("data:image/svg+xml;utf8,<svg fill='white' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-repeat:no-repeat;background-position:right 12px center}select:focus{outline:none;border-color:#ff8c1a;box-shadow:0 0 0 2px #ff8c1a40}@media(max-width:480px){#header h1{font-size:1.5em}select{font-size:.8em}}@media(max-width:400px){#header{height:150px;display:grid;grid-template-columns:auto auto;grid-template-rows:40px 10px;justify-content:start}#header img{grid-area:1 / 1}#header h1{grid-area:1 / 2;font-size:1.4em}#header select{grid-area:2 / 2;font-size:.8em}}.search-bar-container{display:grid;width:100%;margin-bottom:2em}input#searchBar{grid-area:1 / 1;width:100%;max-width:750px;padding:20px 16px;border-radius:16px;font-size:20px;font-family:inherit;font-weight:700;background-color:#202025;color:#f9fafb;outline:none;border:1px solid #374151;box-shadow:0 4px 12px #0006;transition:border-color .2s ease,box-shadow .2s ease}input#searchBar:focus{border-color:#6366f1;box-shadow:0 0 0 3px #6366f159}input#searchBar::placeholder{color:#717680;font-weight:500}input#searchBar:hover{border-color:#4b5563}.search-bar-container button{background:linear-gradient(to right,#ff8c1a,#ff6a00);color:#fff;border:none;font-size:1.5em;font-weight:700;border-radius:20px;padding:12px 20px;grid-area:1 / 1;justify-self:end;align-self:center;margin-right:16px}.search-bar-container button:hover{background-color:#d45500;transform:translateY(-2px);cursor:pointer}@media(max-width:400px){input#searchBar::placeholder{font-size:.6em}}@media(max-width:480px){input#searchBar::placeholder{font-size:.8em}.search-bar-container button{padding:8px 16px}}#word-container{display:flex;flex-direction:column;gap:20px;width:100%}#word-header{display:grid;width:100%}#searched-word{grid-area:1 / 1;font-size:4em;margin-bottom:10px;align-self:center}#phonetic-transcription{grid-area:2 / 1;color:#ff6a00;font-size:1.5em;font-weight:700;margin-bottom:30px}img#play-button{grid-area:1 / 2;justify-self:end;align-self:center;cursor:pointer;width:150px;height:150px}img#play-button:hover{transform:translatey(-10px)}@media(max-width:400px){#searched-word{font-size:2.8em}img#play-button{width:100px;height:100px}}#meaning-container{display:flex;flex-direction:column}div#part-of-speech-container{display:grid;grid-template-columns:max-content 1fr;gap:20px;margin-bottom:2em}#meaning-container #part-of-speech{grid-area:1 / 1;font-size:1.7em;font-weight:700}#meaning-container div#line{grid-area:1 / 2;align-self:center;font-size:2.2em;height:1px;background-color:#2a2a2a}.meaning{color:#a855f7;font-size:1.5rem;font-weight:600;margin-bottom:10px;border-left:4px solid #a855f7;padding-left:10px}#meaning-container ul{display:flex;flex-direction:column;gap:12px;font-size:1.3em;margin-bottom:1.5em}ul li::marker{color:#ff6a00}p#example{color:#757575;margin-top:.7em}.synonyms{display:flex;flex-flow:row wrap;gap:10px;margin-top:2em}.synonyms p{color:#757575;font-size:1.3em}.synonyms span{list-style-type:none;color:#ff6a00;font-size:1.2em;align-self:center;cursor:pointer;gap:5px}@media(max-width:480px){.meaning{font-size:1.3em}#meaning-container ul{font-size:1em}.synonyms p{font-size:1.2em}.synonyms li{font-size:.9em}}h1.emoji{margin-top:2em;text-align:center;font-size:3em}p.error-message{text-align:center;font-size:3em}