@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Tajawal:wght@400;500;600;700;800&display=swap');
:root{--ink:#172b28;--teal:#256a55;--muted:#697a70;--paper:#fffefa;--cream:#f5f4ee;--line:#dce4d8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:17px Tajawal,'DM Sans',sans-serif}button,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.shell{max-width:1190px;margin:auto;padding:0 38px}.topbar{height:80px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;direction:ltr;font:600 19px 'DM Sans',sans-serif;letter-spacing:-.7px}.brand b{color:#33836a}.brand-mark{width:37px;height:37px;border-radius:10px;background:var(--ink);color:#fff;display:grid;place-items:center;font:800 23px 'DM Sans',sans-serif}.brand-mark span{color:#d5eb8a}.top-note{font:800 11px 'DM Sans',sans-serif;letter-spacing:2px;color:#658474;border:1px solid #d4e1d4;padding:9px 13px;border-radius:100px}.intro{padding:72px 0 47px;max-width:875px}.eyebrow,.step{font:800 12px 'DM Sans',Tajawal,sans-serif;letter-spacing:1.7px;color:#65917a}.eyebrow{direction:ltr;display:inline-flex;gap:12px;align-items:center}.dot{width:7px;height:7px;border-radius:50%;background:#81b987}.intro h1{font-size:clamp(48px,6vw,76px);line-height:1.16;letter-spacing:-2px;margin:23px 0}.intro h1 em{font-style:normal;color:#2d7d62}.intro p{font-size:20px;line-height:1.7;color:#607267;max-width:700px;margin:0}.workspace,.output{border:1px solid var(--line);background:var(--paper);border-radius:20px;padding:34px 39px;box-shadow:0 14px 45px #31594109}.form-head,.output-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:28px}.workspace h2,.output h2,.support h2{font-size:31px;margin:9px 0 0;line-height:1.1}.count{font-size:14px;color:#789084;font-weight:800}.workspace label{display:block;font-weight:800;margin-bottom:12px}.workspace textarea{display:block;width:100%;min-height:184px;border:1.5px solid #cbd9cc;border-radius:13px;background:#fbfdf9;padding:20px 23px;outline:0;resize:vertical;direction:ltr;text-align:left;font:600 18px/1.7 'DM Sans',Tajawal,sans-serif;color:var(--ink)}.workspace textarea:focus{border-color:#3d9372;box-shadow:0 0 0 4px #3d937226}.workspace textarea::placeholder{color:#b0c0b2}.form-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:19px;color:#819186;font-size:14px;font-weight:700}.actions{display:flex;gap:10px}.actions button,.copy{border-radius:10px;padding:12px 17px;font-weight:800;white-space:nowrap}.ghost,.copy{border:1px solid #c9ddca;background:#f3f8f0;color:#37654d}.ghost:hover,.copy:hover{background:#e7f1e2}.primary{border:1px solid #1c5843;background:#1c5843;color:#fff;min-width:158px}.primary:hover{background:#134a36}.primary span{font-family:'DM Sans',sans-serif;margin-inline-start:12px}.error{color:#a54832;font-weight:800;margin:13px 0 0}.output{margin-top:22px;background:#eaf2e8;border-color:#d5e4d3}.rows{display:grid;gap:9px}.row{display:grid;grid-template-columns:minmax(170px,1fr) minmax(230px,1.2fr);align-items:center;gap:15px;background:#fffefb;border:1px solid #dbe9d9;border-radius:10px;padding:14px 20px}.row-country{display:flex;align-items:center;gap:11px;font-weight:800}.row-country small{color:#94a396;font:600 12px 'DM Sans',sans-serif;margin-inline-start:5px}.row-value{font:700 18px 'DM Sans',sans-serif;direction:ltr;text-align:left;letter-spacing:.4px;user-select:all}.row-unsupported{color:#a45a3f;font-size:14px;font-weight:700}.copy{font-size:14px}.copy:disabled{opacity:.5;cursor:not-allowed}#copy-status{font-size:14px;color:#376e51;font-weight:700;margin:12px 0 0}.caution{display:flex;align-items:start;gap:16px;border:1px solid #eddac7;background:#fff7ee;border-radius:15px;margin:28px 0 66px;padding:20px 24px}.caution-icon{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:#f1c99f;color:#815126;font:800 17px 'DM Sans',sans-serif}.caution p{margin:0;line-height:1.68;color:#76675c}.caution b{color:#5f4a38}.support{border-top:1px solid var(--line);padding:33px 0 50px;display:grid;grid-template-columns:1fr 1fr;gap:55px}.support p{color:#65766b;line-height:1.75}.links{display:grid;gap:4px;align-content:start}.links a{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:13px 0;font-weight:800}.links a:hover{color:#23795a}footer{border-top:1px solid var(--line);padding:22px 0 30px;display:flex;justify-content:space-between;gap:16px;font-size:13px;color:#8a9a8e;font-weight:700}
.country-picker{position:relative}.search-field{display:flex;align-items:center;gap:10px;border:1.5px solid #cbd9cc;border-radius:13px;background:#fbfdf9;padding:0 15px}.search-field:focus-within{border-color:#3d9372;box-shadow:0 0 0 4px #3d937226}.search-field input{width:100%;height:54px;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:600 17px Tajawal,'DM Sans',sans-serif}.search-field input::placeholder{color:#a7b7aa}.search-field span{flex:none;direction:ltr;font:700 12px 'DM Sans',sans-serif;color:#88a08d}.picker-hint{font-size:13px;color:#819186;margin:8px 0 0}.field-divider{display:flex;align-items:center;gap:12px;color:#98a69b;font-size:13px;font-weight:700;margin:23px 0}.field-divider:before,.field-divider:after{content:'';height:1px;background:#e0e8dd;flex:1}.country-suggestions{position:absolute;z-index:20;top:83px;left:0;right:0;padding:6px;border:1px solid #ccddcd;border-radius:12px;background:#fffefa;box-shadow:0 16px 30px #244b3427;max-height:290px;overflow-y:auto}.country-suggestion{display:flex;align-items:center;gap:11px;width:100%;border:0;border-radius:8px;padding:10px 12px;background:transparent;text-align:right;color:var(--ink);font-weight:800}.country-suggestion:hover,.country-suggestion.active{background:#edf6e9}.country-suggestion small{color:#899b8b;font:600 12px 'DM Sans',sans-serif;margin-inline-start:auto}.country-empty{padding:12px;color:#8c7567;font-size:14px}
@media(max-width:720px){.shell{padding:0 17px}.topbar{height:68px}.top-note{font-size:9px;padding:7px 9px;letter-spacing:1px}.intro{padding:49px 0 33px}.intro h1{font-size:48px;letter-spacing:-1px}.intro p{font-size:17px}.workspace,.output{padding:23px 18px;border-radius:16px}.workspace h2,.output h2,.support h2{font-size:26px}.workspace textarea{min-height:180px}.form-bottom{align-items:stretch;flex-direction:column}.actions{justify-content:stretch}.actions button{flex:1}.row{grid-template-columns:1fr;gap:5px}.row-value{text-align:right}.support{grid-template-columns:1fr;gap:10px}footer{flex-direction:column;gap:5px}}
.row-source{display:block;margin-top:5px;color:var(--teal);font-size:12px;font-weight:700;text-decoration:underline;text-underline-offset:2px}.row-source:hover{color:#153e32}

