:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.5;font-weight:400;color:#0f172a;background-color:#a399ff;background-image:radial-gradient(at 97% 56%,hsla(55,79%,63%,1) 0px,transparent 50%),radial-gradient(at 71% 97%,hsla(53,99%,64%,1) 0px,transparent 50%),radial-gradient(at 61% 49%,hsla(65,70%,62%,1) 0px,transparent 50%),radial-gradient(at 2% 16%,hsla(212,89%,61%,1) 0px,transparent 50%),radial-gradient(at 90% 93%,hsla(323,73%,71%,1) 0px,transparent 50%),radial-gradient(at 0% 2%,hsla(343,89%,72%,1) 0px,transparent 50%),radial-gradient(at 31% 51%,hsla(174,77%,69%,1) 0px,transparent 50%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0}h1,h2,h3,p{margin:0;line-height:1.1}h1{font-size:2rem}h2{font-size:1.7rem}h3{font-size:1.4rem}ul,li{list-style:none;margin:0;padding:0}a{color:inherit;font-weight:500;border-radius:.2rem}a:hover{text-decoration:none}a:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.input-group{display:flex;flex-direction:column;gap:.5rem;max-width:400px}label{font-size:.9rem;font-weight:500}input,select{font-family:inherit;font-size:1rem;padding:.5rem;border:1px solid #a4a4a4;border-radius:.5rem;background-color:#fff}select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 256 256"><path d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"></path></svg>');background-repeat:no-repeat;background-position:right 8px center;background-size:16px;padding-right:2rem}input:focus-visible,select:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.sr-only{display:none}body{min-height:100vh}#root{padding:.5rem;display:grid;grid-template-rows:1fr auto;min-height:100vh}.app-container{background-color:#ffffff4d;border:1px solid rgba(255,255,255,.3);border-radius:1rem;max-width:1280px;width:100%;margin:0 auto}header{background-color:#ffffff1a;border-radius:1rem 1rem 0 0;border-bottom:1px solid rgba(255,255,255,.2);display:flex;align-items:center}.logo-container{border-right:1px solid rgba(255,255,255,.2);padding:1rem;background-color:#ffffff1a;border-radius:1rem 0 0}.header-content{padding:1rem}header .logo{width:40px;height:40px;display:flex}header h1{font-size:1.1rem;font-weight:700}header p{text-align:center;font-size:.75rem;color:#52525b;margin-top:.2rem}.search-bar{padding:1.4rem 1rem 1rem;display:flex;flex-direction:column;row-gap:.6rem}input,select{border:1px solid rgba(255,255,255,.3);background-color:#fff9}input::placeholder{color:#71717a}.loading{padding:0 1rem;font-size:.9rem;margin-top:.5rem}.error{padding:.5rem;border-radius:.5rem;margin:.5rem 1rem 0;font-size:.9rem;font-weight:500;color:#c02626;background-color:#fff9}.results-count{padding:0 1rem;margin-top:.5rem;font-size:.9rem;font-weight:500}.results-count .count{font-weight:700}.country-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));padding:1rem;gap:1rem}.country-card{background-color:#fff9;border:1px solid rgba(255,255,255,.3);border-radius:.5rem;overflow:hidden;padding:1rem}.country-header{display:flex;gap:.6rem;align-items:center}.flag{flex-shrink:0;width:40px;height:40px;overflow:hidden;border-radius:50%}.country-header img{width:100%;height:100%;object-fit:cover}.country-header h3{font-size:1.1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.country-info{margin-top:1rem;margin-bottom:.5rem;font-size:.9rem;display:grid;grid-template-columns:auto 1fr;gap:4px 20px}.country-info dd{margin-left:0}.country-info dt{color:#334155}.population{font-weight:600}footer{padding:3rem 1rem 2rem;max-width:580px;margin:0 auto}footer p{text-align:center;font-size:.8rem;line-height:1.5}footer a{display:inline-flex;align-items:center;gap:.2rem;white-space:nowrap}@media(min-width:448px){#root{padding:1rem}}@media(min-width:512px){.search-bar{display:grid;grid-template-columns:1fr auto;column-gap:.5rem;max-width:580px}select{min-width:180px}}
