*{margin:0;padding:0;box-sizing:border-box}
:root{--vermilion:#c41e1e;--saffron:#f5a623;--gold:#d4a017;--cream:#fdf5e6;--sandstone:#f5e6c8;--deepred:#8b1a1a}
body{font-family:'Mandali','Noto Sans Telugu',sans-serif;background:var(--cream);max-width:420px;margin:0 auto;overflow-x:hidden;line-height:1.7;width:100%}
h1,h2,.header p{font-family:'Tiro Telugu','Noto Sans Telugu',serif}
.menu-btn{position:fixed;top:12px;left:12px;z-index:1001;width:40px;height:40px;border-radius:50%;background:var(--deepred);border:2px solid var(--gold);color:var(--gold);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:999;opacity:0;pointer-events:none;transition:opacity .3s}
.menu-overlay.active{opacity:1;pointer-events:all}
.side-menu{position:fixed;top:0;left:-280px;width:260px;height:100%;background:linear-gradient(180deg,var(--deepred) 0%,#5a1010 100%);z-index:1000;transition:left .3s ease;padding:60px 0 20px;overflow-y:auto;box-shadow:4px 0 20px rgba(0,0,0,.4)}
.side-menu.active{left:0}
.side-menu .menu-header{text-align:center;padding:0 16px 20px;border-bottom:1px solid var(--gold)}
.side-menu .menu-header h3{color:var(--gold);font-size:14px;line-height:1.6}
.side-menu a{display:block;padding:14px 24px;color:var(--cream);text-decoration:none;font-size:15px;border-bottom:1px solid rgba(255,255,255,.1);transition:background .2s}
.side-menu a:active{background:rgba(255,255,255,.1)}
.side-menu a span{margin-right:10px}
/* Font Switcher */
.font-switcher{padding:12px 16px;border-bottom:1px solid var(--gold)}
.font-switcher-title{font-size:11px;color:var(--gold);margin-bottom:8px;text-align:center}
.font-chips{display:flex;gap:6px;justify-content:center}
.font-chip{padding:6px 10px;border-radius:20px;border:2px solid rgba(255,255,255,.2);background:transparent;color:var(--cream);font-size:12px;cursor:pointer;transition:all .2s}
.font-chip.active{border-color:#FFC000;background:rgba(255,192,0,.15);color:#FFC000}
/* Body Font Classes */
.font-traditional{font-family:'Tiro Telugu',serif!important}
.font-traditional h1,.font-traditional h2,.font-traditional h3{font-family:'Tiro Telugu',serif!important}
.font-clean{font-family:'Noto Sans Telugu',sans-serif!important}
.font-clean h1,.font-clean h2,.font-clean h3{font-family:'Noto Sans Telugu',sans-serif!important}
.font-beauty{font-family:'Mandali',sans-serif!important}
.font-beauty h1,.font-beauty h2,.font-beauty h3{font-family:'Mandali',sans-serif!important}
.ticker{background:var(--vermilion);color:var(--gold);padding:8px 0;overflow:hidden;white-space:nowrap;font-size:14px;font-weight:700}
.ticker-inner{display:inline-block;animation:scroll-left 20s linear infinite}
@keyframes scroll-left{0%{transform:translateX(100vw)}100%{transform:translateX(-100%)}}
.header{text-align:center;padding:16px 12px;background:linear-gradient(180deg,var(--saffron) 0%,var(--cream) 100%)}
.header-content{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px}
.header-text{text-align:center;width:100%}
.header-text h1{color:var(--deepred);font-size:19px;line-height:1.4;margin:0;letter-spacing:0.5px}
.header-text .village-name{font-size:12px;color:#555;font-weight:400;display:block;margin-top:2px}
.header .subtitle{color:var(--vermilion);font-size:13px;font-style:italic;margin-top:8px}
.card{margin:12px 10px;padding:16px;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.1)}
.card h2{font-size:16px;color:var(--deepred);margin-bottom:10px;text-align:center}
.card .note{font-size:11px;color:#555;text-align:center}
.donate-card{border:3px double var(--gold)}
.seva-grid{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.seva-btn{display:flex;align-items:center;gap:8px;padding:8px 10px;border:2px solid #eee;border-radius:8px;background:#fff;font-size:14px;font-weight:900;color:var(--deepred);cursor:pointer;text-align:left;font-family:inherit;transition:all .2s}
.seva-btn span{font-size:11px;font-weight:400;color:#666}
.seva-btn.active{border-color:#FFC000;background:rgba(255,192,0,.08);box-shadow:0 0 6px rgba(255,192,0,.3)}
.pay-btn{display:block;width:100%;padding:14px;border:none;border-radius:10px;background:linear-gradient(135deg,var(--vermilion),#5f259f);color:#fff;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;margin-bottom:12px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.pay-btn:active{transform:scale(0.98)}
.ledger-inline{background:linear-gradient(135deg,#1a1a2e,#16213e);color:#FFC000;padding:10px;border-radius:8px;text-align:center;font-size:13px;font-weight:700;margin-bottom:10px;font-family:monospace}
.recent-tx{margin-bottom:10px}
.recent-tx h4{font-size:12px;color:var(--deepred);margin-bottom:6px;text-align:center}
.tx-row{font-size:10px;padding:5px 8px;border:1px solid rgba(255,192,0,.3);border-radius:6px;margin-bottom:4px;background:rgba(255,248,220,.5);color:#333}
.live-indicator{display:flex;align-items:center;gap:6px;margin-bottom:8px;justify-content:center}
.live-dot{position:relative;width:8px;height:8px}
.live-dot::before{content:'';position:absolute;inset:0;background:#10b981;border-radius:50%}
.live-ping{position:absolute;inset:0;background:#10b981;border-radius:50%;animation:ping 1.5s cubic-bezier(0,0,.2,1) infinite;opacity:.75}
@keyframes ping{75%,100%{transform:scale(2);opacity:0}}
.live-text{font-size:11px;color:#666}
.live-count{font-weight:700;color:#059669}
/* --- Screen Fit Video Layout with Sleek Compact Buttons --- */
#news.card{padding:12px 0!important;overflow:hidden}
#news h2{padding:0 16px}
.video-carousel-wrapper{width:100%;overflow:hidden;margin:8px 0}
.video-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.video-track::-webkit-scrollbar{display:none}
.video-slide{min-width:100%;scroll-snap-align:start}
.video-wrap{position:relative;width:100%;padding-bottom:56.25%;background:#000}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%}

#videoDots{margin-top:6px!important}
.sub-card input{width:100%;padding:10px;margin-bottom:8px;border:1px solid #ccc;border-radius:6px;font-size:14px;font-family:inherit}
.sub-btn{width:100%;padding:12px;background:var(--vermilion);color:#fff;border:none;border-radius:6px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.footer{background:var(--deepred);color:var(--gold);text-align:center;padding:16px 8px;font-size:12px}
.footer p{margin-top:6px}
.loading{text-align:center;padding:20px;color:#999;font-size:13px}
.donor-wheel-card{background:linear-gradient(180deg,#E3242B,#990000);color:#fff;border:4px double #FFC000;padding:20px 16px;border-radius:20px;max-width:100%;margin:12px 10px;text-align:center;box-shadow:0 4px 20px rgba(0,0,0,.3)}
.donor-wheel-card h3{font-size:16px;color:#FFC000;margin-bottom:4px}
.donor-wheel-desc{font-size:10px;color:#fde68a;font-style:italic;margin-bottom:12px;line-height:1.5}
.donor-wheel-container{position:relative;height:180px;background:rgba(0,0,0,.3);border-radius:12px;border:1px solid rgba(200,50,50,.3);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}
.donor-wheel-highlight{position:absolute;top:50%;transform:translateY(-50%);left:0;right:0;height:40px;border-top:2px dashed rgba(255,192,0,.4);border-bottom:2px dashed rgba(255,192,0,.4);background:rgba(255,153,51,.1);pointer-events:none;z-index:1}
#wheel-scroller{width:100%;padding:10px 8px;z-index:2;overflow-y:auto;height:100%;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#wheel-scroller::-webkit-scrollbar{display:none}
.donor-wheel-note{font-size:9px;color:rgba(253,230,138,.8);margin-top:10px}
.donor-wheel-hint{font-size:10px;color:rgba(255,255,255,.6);margin-top:6px}
.story-card-icon{font-size:24px;margin-bottom:6px;text-align:center}
.card p{font-size:14px;line-height:1.7}
/* Bramho Carousel */
.swipe-hint-text{font-size:11px;color:#f5a623;text-align:center;margin-bottom:8px;font-style:italic}
.bramho-carousel-wrapper{width:100%;overflow:hidden;border-radius:12px}
.bramho-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.bramho-track::-webkit-scrollbar{display:none}
.bramho-card-slide{min-width:100%;scroll-snap-align:start;padding:16px;background:#fffdf9;border:2px solid var(--sandstone);border-radius:10px;box-shadow:inset 0 0 10px rgba(196,30,30,0.05)}
.bramho-card-slide h3{font-size:14px;color:var(--deepred);margin-bottom:8px;border-bottom:1px dashed var(--saffron);padding-bottom:4px}
.bramho-card-slide p{font-size:13px;line-height:1.6;color:#333;margin-bottom:8px}
/* Dots Indicator */
.dots-indicator{display:flex;justify-content:center;gap:8px;margin:12px auto 0 auto;width:100%;clear:both}
.dot{width:8px;height:8px;border-radius:50%;background:#ddd;transition:background .3s,transform .3s}
.dot.active{background:var(--gold);transform:scale(1.2)}
/* Volunteer form */
#volunteer.card{padding:16px}
#volunteerForm{display:flex;flex-direction:column;gap:12px;width:100%;margin-top:10px}
#volunteerForm input{width:100%;padding:10px;border:1px solid var(--sandstone);border-radius:6px;background:#fff;font-size:14px;color:#333;font-family:inherit}
#volunteerForm input:focus{outline:none;border-color:var(--gold)}
.vol-submit-btn{width:100%;padding:12px;background:var(--deepred);border:1px solid var(--gold);color:var(--gold);font-size:14px;font-weight:bold;border-radius:6px;cursor:pointer;margin-top:6px;font-family:inherit}
.vol-submit-btn:active{background:var(--vermilion);transform:scale(0.98)}
