:root{--bg:#f5f7fb;--ink:#172033;--muted:#69758b;--line:#e7ebf2;--primary:#6257e8;--primary2:#8b5cf6;--teal:#16a6a1;--card:#fff;--shadow:0 18px 50px rgba(28,39,75,.08)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 8% 0%,#ebeaff 0,transparent 27%),radial-gradient(circle at 100% 20%,#e6fbf8 0,transparent 25%),var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.wrap{width:min(1120px,calc(100% - 40px));margin:auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:800;font-size:21px;letter-spacing:-.7px}.brandmark{width:39px;height:39px;border-radius:13px;background:linear-gradient(135deg,var(--primary),var(--primary2));color:white;display:grid;place-items:center;font-size:19px;box-shadow:0 8px 20px #6257e844}.brand small{display:block;font:600 9px system-ui;letter-spacing:1.8px;color:var(--muted);text-transform:uppercase;margin-top:-4px}.nav{display:flex;gap:26px;color:#5d6880;font-size:14px;font-weight:600}.nav a:hover{color:var(--primary)}.hero{padding:30px 0 16px;text-align:center}.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid #dedbff;background:#fff9;border-radius:99px;padding:7px 13px;color:#6558d9;font-size:12px;font-weight:800;letter-spacing:.5px}.dot{width:7px;height:7px;background:#19b69d;border-radius:50%;box-shadow:0 0 0 4px #19b69d20}.hero h1{font:800 clamp(30px,4vw,44px)/1.1 system-ui,sans-serif;letter-spacing:-1.5px;margin:12px auto 9px;max-width:850px}.gradient{background:linear-gradient(100deg,#5b55dd,#9a5de8 55%,#12a7a0);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:var(--muted);max-width:650px;margin:0 auto;font-size:15px}.stats{display:flex;justify-content:center;gap:30px;margin:27px auto 0;color:#778197;font-size:12px;font-weight:700}.stats span{display:flex;align-items:center;gap:7px}.stats b{color:#34405a}.section-head{display:block;margin:18px 0 0}.section-head h2{font:800 23px system-ui;margin:0;letter-spacing:-.7px}.section-head p{margin:3px 0 0;color:var(--muted);font-size:13px}.search-row{margin:13px 0 17px}.search{width:min(440px,100%);border:1px solid var(--line);background:#fff;border-radius:12px;padding:11px 14px;font:500 13px system-ui;outline:none}.search:focus,textarea:focus{border-color:#8d84f0!important;box-shadow:0 0 0 4px #7569e51c}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.tool-card{background:#ffffffd9;border:1px solid #e8ebf3;border-radius:17px;padding:18px;display:flex;gap:14px;align-items:center;min-height:93px;transition:.2s;box-shadow:0 4px 15px #25325a06}.tool-card:hover{transform:translateY(-3px);border-color:#c9c4ff;box-shadow:var(--shadow)}.tool-icon{width:43px;height:43px;flex:none;border-radius:13px;background:linear-gradient(135deg,#eeedff,#e5fbf8);display:grid;place-items:center;color:#6359dc;font-size:18px;font-weight:800}.tool-card strong{display:block;font-size:14px;line-height:1.35}.tool-card small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.arrow{margin-left:auto;color:#9aa3b5;font-size:19px}.footer{margin-top:65px;padding:25px 0 35px;border-top:1px solid var(--line);color:#8590a3;font-size:12px;display:flex;justify-content:space-between}.page-hero{padding:32px 0 20px}.crumb{font-size:12px;color:#8490a5;margin-bottom:16px}.crumb a{color:#655be0;font-weight:700}.page-hero h1{font:800 clamp(28px,4vw,42px)/1.18 system-ui;letter-spacing:-1.5px;margin:0 0 10px}.page-hero p{margin:0;color:var(--muted);max-width:760px;font-size:14px}.converter{background:#fff;border:1px solid #e7eaf2;border-radius:22px;box-shadow:var(--shadow);padding:23px;margin:18px 0 26px}.converter-top{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.direction{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800}.direction{flex-wrap:wrap;max-width:100%}.direction .translit-toggle{margin-left:6px;white-space:nowrap;flex:none}.pill{border-radius:99px;background:#f0efff;color:#6358d9;padding:6px 10px;font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.editor{border:1px solid var(--line);border-radius:15px;overflow:hidden;background:#fbfcff}.editor-head{padding:12px 15px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:800}.editor-head span:last-child{color:#8993a7;font-weight:600;font-size:10px;white-space:nowrap}.editor textarea{width:100%;height:230px;resize:vertical;border:0;outline:0;padding:17px;background:transparent;font:18px/1.8 system-ui,sans-serif;color:#263149}.editor textarea::placeholder{color:#a8b0bf}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px}.btn{border:0;border-radius:11px;padding:11px 17px;font:700 12px system-ui;cursor:pointer;transition:.18s}.btn-primary{background:linear-gradient(100deg,#6257e8,#7850d7);color:white;box-shadow:0 7px 16px #665be733}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 20px #665be744}.btn-soft{background:#f1f2f8;color:#536078}.btn-soft:hover{background:#e9e9f7}.btn-ghost{background:transparent;color:#778197}.hint{margin-left:auto;color:#98a1b2;font-size:11px}.font-select{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px 12px;color:#47536b;font:600 12px system-ui;max-width:100%}.info-panel{background:linear-gradient(120deg,#f0efff,#effaf9);border:1px solid #e7e7fa;border-radius:17px;padding:20px;margin:22px 0}.info-panel h2{font:800 17px system-ui;margin:0 0 7px}.info-panel p{margin:0;color:#66728a;font-size:13px}.seo-copy{padding:10px 0 25px;color:#68748a;font-size:13px}.seo-copy h2{font:800 19px system-ui;color:#263149;margin:20px 0 7px}.seo-copy p{margin:0 0 12px}.seo-copy ul{padding-left:20px}.mobile-menu{display:none}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}.nav{gap:14px}.editor-grid{grid-template-columns:1fr}.editor textarea{height:190px}.hint{width:100%;margin:0}.hero{padding-top:24px}.stats{gap:13px;flex-wrap:wrap}}@media(max-width:540px){.wrap{width:min(100% - 28px,1120px)}.topbar{height:66px}.nav{display:none}.hero h1{letter-spacing:-1.3px}.hero p{font-size:14px}.grid{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column;gap:12px}.search{width:100%}.converter{padding:14px;border-radius:17px}.converter-top{align-items:flex-start;flex-direction:column}.controls .btn{flex:1}.footer{flex-direction:column;gap:6px}.page-hero{padding-top:20px}}

/* Local legacy Tamil fonts: generated from supplied font archive. */
@font-face{font-family:'TamilBamini';src:url('/assets/fonts/bamini-v19.woff2') format('woff2'),url('/assets/fonts/bamini-v19.woff') format('woff'),url('/assets/fonts/bamini.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilChenet';src:url('/assets/fonts/chenet.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilDiamond';src:url('/assets/fonts/diamond.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilDinak';src:url('/assets/fonts/dinak.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilJeeva';src:url('/assets/fonts/jeeva.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilKa';src:url('/assets/fonts/ka.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilKruti';src:url('/assets/fonts/kruti-tamil.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilLTTM';src:url('/assets/fonts/lt-tm.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilMCL';src:url('/assets/fonts/mcl.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilSenthamizh';src:url('/assets/fonts/senthamizh.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilShreeLipi';src:url('/assets/fonts/shreelipi-tamil.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilSunTommy';src:url('/assets/fonts/suntommy.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilTab';src:url('/assets/fonts/tab.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilTAC';src:url('/assets/fonts/tac.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilTAM';src:url('/assets/fonts/tam.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilVanavil';src:url('/assets/fonts/vanavil.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:'TamilDCITmlIsmail';src:url('/assets/fonts/dcitmlismail.woff') format('woff');font-style:normal;font-weight:400;font-display:swap;}
/* Larger preview text only for fields displaying a supplied legacy Tamil font. */
.editor textarea[style*='font-family'],.editor textarea.legacy-font-preview{font-size:26px;line-height:1.6;}


/* Tamil transliteration control beside the converter direction label. */
.tamil-typing-toggle{display:inline-flex;align-items:center;gap:7px;min-height:33px;padding:5px 10px;border:1px solid #dedbff;border-radius:999px;background:#fff;color:#5148c7;font:700 11px/1.2 system-ui,sans-serif;cursor:pointer;transition:background .16s,border-color .16s,color .16s,box-shadow .16s}
.tamil-typing-toggle:hover{border-color:#a9a1f3;background:#f7f6ff}
.tamil-typing-toggle[aria-pressed="true"]{background:#efedff;border-color:#887cf0;color:#5046c8;box-shadow:0 2px 8px #6257e81a}
.tamil-typing-toggle b{display:inline-block;margin-left:2px;padding:3px 6px;border-radius:999px;background:#f0efff;color:#655bd7;font-size:9px}
.tamil-typing-toggle[aria-pressed="true"] b{background:#6257e8;color:#fff}
.tamil-typing-toggle .translit-switch{width:25px;height:15px;border-radius:99px;background:#c8cce0;padding:2px;transition:background .16s}
.tamil-typing-toggle .translit-switch span{display:block;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .16s}
.tamil-typing-toggle[aria-pressed="true"] .translit-switch{background:#6257e8}
.tamil-typing-toggle[aria-pressed="true"] .translit-switch span{transform:translateX(10px)}
}
.tamil-typing-toggle:focus-visible,.suggestion-option:focus-visible{outline:3px solid #8b82ed66;outline-offset:2px}
.suggestions-box{position:fixed;z-index:2147483000;width:min(320px,calc(100vw - 20px));height:218px;max-height:min(218px,calc(100dvh - 20px));display:flex;flex-direction:column;overflow:hidden;padding:8px;border:1px solid #dcdafa;border-radius:14px;background:#fff;color:#172033;box-shadow:0 16px 38px #29245e2a;opacity:0;transform:translateY(5px);transition:opacity .1s,transform .1s;pointer-events:none}
.suggestions-box[hidden]{display:none!important}
.suggestions-box.show{opacity:1;transform:translateY(0);pointer-events:auto}
.suggestion-head{display:flex;justify-content:space-between;gap:12px;padding:4px 6px 7px;color:#69758b;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.suggestion-list{display:flex;flex:0 0 142px;height:142px;flex-direction:column;gap:2px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.suggestion-option{display:flex;align-items:center;gap:10px;width:100%;min-height:34px;padding:5px 8px;border:0;border-radius:8px;background:transparent;color:#263149;text-align:left;font:500 16px/1.4 system-ui,sans-serif;cursor:pointer}
.suggestion-option .suggestion-number{width:16px;flex:0 0 16px;color:#8993a7;font-size:11px}
.suggestion-option .suggestion-word{flex:1}
.suggestion-option .suggestion-enter{color:#8993a7;font-size:12px}
.suggestion-option:hover,.suggestion-option.active{background:#f0efff;color:#5046c8}
.suggestion-list.stale{opacity:1}
.suggestion-foot{margin-top:5px;padding:6px 5px 2px;border-top:1px solid #e7ebf2;color:#8993a7;font-size:10px;line-height:1.35}
.suggestion-empty{padding:10px 8px;color:#69758b;font-size:12px}
@media(max-width:540px){.direction .translit-toggle{margin-left:2px}.tamil-typing-toggle{min-height:31px;padding:4px 8px;font-size:10px}.suggestions-box{width:min(300px,calc(100vw - 16px));max-height:min(208px,calc(100dvh - 16px));padding:7px}.suggestion-foot{display:none}}
@media(prefers-reduced-motion:reduce){.suggestions-box,.tamil-typing-toggle,.tamil-typing-toggle .translit-switch,.tamil-typing-toggle .translit-switch span{transition:none}}


/* Accessibility: AA contrast for secondary text and controls. */
:root{--muted:#596579}
.stats{color:#536078}
.arrow{color:#536078}
.footer{color:#596579}
.crumb{color:#596579}
.editor-head span:last-child{color:#536078}
.editor textarea::placeholder{color:#66728a;opacity:1}
.btn-ghost{color:#536078}
.hint{color:#536078}
.info-panel p{color:#536078}
.seo-copy{color:#596579}
.suggestion-option .suggestion-number,.suggestion-option .suggestion-enter,.suggestion-foot{color:#536078}

.seo-copy h3{font:700 15px system-ui;color:#263149;margin:16px 0 5px}
.seo-copy a{color:inherit;text-decoration:underline}

/* ---- description box (converter pages) ---- */
.seo-copy{box-sizing:border-box;background:linear-gradient(180deg,#ffffff,#faf9ff);border:1px solid #e3e0f5;border-top:5px solid #6c5ce7;border-radius:24px;box-shadow:0 18px 50px rgba(76,60,160,.10),0 2px 6px rgba(76,60,160,.06);padding:44px 52px;margin:32px 0 40px;color:#3d4960;font-size:18px;line-height:1.85}
.seo-copy h2{font:800 27px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;color:#1f2a44;letter-spacing:-.3px;margin:38px 0 12px;padding-left:14px;border-left:4px solid #6c5ce7}
.seo-copy h2:first-child{margin-top:0}
.seo-copy h3{font:700 20px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif;color:#2b3550;margin:26px 0 8px}
.seo-copy p{margin:0 0 16px;font-size:18px;line-height:1.85;color:#3d4960}
.seo-copy ul,.seo-copy ol{font-size:18px;line-height:1.85}
.seo-copy a{color:#5b4fd6;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.seo-copy strong{color:#1f2a44}
.seo-copy table{border-collapse:collapse;width:100%;max-width:560px;margin:10px 0 20px;font-size:17px;background:#fff;border-radius:12px;overflow:hidden}
.seo-copy th,.seo-copy td{border:1px solid #e3e0f5;padding:10px 14px;text-align:left}
.seo-copy th{background:#f1edff;color:#3f3796}
@media(max-width:700px){.seo-copy{padding:28px 20px;border-radius:18px;margin:22px 0 30px;font-size:17px}.seo-copy h2{font-size:23px}.seo-copy h3{font-size:18px}.seo-copy p,.seo-copy ul,.seo-copy ol{font-size:17px}}
@media print{.seo-copy{box-shadow:none}}