@font-face{font-family:"KuralTamil";src:url("assets/NotoSerifTamil-Regular.ttf") format("truetype");font-weight:400;font-display:swap}@font-face{font-family:"KuralTamil";src:url("assets/NotoSerifTamil-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
/* Premium Thirukkural UI — lightweight, no framework */
:root{color-scheme:light;--bg:#f4f5fb;--surface:#fff;--surface2:#f8f7ff;--ink:#17234a;--muted:#78819a;--line:#e8e9f2;--purple:#6551b5;--blue:#263d77;--gold:#d6ad62;--shadow:0 18px 55px rgba(31,42,91,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:radial-gradient(ellipse at 8% 4%,rgba(126,103,211,.11),transparent 32%),radial-gradient(ellipse at 95% 20%,rgba(54,110,180,.09),transparent 30%),var(--bg);color:var(--ink);font-family:"Noto Sans Tamil","Latha","Vijaya",system-ui,sans-serif;line-height:1.75;transition:background .25s,color .25s;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:radial-gradient(rgba(100,81,181,.12) .8px,transparent .8px);background-size:25px 25px;opacity:.28}
a{color:inherit}.topbar{height:72px;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(225,227,239,.85);display:flex;align-items:center;justify-content:space-between;padding:0 max(5%,calc((100% - 1120px)/2));position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.brand b{display:block;font-size:19px;letter-spacing:.1px}.brand small{display:block;color:var(--muted);font-size:11px}.brand-mark{width:43px;height:43px;border-radius:15px;background:linear-gradient(145deg,#1e3470,#7356c4);color:#ffe7a3;display:grid;place-items:center;font-family:serif;font-size:25px;box-shadow:0 7px 18px #493d9230}.top-actions{display:flex;gap:9px}.icon-btn{border:1px solid var(--line);background:var(--surface);border-radius:13px;width:42px;height:42px;font-size:19px;cursor:pointer;color:var(--ink);transition:transform .2s,border-color .2s}.icon-btn:hover{transform:translateY(-2px);border-color:#bcb0e8}
.container{max-width:1080px;margin:auto;padding:30px 20px 65px}.hero{border-radius:28px;padding:39px 20px 34px;text-align:center;color:#fff;background:radial-gradient(circle at 14% 0,rgba(132,121,224,.6),transparent 32%),radial-gradient(circle at 90% 100%,rgba(199,157,81,.22),transparent 27%),linear-gradient(125deg,#111e45 0%,#293d78 54%,#55418f 100%);box-shadow:0 22px 55px rgba(27,38,91,.2);position:relative;overflow:hidden;isolation:isolate;animation:heroIn .65s ease both}.hero:before,.hero:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.13);border-radius:50%;pointer-events:none;z-index:-1}.hero:before{width:310px;height:310px;right:-100px;top:-210px;box-shadow:0 0 0 24px rgba(255,255,255,.025),0 0 0 52px rgba(255,255,255,.02)}.hero:after{width:220px;height:220px;left:-100px;bottom:-160px;box-shadow:0 0 0 25px rgba(255,255,255,.025)}.hero-kicker{color:#f6d995;font-size:13px;letter-spacing:.4px}.hero h1{font-family:"Noto Serif Tamil","Latha",serif;font-size:clamp(35px,6vw,54px);line-height:1.45;margin:7px 0 0;color:#ffe5a4;text-shadow:0 4px 22px #0003}.hero p{margin:5px 0 22px;color:#e2e8fa;font-size:14px}.hero-stats{display:flex;justify-content:center;gap:clamp(25px,8vw,88px)}.hero-stats span{display:grid;line-height:1.5}.hero-stats b{font-size:23px;color:#ffdfa0}.hero-stats small{font-size:11px;color:#d4dcf4}
.reader-card{max-width:860px;margin:27px auto;background:var(--surface);border:1px solid rgba(228,229,241,.9);border-radius:26px;padding:27px 31px;box-shadow:var(--shadow);position:relative;overflow:hidden;animation:cardIn .55s .08s ease both}.reader-card:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,#d6ad62,#8c76dc,#3d69a5)}.reader-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.pill{background:linear-gradient(135deg,#f0edff,#f8f3ff);color:#5b45a8;padding:6px 14px;border-radius:30px;font-weight:700;font-size:12px}.progress-text{font-size:12px;color:var(--muted)}.progress-track{height:6px;background:#edf0f7;border-radius:9px;margin-top:15px;overflow:hidden}.progress-track span{display:block;height:100%;background:linear-gradient(90deg,#d6ad62,#9279d8,#5269bb);border-radius:9px;position:relative;transition:width .5s ease}.progress-track span:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:shine 2.8s linear infinite}.kural-content{text-align:center;padding:29px 5px 18px;animation:contentIn .45s ease both}.ornament{font-size:30px;color:#c69b4c;line-height:1}.kural-lines{font-family:"Noto Serif Tamil","Latha","Vijaya",serif;font-size:clamp(21px,3.5vw,29px);font-weight:600;line-height:2.05;color:#172653;margin:10px 0 15px}.kural-lines p{margin:0}.chapter-label{font-size:13px;color:#96702e}.meaning{background:linear-gradient(135deg,#fbf9f2,#f8f6ff);border:1px solid #eee8dc;border-radius:17px;padding:16px 20px;margin:9px 0 21px}.meaning h3{font-size:14px;color:#936d2c;margin:0 0 5px}.meaning p{margin:0;font-size:14px;color:#4c5260}.reader-controls{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:11px}.primary-btn,.secondary-btn{border:0;border-radius:13px;padding:12px 14px;font:600 13px "Noto Sans Tamil","Latha",sans-serif;text-align:center;text-decoration:none;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;transition:transform .2s,box-shadow .2s,filter .2s}.primary-btn:hover,.secondary-btn:hover{transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 9px 20px rgba(45,52,104,.16)}.primary-btn{background:linear-gradient(125deg,#263d77,#7055b8);color:#fff;box-shadow:0 6px 16px #344b8b25}.secondary-btn{background:var(--surface2);color:#39445f;border:1px solid var(--line)}.next-btn{background:linear-gradient(125deg,#b68b3e,#d7b36d);color:#fff}.extra-controls{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:16px 0 4px}.text-btn{background:transparent;border:1px solid transparent;border-radius:9px;color:#626b86;font:500 12px "Noto Sans Tamil","Latha",sans-serif;padding:7px 10px;cursor:pointer;transition:background .2s,color .2s}.text-btn:hover{background:#f1effb;color:#5b45a8}.auto-settings{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:10px;font-size:12px;color:#858ba0}.auto-settings select,.wide-select{border:1px solid var(--line);background:var(--surface);color:#35405c;border-radius:10px;padding:9px 12px;font:inherit}
.tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:25px 0}.tool-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:21px;box-shadow:0 9px 28px rgba(31,42,91,.045);transition:transform .22s,box-shadow .22s}.tool-card:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(31,42,91,.08)}.tool-card h2,.section-heading h2{font-size:17px;margin:0 0 14px;color:#1c2b52}.search-form{display:flex;gap:8px}.search-form input,.section-heading input{min-width:0;flex:1;border:1px solid var(--line);border-radius:12px;padding:11px 13px;font:13px "Noto Sans Tamil","Latha",sans-serif;outline:none;background:var(--surface);color:var(--ink);transition:border-color .2s,box-shadow .2s}.search-form input:focus,.section-heading input:focus{border-color:#8b79d0;box-shadow:0 0 0 3px rgba(117,95,190,.12)}.results{margin-top:14px;max-height:330px;overflow:auto}.results>a{display:block;padding:11px 2px;border-bottom:1px solid var(--line);text-decoration:none;color:#283454}.results>a strong,.results>a span{display:block}.results>a strong{font-size:12px}.results>a span{font-size:12px;color:#737c90}.wide-select{width:100%;font-size:13px}.muted{font-size:12px;color:#858da0}.chapter-section{margin-top:37px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:17px}.eyebrow{font-size:11px;color:#a17a37;letter-spacing:.5px}.section-heading h2{font-size:23px;margin:0}.section-heading input{max-width:270px}.chapter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.chapter-item{display:flex;align-items:center;gap:11px;padding:13px;background:var(--surface);border:1px solid var(--line);border-radius:15px;text-decoration:none;color:#273454;transition:transform .2s,border-color .2s,box-shadow .2s}.chapter-item:hover{transform:translateY(-3px);border-color:#c6b8ed;box-shadow:0 9px 22px rgba(32,45,82,.08)}.chapter-item[hidden]{display:none}.chapter-num{width:34px;height:34px;flex:none;border-radius:11px;background:linear-gradient(135deg,#f0edff,#f8f3ff);color:#6551ac;display:grid;place-items:center;font-size:12px;font-weight:700}.chapter-item b{display:block;font-size:12px}.chapter-item small{display:block;color:#9299a9;font-size:10px}.arrow{margin-left:auto;color:#a7aabc;font-size:22px}footer{text-align:center;background:linear-gradient(120deg,#14234b,#342e69);color:#fff;padding:30px 15px}footer p{font-family:"Noto Serif Tamil","Latha",serif;color:#e8d5a8}footer small{color:#aeb8d3;font-size:11px}.footer-brand{font-size:22px;color:#f1d69a;font-weight:700}
.install-body{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#15234a,#57458f)}.install-card{max-width:520px;width:100%;background:#fff;border-radius:22px;padding:30px;text-align:center;box-shadow:0 20px 60px #0003}.install-card h1{font-size:23px;color:#172653}.install-card p{font-size:13px;color:#727b90}.install-card .primary-btn{width:100%;margin:12px 0}.notice{padding:12px;border-radius:10px;margin:12px 0;font-size:13px}.success{background:#e8f8ee;color:#17683a}.error{background:#fff0f0;color:#a52b2b}.small-note{font-size:12px;color:#858da0;line-height:1.8}
.dark{color-scheme:dark;--bg:#101729;--surface:#1a2540;--surface2:#222e49;--ink:#e8ebf5;--muted:#aab4cc;--line:#2c3856;--shadow:0 18px 55px rgba(0,0,0,.2);background:radial-gradient(ellipse at 8% 4%,rgba(126,103,211,.13),transparent 32%),#101729;color:var(--ink)}.dark .topbar{background:rgba(22,32,55,.9);border-color:#2c3856}.dark .brand,.dark .kural-lines,.dark .tool-card h2,.dark .section-heading h2,.dark .chapter-item{color:#e8ebf5}.dark .meaning{background:linear-gradient(135deg,#252d40,#25253e);border-color:#3b4050}.dark .meaning p{color:#d5d9e5}.dark .meaning h3{color:#e8c77f}.dark .secondary-btn,.dark .auto-settings select,.dark .wide-select,.dark .search-form input,.dark .section-heading input{background:#222e49;border-color:#3b4968;color:#e8ebf5}.dark .icon-btn{background:#222e49;border-color:#3b4968;color:#fff}.dark .chapter-num{background:#39345c;color:#d8ccff}.dark .pill{background:#39345c;color:#d8ccff}.dark .text-btn{color:#bac3d8}.dark .text-btn:hover{background:#303657;color:#e3dcff}.dark .progress-track{background:#303b56}.dark .results>a{color:#e8ebf5;border-color:#303b56}.dark .results>a span{color:#aab4cc}
@keyframes heroIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes cardIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes contentIn{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shine{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:700px){.container{padding:18px 13px 43px}.topbar{padding:0 15px;height:64px}.hero{padding:29px 14px 26px;border-radius:22px}.hero p{font-size:12px}.reader-card{padding:20px 15px;border-radius:21px;margin:19px auto}.reader-controls{grid-template-columns:1fr 1fr;gap:8px}.reader-controls .next-btn{grid-column:1/-1;grid-row:2}.reader-controls .primary-btn{grid-column:2;grid-row:1}.tools-grid{grid-template-columns:1fr;gap:12px}.chapter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.chapter-item{padding:10px;gap:7px}.chapter-item b{font-size:11px}.chapter-item small{font-size:9px}.section-heading{align-items:stretch;flex-direction:column}.section-heading input{max-width:none}.progress-text{font-size:10px}.kural-content{padding:24px 0 16px}.meaning{padding:14px}.meaning p{font-size:13px}}
@media(max-width:370px){.chapter-grid{grid-template-columns:1fr}.hero-stats{gap:22px}.reader-controls{gap:6px}.primary-btn,.secondary-btn{font-size:11px;padding:10px 8px}}

/* esevai.net branding */
.site-logo{width:54px;height:54px;object-fit:contain;border-radius:50%;flex:0 0 54px;box-shadow:0 2px 10px rgba(107,66,27,.2)}
.brand{gap:10px;align-items:center}
@media(max-width:480px){.site-logo{width:44px;height:44px;flex-basis:44px}}