const { useState, useEffect, useRef, useMemo, useCallback } = React; /* ============================================================ DATA (mirror of biosphere_reserves.json — single source for the standalone app) ============================================================ */ const RESERVES = [ {id:"nilgiri",name:"Nilgiri Biosphere Reserve",state:["Tamil Nadu","Kerala","Karnataka"],latitude:11.50,longitude:76.50,yearEstablished:1986,yearUnesco:2000,areaSqKm:5520,unesco:true,frequentlyAsked:true,ecosystem:["Western Ghats"],mountainRange:"Western Ghats (Nilgiri Hills)",riverSystem:"Cauvery, Bhavani, Moyar",climate:"Tropical to montane temperate",elevationRange:"300 m – 2637 m (Doddabetta)",biome:"Tropical evergreen, montane shola-grassland, deciduous",flora:["Shola forests","Montane grasslands","Tropical evergreen","Bamboo","Rosewood","Teak"],fauna:["Asian Elephant","Bengal Tiger","Gaur","Sambar","Sloth Bear","Dhole"],importantSpecies:["Nilgiri Tahr","Lion-tailed Macaque","Nilgiri Langur","Malabar Giant Squirrel"],threatenedSpecies:["Lion-tailed Macaque (EN)","Nilgiri Tahr (EN)"],upscImportance:["FIRST biosphere reserve of India (1986)","Includes Bandipur, Nagarhole, Mudumalai, Mukurthi, Silent Valley, Wayanad","Part of the Western Ghats UNESCO World Heritage Site","Habitat of endemic Nilgiri Tahr & Lion-tailed Macaque"],smartBadges:["First in India","Western Ghats","Frequently Asked","Biodiversity Hotspot"],pyqs:[{year:"2020",exam:"Prelims",subject:"Environment",question:"Which protected areas are part of the Nilgiri Biosphere Reserve? (Mudumalai, Bandipur, Silent Valley, Mukurthi)"},{year:"2017",exam:"Prelims",subject:"Environment",question:"Locate the Lion-tailed Macaque's natural habitat."}],flashcards:[{q:"Which was the first Biosphere Reserve established in India?",a:"Nilgiri Biosphere Reserve (1986)",difficulty:"easy"},{q:"Which Western-Ghats-endemic primate is found in Nilgiri BR?",a:"Lion-tailed Macaque",difficulty:"medium"},{q:"Name three states the Nilgiri BR spreads across.",a:"Tamil Nadu, Kerala, Karnataka",difficulty:"easy"}],videos:[{type:"Documentary",title:"Nilgiri Wildlife",url:"https://www.youtube.com/results?search_query=nilgiri+biosphere+reserve+documentary"},{type:"UPSC Lecture",title:"Biosphere Reserves of India – UPSC",url:"https://www.youtube.com/results?search_query=biosphere+reserves+of+india+upsc"}],video360:[{title:"360° Western Ghats Flythrough",url:"https://www.youtube.com/results?search_query=western+ghats+360+drone"}]}, {id:"nanda-devi",name:"Nanda Devi Biosphere Reserve",state:["Uttarakhand"],latitude:30.40,longitude:79.95,yearEstablished:1988,yearUnesco:2004,areaSqKm:5860,unesco:true,frequentlyAsked:true,ecosystem:["Himalayan"],mountainRange:"Greater Himalayas (Garhwal)",riverSystem:"Rishiganga, Dhauliganga (Alaknanda)",climate:"Alpine to temperate Himalayan",elevationRange:"1800 m – 7817 m (Nanda Devi peak)",biome:"Temperate forest, alpine meadows (bugyals), cold desert",flora:["Alpine meadows","Birch","Rhododendron","Fir","Juniper","Brahma Kamal"],fauna:["Himalayan Musk Deer","Bharal (Blue Sheep)","Himalayan Tahr","Serow"],importantSpecies:["Snow Leopard","Asiatic Black Bear","Brown Bear","Himalayan Monal"],threatenedSpecies:["Snow Leopard (VU)","Himalayan Musk Deer (EN)"],upscImportance:["Encompasses Nanda Devi NP & Valley of Flowers NP","Both core areas are UNESCO World Heritage Sites","Source region of Alaknanda tributaries"],smartBadges:["Himalayan Ecosystem","UNESCO World Heritage","Frequently Asked"],pyqs:[{year:"2017",exam:"Prelims",subject:"Geography",question:"Valley of Flowers NP is in which state and which biosphere reserve?"}],flashcards:[{q:"Which biosphere reserve includes the Valley of Flowers NP?",a:"Nanda Devi Biosphere Reserve",difficulty:"medium"},{q:"In which state is Nanda Devi BR?",a:"Uttarakhand",difficulty:"easy"}],videos:[{type:"Documentary",title:"Nanda Devi & Valley of Flowers",url:"https://www.youtube.com/results?search_query=nanda+devi+valley+of+flowers+documentary"}],video360:[{title:"360° Himalayan Trek",url:"https://www.youtube.com/results?search_query=himalaya+360+video"}]}, {id:"nokrek",name:"Nokrek Biosphere Reserve",state:["Meghalaya"],latitude:25.45,longitude:90.35,yearEstablished:1988,yearUnesco:2009,areaSqKm:820,unesco:true,frequentlyAsked:false,ecosystem:["Northeast"],mountainRange:"Garo Hills",riverSystem:"Simsang (Someshwari)",climate:"Subtropical humid",elevationRange:"200 m – 1412 m (Nokrek Peak)",biome:"Subtropical broadleaf evergreen forest",flora:["Citrus indica (wild orange)","Orchids","Bamboo","Tropical evergreen"],fauna:["Red Panda","Asian Elephant","Hoolock Gibbon","Stump-tailed Macaque"],importantSpecies:["Citrus indica gene sanctuary","Red Panda","Marbled Cat"],threatenedSpecies:["Red Panda (EN)","Hoolock Gibbon (EN)"],upscImportance:["Believed origin centre of CITRUS (wild orange, Citrus indica)","Hosts India's only Citrus gene sanctuary","Located in the Garo Hills of Meghalaya"],smartBadges:["Northeast","UNESCO MAB","Citrus Gene Centre"],pyqs:[{year:"2019",exam:"Prelims",subject:"Environment",question:"Nokrek BR is famous as the origin of which fruit crop?"}],flashcards:[{q:"Nokrek BR is the gene centre of which fruit?",a:"Citrus (wild orange, Citrus indica)",difficulty:"medium"},{q:"In which hills is Nokrek located?",a:"Garo Hills, Meghalaya",difficulty:"easy"}],videos:[{type:"Geography",title:"Nokrek Biosphere Reserve",url:"https://www.youtube.com/results?search_query=nokrek+biosphere+reserve"}],video360:[{title:"360° Garo Hills",url:"https://www.youtube.com/results?search_query=meghalaya+360+video"}]}, {id:"great-nicobar",name:"Great Nicobar Biosphere Reserve",state:["Andaman & Nicobar Islands"],latitude:7.00,longitude:93.85,yearEstablished:1989,yearUnesco:2013,areaSqKm:885,unesco:true,frequentlyAsked:true,ecosystem:["Island"],mountainRange:"Island terrain (Mt. Thullier)",riverSystem:"Galathea, Alexandra, Dagmar",climate:"Tropical equatorial",elevationRange:"0 m – 642 m (Mt. Thullier)",biome:"Tropical evergreen rainforest, littoral & mangrove",flora:["Tropical wet evergreen","Mangroves","Pandanus","Giant evergreen trees"],fauna:["Saltwater Crocodile","Nicobar Macaque","Reticulated Python","Dugong"],importantSpecies:["Giant Leatherback Turtle","Nicobar Megapode","Nicobar Macaque","Dugong"],threatenedSpecies:["Leatherback Turtle (VU)","Nicobar Megapode (VU)","Dugong (VU)"],upscImportance:["Southernmost BR; includes Indira Point (southernmost point of India)","Contains Galathea NP & Campbell Bay NP","Nesting site of the Giant Leatherback Turtle","Topical: Great Nicobar development project"],smartBadges:["Island Ecosystem","UNESCO MAB","Frequently Asked","Current Affairs"],pyqs:[{year:"2021",exam:"Prelims",subject:"Environment",question:"Galathea Bay (leatherback turtle) lies in which biosphere reserve?"}],flashcards:[{q:"Which is the southernmost biosphere reserve of India?",a:"Great Nicobar Biosphere Reserve",difficulty:"medium"},{q:"Great Nicobar is the nesting site of which giant turtle?",a:"Leatherback Turtle",difficulty:"medium"}],videos:[{type:"Documentary",title:"Great Nicobar Biosphere",url:"https://www.youtube.com/results?search_query=great+nicobar+biosphere+reserve"}],video360:[{title:"360° Andaman Reefs",url:"https://www.youtube.com/results?search_query=andaman+360+underwater"}]}, {id:"gulf-of-mannar",name:"Gulf of Mannar Biosphere Reserve",state:["Tamil Nadu"],latitude:9.10,longitude:79.30,yearEstablished:1989,yearUnesco:2001,areaSqKm:10500,unesco:true,frequentlyAsked:true,ecosystem:["Island","Mangrove"],mountainRange:"Coastal / 21 islands",riverSystem:"Marine (Indian Ocean)",climate:"Tropical coastal",elevationRange:"Sea level",biome:"Coral reefs, seagrass beds, mangroves",flora:["Seagrass beds","Mangroves","Marine algae"],fauna:["Dugong","Dolphins","Sea Turtles","Sea cucumbers"],importantSpecies:["Dugong (Sea Cow)","Sacred Chank","Pearl Oyster","Corals"],threatenedSpecies:["Dugong (VU)","Sea Turtles"],upscImportance:["India's FIRST marine biosphere reserve","Chain of 21 islands between India & Sri Lanka","Known for coral reefs and the Dugong","First in Southeast Asia to be a Marine BR"],smartBadges:["Marine Ecosystem","First Marine BR","UNESCO MAB","Frequently Asked"],pyqs:[{year:"2014",exam:"Prelims",subject:"Environment",question:"Which Indian BR is known for dugongs and coral reefs?"}],flashcards:[{q:"Which is India's first marine biosphere reserve?",a:"Gulf of Mannar",difficulty:"medium"},{q:"Which Sea-Cow is the flagship of Gulf of Mannar?",a:"Dugong",difficulty:"medium"}],videos:[{type:"Biodiversity",title:"Gulf of Mannar Marine Life",url:"https://www.youtube.com/results?search_query=gulf+of+mannar+marine+national+park"}],video360:[{title:"360° Coral Reef Dive",url:"https://www.youtube.com/results?search_query=coral+reef+360+video"}]}, {id:"manas",name:"Manas Biosphere Reserve",state:["Assam"],latitude:26.72,longitude:91.00,yearEstablished:1989,yearUnesco:null,areaSqKm:2837,unesco:false,frequentlyAsked:true,ecosystem:["Northeast","Grassland"],mountainRange:"Himalayan foothills (Bhutan border)",riverSystem:"Manas River (Brahmaputra)",climate:"Subtropical humid",elevationRange:"61 m – 110 m (plains)",biome:"Alluvial grasslands, semi-evergreen & moist deciduous",flora:["Tall alluvial (terai) grasslands","Moist deciduous","Semi-evergreen"],fauna:["Bengal Tiger","Asian Elephant","Wild Water Buffalo","Indian Rhinoceros"],importantSpecies:["Pygmy Hog","Hispid Hare","Golden Langur","Bengal Florican","Assam Roofed Turtle"],threatenedSpecies:["Pygmy Hog (EN)","Golden Langur (EN)","Bengal Florican (CR)"],upscImportance:["Manas NP core is a UNESCO World Heritage Site (NOT a UNESCO MAB biosphere reserve)","A Tiger + Elephant + Biosphere Reserve together","Only home of endemic Pygmy Hog; Golden Langur stronghold","Trap: WH Site yes, MAB list no"],smartBadges:["Northeast","Tiger Reserve","World Heritage (core)","Frequently Asked"],pyqs:[{year:"2016",exam:"Prelims",subject:"Environment",question:"The Pygmy Hog is found primarily in which protected landscape?"}],flashcards:[{q:"Which endemic wild pig is found in the Manas landscape?",a:"Pygmy Hog",difficulty:"medium"},{q:"Is Manas part of the UNESCO MAB network?",a:"No — its NP core is a World Heritage Site, but it is NOT in the UNESCO MAB list",difficulty:"hard"}],videos:[{type:"Documentary",title:"Manas National Park",url:"https://www.youtube.com/results?search_query=manas+national+park+documentary"}],video360:[{title:"360° Assam Grasslands",url:"https://www.youtube.com/results?search_query=assam+grassland+360"}]}, {id:"sundarbans",name:"Sundarbans Biosphere Reserve",state:["West Bengal"],latitude:21.95,longitude:88.90,yearEstablished:1989,yearUnesco:2001,areaSqKm:9630,unesco:true,frequentlyAsked:true,ecosystem:["Mangrove"],mountainRange:"Deltaic plains",riverSystem:"Ganga–Brahmaputra–Meghna delta",climate:"Tropical humid coastal",elevationRange:"Sea level (deltaic)",biome:"Largest mangrove forest in the world (tidal halophytic)",flora:["Sundari (Heritiera fomes)","Mangrove species","Goran","Nypa palm"],fauna:["Royal Bengal Tiger","Saltwater Crocodile","Spotted Deer","Wild Boar"],importantSpecies:["Royal Bengal Tiger (swimming)","Estuarine Crocodile","Gangetic Dolphin","Fishing Cat"],threatenedSpecies:["Royal Bengal Tiger (EN)","Gangetic Dolphin (EN)"],upscImportance:["World's LARGEST mangrove forest / largest delta","UNESCO World Heritage + UNESCO MAB BR + Ramsar Site","Famous for swimming Royal Bengal Tigers","Named after the Sundari tree (Heritiera fomes)"],smartBadges:["Mangrove Ecosystem","World Heritage","Ramsar Site","Frequently Asked"],pyqs:[{year:"2015",exam:"Prelims",subject:"Environment",question:"The Sundari tree (Sundarbans namesake) is which type of vegetation?"}],flashcards:[{q:"Which BR is the world's largest mangrove forest with Royal Bengal Tigers?",a:"Sundarbans",difficulty:"easy"},{q:"After which tree are the Sundarbans named?",a:"Sundari tree (Heritiera fomes)",difficulty:"medium"}],videos:[{type:"Documentary",title:"Sundarbans – Tigers of the Mangroves",url:"https://www.youtube.com/results?search_query=sundarbans+tiger+documentary"}],video360:[{title:"360° Mangrove Boat Ride",url:"https://www.youtube.com/results?search_query=sundarbans+360+video"}]}, {id:"simlipal",name:"Simlipal Biosphere Reserve",state:["Odisha"],latitude:21.85,longitude:86.40,yearEstablished:1994,yearUnesco:2009,areaSqKm:4374,unesco:true,frequentlyAsked:true,ecosystem:["Deccan","Grassland"],mountainRange:"Eastern Ghats (Mayurbhanj)",riverSystem:"Budhabalanga, Salandi, Khairi",climate:"Tropical moist",elevationRange:"300 m – 1158 m (Khairiburu)",biome:"Tropical moist & dry deciduous, sal forest, grasslands",flora:["Sal (Shorea robusta)","Orchids","Medicinal plants","Grasslands"],fauna:["Bengal Tiger","Asian Elephant","Gaur","Chausingha (Four-horned Antelope)"],importantSpecies:["Melanistic (black) Tigers","Elephant","Mugger Crocodile"],threatenedSpecies:["Bengal Tiger (EN)"],upscImportance:["Famous for MELANISTIC (black) tigers — unique in India","A Tiger + Elephant + Biosphere Reserve","In Mayurbhanj district, Eastern Ghats","Mugger crocodile breeding programme"],smartBadges:["Tiger Reserve","UNESCO MAB","Black Tigers","Frequently Asked"],pyqs:[{year:"2018",exam:"Prelims",subject:"Environment",question:"Simlipal, known for melanistic tigers, is in which state?"}],flashcards:[{q:"Which Indian reserve is famous for melanistic (black) tigers?",a:"Simlipal (Odisha)",difficulty:"medium"},{q:"In which state is Simlipal Biosphere Reserve?",a:"Odisha",difficulty:"easy"}],videos:[{type:"Documentary",title:"Simlipal Tiger Reserve",url:"https://www.youtube.com/results?search_query=simlipal+tiger+reserve+documentary"}],video360:[{title:"360° Simlipal Forest",url:"https://www.youtube.com/results?search_query=simlipal+360"}]}, {id:"dibru-saikhowa",name:"Dibru-Saikhowa Biosphere Reserve",state:["Assam"],latitude:27.60,longitude:95.40,yearEstablished:1997,yearUnesco:null,areaSqKm:765,unesco:false,frequentlyAsked:false,ecosystem:["Northeast","Grassland"],mountainRange:"Brahmaputra floodplain",riverSystem:"Brahmaputra, Dibru, Lohit",climate:"Tropical monsoon (high rainfall)",elevationRange:"110 m – 126 m",biome:"Semi-wet evergreen, deciduous, swamp & grassland (river island)",flora:["Wet evergreen","Swamp grasslands","Riverine reeds"],fauna:["Feral Horses","Bengal Tiger","Elephant","Capped Langur"],importantSpecies:["Feral (wild) Horses","White-winged Wood Duck","Gangetic Dolphin","Black-breasted Parrotbill"],threatenedSpecies:["White-winged Wood Duck (EN)","Gangetic Dolphin (EN)"],upscImportance:["Largest swamp forest in NE India; famous for FERAL HORSES","Major migratory bird hotspot on a Brahmaputra river island","Identified Important Bird Area"],smartBadges:["Northeast","Bird Hotspot","Riverine Island"],pyqs:[{year:"2013",exam:"Prelims",subject:"Geography",question:"Dibru-Saikhowa is associated with which river system of Assam?"}],flashcards:[{q:"Which biosphere reserve is famous for feral horses?",a:"Dibru-Saikhowa (Assam)",difficulty:"hard"},{q:"Dibru-Saikhowa lies on a river island of which river?",a:"Brahmaputra",difficulty:"medium"}],videos:[{type:"Geography",title:"Dibru-Saikhowa NP",url:"https://www.youtube.com/results?search_query=dibru+saikhowa+national+park"}],video360:[{title:"360° Brahmaputra Island",url:"https://www.youtube.com/results?search_query=brahmaputra+360"}]}, {id:"dehang-dibang",name:"Dehang-Dibang (Dihang-Dibang) Biosphere Reserve",state:["Arunachal Pradesh"],latitude:28.50,longitude:95.20,yearEstablished:1998,yearUnesco:null,areaSqKm:5112,unesco:false,frequentlyAsked:false,ecosystem:["Himalayan","Northeast"],mountainRange:"Eastern Himalayas (Mishmi Hills)",riverSystem:"Siang (Dihang) & Dibang (Brahmaputra)",climate:"Alpine to subtropical",elevationRange:"500 m – 5500 m+",biome:"Alpine meadows, temperate & subtropical forest",flora:["Rhododendron","Conifers","Alpine meadows","Orchids"],fauna:["Mishmi Takin","Red Panda","Musk Deer","Gongshan Muntjac"],importantSpecies:["Mishmi Takin","Red Panda","Snow Leopard","Clouded Leopard"],threatenedSpecies:["Red Panda (EN)","Snow Leopard (VU)"],upscImportance:["One of the highest-elevation BRs (Eastern Himalayas)","Spans the Dihang (Siang) & Dibang valleys of Arunachal","Habitat of the rare Mishmi Takin & Red Panda"],smartBadges:["Himalayan Ecosystem","Northeast","Biodiversity Hotspot"],pyqs:[{year:"2012",exam:"Prelims",subject:"Geography",question:"The Dihang-Dibang Biosphere Reserve is in which state?"}],flashcards:[{q:"In which state is the Dehang-Dibang Biosphere Reserve?",a:"Arunachal Pradesh",difficulty:"easy"},{q:"Which goat-antelope is a flagship of Dehang-Dibang?",a:"Mishmi Takin",difficulty:"hard"}],videos:[{type:"Geography",title:"Dihang-Dibang",url:"https://www.youtube.com/results?search_query=dihang+dibang+biosphere+reserve"}],video360:[{title:"360° Eastern Himalaya",url:"https://www.youtube.com/results?search_query=arunachal+360"}]}, {id:"pachmarhi",name:"Pachmarhi Biosphere Reserve",state:["Madhya Pradesh"],latitude:22.40,longitude:78.40,yearEstablished:1999,yearUnesco:2009,areaSqKm:4926,unesco:true,frequentlyAsked:false,ecosystem:["Deccan","Grassland"],mountainRange:"Satpura Range",riverSystem:"Tawa, Denwa (Narmada)",climate:"Tropical, sub-humid",elevationRange:"320 m – 1352 m (Dhupgarh, highest in MP)",biome:"Tropical moist & dry deciduous, sal & teak",flora:["Sal","Teak","Bamboo","Medicinal plants","Wild mango"],fauna:["Tiger","Leopard","Gaur","Chinkara","Wild Dog"],importantSpecies:["Indian Giant Squirrel","Flying Squirrel","Leopard"],threatenedSpecies:["Tiger (EN)"],upscImportance:["Includes Satpura, Bori & Pachmarhi sanctuaries (Satpura Range)","Dhupgarh (1352 m) — highest point of MP/Satpuras","Catchment of Tawa & Denwa (Narmada)"],smartBadges:["Satpura Range","UNESCO MAB","Tiger Habitat"],pyqs:[{year:"2011",exam:"Prelims",subject:"Geography",question:"The Pachmarhi Biosphere Reserve lies in which mountain range?"}],flashcards:[{q:"Pachmarhi Biosphere Reserve lies in which range?",a:"Satpura Range",difficulty:"medium"},{q:"Which BR contains Dhupgarh, highest point of MP?",a:"Pachmarhi",difficulty:"hard"}],videos:[{type:"Geography",title:"Pachmarhi Satpura",url:"https://www.youtube.com/results?search_query=pachmarhi+biosphere+reserve"}],video360:[{title:"360° Satpura Hills",url:"https://www.youtube.com/results?search_query=satpura+360"}]}, {id:"khangchendzonga",name:"Khangchendzonga Biosphere Reserve",state:["Sikkim"],latitude:27.50,longitude:88.30,yearEstablished:2000,yearUnesco:2018,areaSqKm:2620,unesco:true,frequentlyAsked:true,ecosystem:["Himalayan"],mountainRange:"Greater Himalayas",riverSystem:"Teesta, Rangit",climate:"Alpine to subtropical (great altitudinal range)",elevationRange:"1220 m – 8586 m (Kangchenjunga, 3rd highest peak)",biome:"Tropical, temperate, alpine & cold desert (full gradient)",flora:["Rhododendron (Sikkim state tree)","Oak","Fir","Medicinal herbs","Orchids"],fauna:["Snow Leopard","Red Panda (Sikkim state animal)","Himalayan Tahr","Musk Deer"],importantSpecies:["Snow Leopard","Red Panda","Himalayan Blue Sheep","Himalayan Monal"],threatenedSpecies:["Snow Leopard (VU)","Red Panda (EN)"],upscImportance:["Khangchendzonga NP core is India's FIRST 'Mixed' UNESCO World Heritage Site (2016)","Surrounds the world's 3rd-highest peak, Kangchenjunga (8586 m)","Added to UNESCO MAB world network in 2018"],smartBadges:["Himalayan Ecosystem","Mixed World Heritage","UNESCO MAB","Frequently Asked"],pyqs:[{year:"2019",exam:"Prelims",subject:"Environment",question:"Khangchendzonga NP is which type of UNESCO World Heritage Site?"}],flashcards:[{q:"Which NP is India's first 'Mixed' UNESCO World Heritage Site?",a:"Khangchendzonga NP (Sikkim)",difficulty:"hard"},{q:"Khangchendzonga BR surrounds which peak?",a:"Kangchenjunga — world's 3rd highest",difficulty:"medium"}],videos:[{type:"Documentary",title:"Khangchendzonga NP",url:"https://www.youtube.com/results?search_query=khangchendzonga+national+park"}],video360:[{title:"360° Kangchenjunga",url:"https://www.youtube.com/results?search_query=kangchenjunga+360"}]}, {id:"agasthyamalai",name:"Agasthyamalai Biosphere Reserve",state:["Kerala","Tamil Nadu"],latitude:8.60,longitude:77.25,yearEstablished:2001,yearUnesco:2016,areaSqKm:3500,unesco:true,frequentlyAsked:false,ecosystem:["Western Ghats"],mountainRange:"Southern Western Ghats",riverSystem:"Tamiraparani, Karamana, Neyyar",climate:"Tropical wet",elevationRange:"100 m – 1868 m (Agasthyamalai peak)",biome:"Tropical evergreen & semi-evergreen, shola-grassland",flora:["Tropical evergreen","Cardamom","Arogyapacha (medicinal)","Reeds"],fauna:["Tiger","Asian Elephant","Nilgiri Tahr","Lion-tailed Macaque"],importantSpecies:["Lion-tailed Macaque","Nilgiri Tahr","Endemic amphibians"],threatenedSpecies:["Lion-tailed Macaque (EN)","Nilgiri Tahr (EN)"],upscImportance:["Spans Kerala & Tamil Nadu in the southern Western Ghats","Includes Neyyar, Peppara, Shendurney sanctuaries & Kalakad-Mundanthurai TR","Known for the Kani tribe & medicinal Arogyapacha","One of the most species-rich Western Ghats centres"],smartBadges:["Western Ghats","UNESCO MAB","Biodiversity Hotspot"],pyqs:[{year:"2018",exam:"Prelims",subject:"Environment",question:"Which BR spans both Kerala and Tamil Nadu in the southern Western Ghats?"}],flashcards:[{q:"Which biosphere reserve spans Kerala and Tamil Nadu?",a:"Agasthyamalai",difficulty:"medium"},{q:"Agasthyamalai is part of which mountain range?",a:"Western Ghats (southern)",difficulty:"easy"}],videos:[{type:"Geography",title:"Agasthyamalai BR",url:"https://www.youtube.com/results?search_query=agasthyamalai+biosphere+reserve"}],video360:[{title:"360° Southern Western Ghats",url:"https://www.youtube.com/results?search_query=western+ghats+360"}]}, {id:"achanakmar-amarkantak",name:"Achanakmar-Amarkantak Biosphere Reserve",state:["Madhya Pradesh","Chhattisgarh"],latitude:22.55,longitude:81.75,yearEstablished:2005,yearUnesco:2012,areaSqKm:3835,unesco:true,frequentlyAsked:false,ecosystem:["Deccan"],mountainRange:"Maikal Range (Satpura-Maikal)",riverSystem:"Source of Narmada, Son & Johila (Amarkantak)",climate:"Tropical sub-humid",elevationRange:"200 m – 1048 m",biome:"Tropical moist & dry deciduous, sal forest",flora:["Sal","Teak","Bamboo","Medicinal plants"],fauna:["Tiger","Leopard","Bison (Gaur)","Wild Dog","Hyena"],importantSpecies:["Tiger","Indian Giant Squirrel","Sloth Bear"],threatenedSpecies:["Tiger (EN)"],upscImportance:["Straddles Madhya Pradesh & Chhattisgarh on the Maikal Range","Amarkantak is the SOURCE of the Narmada & Son rivers","Includes Achanakmar Tiger Reserve"],smartBadges:["Narmada Source","UNESCO MAB","Tiger Habitat"],pyqs:[{year:"2014",exam:"Prelims",subject:"Geography",question:"Amarkantak is the source of which two major rivers?"}],flashcards:[{q:"Amarkantak is the source of which rivers?",a:"Narmada and Son (also Johila)",difficulty:"medium"},{q:"Achanakmar-Amarkantak BR is across which two states?",a:"Madhya Pradesh and Chhattisgarh",difficulty:"medium"}],videos:[{type:"Geography",title:"Achanakmar-Amarkantak",url:"https://www.youtube.com/results?search_query=achanakmar+amarkantak+biosphere"}],video360:[{title:"360° Maikal Range",url:"https://www.youtube.com/results?search_query=amarkantak+360"}]}, {id:"great-rann-of-kutch",name:"Great Rann of Kutch Biosphere Reserve",state:["Gujarat"],latitude:23.85,longitude:70.20,yearEstablished:2008,yearUnesco:null,areaSqKm:12454,unesco:false,frequentlyAsked:true,ecosystem:["Desert","Grassland"],mountainRange:"Salt marsh / desert plains",riverSystem:"Luni (seasonal)",climate:"Arid / hot desert",elevationRange:"0 m – 15 m (salt flats)",biome:"Salt desert (seasonal wetland), arid grassland (Banni)",flora:["Salt-tolerant scrub","Banni grasslands","Prosopis","Coastal mangroves"],fauna:["Indian Wild Ass","Chinkara","Desert Fox","Caracal","Wolf"],importantSpecies:["Indian Wild Ass (Khur)","Greater & Lesser Flamingo","Macqueen's Bustard","Great Indian Bustard"],threatenedSpecies:["Indian Wild Ass (NT)","Great Indian Bustard (CR)"],upscImportance:["India's LARGEST biosphere reserve by area (~12,454 sq km)","Only home of the Indian Wild Ass (Khur) — Wild Ass Sanctuary, Little Rann","Flamingo breeding ground (Flamingo City); Banni grasslands","Seasonal salt marsh that floods in monsoon"],smartBadges:["Desert Ecosystem","Largest BR","Wild Ass Habitat","Frequently Asked"],pyqs:[{year:"2015",exam:"Prelims",subject:"Environment",question:"The Indian Wild Ass (Khur) is found exclusively in which region?"}],flashcards:[{q:"Which is India's largest biosphere reserve by area?",a:"Great Rann of Kutch",difficulty:"medium"},{q:"The Indian Wild Ass (Khur) is found only in which BR?",a:"Great Rann of Kutch (Little Rann)",difficulty:"medium"}],videos:[{type:"Documentary",title:"Rann of Kutch",url:"https://www.youtube.com/results?search_query=rann+of+kutch+wild+ass"}],video360:[{title:"360° White Desert",url:"https://www.youtube.com/results?search_query=rann+of+kutch+360"}]}, {id:"cold-desert",name:"Cold Desert Biosphere Reserve",state:["Himachal Pradesh"],latitude:32.30,longitude:78.00,yearEstablished:2009,yearUnesco:null,areaSqKm:7770,unesco:false,frequentlyAsked:false,ecosystem:["Himalayan","Desert"],mountainRange:"Greater Himalayas (Trans-Himalaya)",riverSystem:"Spiti, Pin (Sutlej)",climate:"Cold arid desert",elevationRange:"3000 m – 6000 m+",biome:"Cold desert / Trans-Himalayan alpine steppe",flora:["Sea buckthorn","Junipers","Sparse alpine shrubs","Medicinal herbs"],fauna:["Snow Leopard","Himalayan Ibex","Tibetan Wolf","Bharal (Blue Sheep)"],importantSpecies:["Snow Leopard","Himalayan Ibex","Red Fox","Tibetan Gazelle"],threatenedSpecies:["Snow Leopard (VU)"],upscImportance:["Includes Pin Valley NP and Chandratal & Sarchu areas","Cold desert / Trans-Himalayan ecology of Lahaul-Spiti","Prime Snow Leopard habitat"],smartBadges:["Himalayan Ecosystem","Cold Desert","Snow Leopard Habitat"],pyqs:[{year:"2016",exam:"Prelims",subject:"Geography",question:"The Cold Desert Biosphere Reserve is in which state?"}],flashcards:[{q:"In which state is the Cold Desert Biosphere Reserve?",a:"Himachal Pradesh (Lahaul-Spiti)",difficulty:"medium"},{q:"Which NP lies within the Cold Desert BR?",a:"Pin Valley National Park",difficulty:"hard"}],videos:[{type:"Geography",title:"Cold Desert Spiti",url:"https://www.youtube.com/results?search_query=cold+desert+biosphere+spiti"}],video360:[{title:"360° Spiti Valley",url:"https://www.youtube.com/results?search_query=spiti+360"}]}, {id:"seshachalam",name:"Seshachalam Hills Biosphere Reserve",state:["Andhra Pradesh"],latitude:13.75,longitude:79.20,yearEstablished:2010,yearUnesco:null,areaSqKm:4756,unesco:false,frequentlyAsked:false,ecosystem:["Deccan"],mountainRange:"Eastern Ghats (Seshachalam Hills)",riverSystem:"Swarnamukhi, Papagni",climate:"Tropical dry",elevationRange:"150 m – 1130 m",biome:"Tropical dry deciduous & moist forest, scrub",flora:["Red Sanders (Pterocarpus santalinus)","Sandalwood","Cycas beddomei","Bamboo"],fauna:["Slender Loris","Leopard","Sloth Bear","Mouse Deer"],importantSpecies:["Red Sanders (endemic)","Slender Loris","Golden Gecko"],threatenedSpecies:["Red Sanders (EN, endemic)","Slender Loris"],upscImportance:["First biosphere reserve in the Eastern Ghats of Andhra Pradesh","Endemic, prized RED SANDERS (Pterocarpus santalinus) forests","Includes the Tirumala Hills"],smartBadges:["Eastern Ghats","Red Sanders","Deccan"],pyqs:[{year:"2017",exam:"Prelims",subject:"Environment",question:"Red Sanders (smuggling news) is endemic to which hill region?"}],flashcards:[{q:"Seshachalam Hills BR is famous for which endemic tree?",a:"Red Sanders (Pterocarpus santalinus)",difficulty:"medium"},{q:"In which state are the Seshachalam Hills?",a:"Andhra Pradesh (Eastern Ghats)",difficulty:"easy"}],videos:[{type:"Geography",title:"Seshachalam Hills",url:"https://www.youtube.com/results?search_query=seshachalam+hills+biosphere"}],video360:[{title:"360° Eastern Ghats",url:"https://www.youtube.com/results?search_query=eastern+ghats+360"}]}, {id:"panna",name:"Panna Biosphere Reserve",state:["Madhya Pradesh"],latitude:24.70,longitude:80.00,yearEstablished:2011,yearUnesco:2020,areaSqKm:2999,unesco:true,frequentlyAsked:true,ecosystem:["Deccan","Grassland"],mountainRange:"Vindhya Range",riverSystem:"Ken River",climate:"Tropical dry",elevationRange:"200 m – 540 m",biome:"Tropical dry deciduous (teak), grasslands, gorges",flora:["Teak","Kardhai","Grasslands","Riverine vegetation"],fauna:["Tiger","Leopard","Chital","Sambar","Sloth Bear"],importantSpecies:["Tiger (reintroduction success)","Gharial","Vultures","Indian Wolf"],threatenedSpecies:["Tiger (EN)","Gharial (CR)"],upscImportance:["Newest UNESCO MAB Biosphere Reserve from India (added 2020)","Panna Tiger Reserve — famous tiger reintroduction success","On the Ken River — site of the Ken-Betwa link project","Vindhya Range, Madhya Pradesh"],smartBadges:["Vindhya Range","UNESCO MAB (2020)","Tiger Reserve","Frequently Asked"],pyqs:[{year:"2021",exam:"Prelims",subject:"Environment",question:"Panna Tiger Reserve lies on which river (interlinking project)?"}],flashcards:[{q:"Which is the most recent Indian addition to the UNESCO MAB network (2020)?",a:"Panna Biosphere Reserve",difficulty:"hard"},{q:"Panna Tiger Reserve lies on which river?",a:"Ken River",difficulty:"medium"}],videos:[{type:"Documentary",title:"Panna Tiger Reserve",url:"https://www.youtube.com/results?search_query=panna+tiger+reserve+documentary"}],video360:[{title:"360° Ken River Gorge",url:"https://www.youtube.com/results?search_query=panna+360"}]} ]; const ECOSYSTEMS = ["Western Ghats","Himalayan","Mangrove","Island","Desert","Grassland","Deccan","Northeast"]; const FUTURE_LAYERS = ["National Parks","Wildlife Sanctuaries","Tiger Reserves","Ramsar Sites","UNESCO Sites"]; /* ---------- helpers ---------- */ const LS = { get(k, d){ try { const v = localStorage.getItem(k); return v==null? d : JSON.parse(v); } catch(e){ return d; } }, set(k, v){ try { localStorage.setItem(k, JSON.stringify(v)); } catch(e){} } }; const markerColor = (r) => r.frequentlyAsked ? '#d4a017' : (r.unesco ? '#2563eb' : '#2d6a4f'); const shuffle = (a) => { const x=[...a]; for(let i=x.length-1;i>0;i--){ const j=Math.floor(Math.random()*(i+1)); [x[i],x[j]]=[x[j],x[i]]; } return x; }; /* ============================================================ MAP ============================================================ */ const BASEMAPS = { political: { label:'Political', url:'https://{s}.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}{r}.png', attr:'© OpenStreetMap, © CARTO', sub:'abcd', max:19 }, satellite: { label:'Satellite', url:'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', attr:'© Esri, Maxar, Earthstar Geographics', max:18 }, terrain: { label:'Terrain', url:'https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', attr:'© Esri', max:18 } }; function MapView({ reserves, selectedId, onSelect, basemap, mapLearning, showBR }) { const mapRef = useRef(null); const layerRef = useRef(null); const tileRef = useRef(null); const markersRef = useRef({}); // init once useEffect(() => { const saved = LS.get('br_view', { center:[22.0,80.0], zoom:5 }); const map = L.map('map', { zoomControl:true, attributionControl:true, minZoom:4, worldCopyJump:true }) .setView(saved.center, saved.zoom); mapRef.current = map; layerRef.current = L.layerGroup().addTo(map); map.on('moveend zoomend', () => { const c = map.getCenter(); LS.set('br_view', { center:[c.lat, c.lng], zoom: map.getZoom() }); }); setTimeout(() => map.invalidateSize(), 200); return () => map.remove(); }, []); // basemap switch useEffect(() => { const map = mapRef.current; if(!map) return; if (tileRef.current) map.removeLayer(tileRef.current); const b = BASEMAPS[basemap]; tileRef.current = L.tileLayer(b.url, { attribution:b.attr, subdomains:b.sub||'abc', maxZoom:b.max||19 }).addTo(map); tileRef.current.bringToBack(); }, [basemap]); // markers useEffect(() => { const grp = layerRef.current; if(!grp) return; grp.clearLayers(); markersRef.current = {}; if (!showBR) return; reserves.forEach(r => { const sel = r.id === selectedId; const color = markerColor(r); const size = sel ? 22 : 16; const icon = L.divIcon({ className:'', html:`

`, iconSize:[size,size], iconAnchor:[size/2,size/2] }); const m = L.marker([r.latitude, r.longitude], { icon }).addTo(grp); if (!mapLearning) { m.bindTooltip( `${r.name}
${r.state.join(', ')}
${r.unesco?'🔵 UNESCO MAB':'🟢 Biosphere Reserve'}`, { direction:'top', offset:[0,-8], opacity:0.95 } ); } else { m.bindTooltip('❓ Identify this reserve', { direction:'top', offset:[0,-8] }); } m.on('click', () => onSelect(r.id)); markersRef.current[r.id] = m; }); }, [reserves, selectedId, mapLearning, showBR, onSelect]); // fly to selection useEffect(() => { const map = mapRef.current; if(!map||!selectedId) return; const r = RESERVES.find(x=>x.id===selectedId); if(!r) return; map.flyTo([r.latitude, r.longitude], Math.max(map.getZoom(), 6), { duration:0.8 }); }, [selectedId]); return

; } /* ============================================================ SIDE PANEL ============================================================ */ const TABS = ["Overview","Biodiversity","Geography","UPSC Facts","Gallery","360°","Videos","Flashcards"]; function Pill({children, color}) { return {children}; } function Section({title, children}) { return

{title}

{children}

; } function ReservePanel({ reserve, onClose, bookmarks, toggleBookmark }) { const [tab, setTab] = useState("Overview"); const [gIdx, setGIdx] = useState(0); const [modalVid, setModalVid] = useState(null); useEffect(()=>{ setTab("Overview"); setGIdx(0); }, [reserve?.id]); if (!reserve) return null; const r = reserve; const imgs = (r.images && r.images.length) ? r.images : [ `https://source.unsplash.com/640x420/?${encodeURIComponent(r.name+' wildlife')}`, `https://source.unsplash.com/640x420/?${encodeURIComponent(r.mountainRange+' landscape')}`, `https://source.unsplash.com/640x420/?${encodeURIComponent(r.biome)}` ]; const ytSearch = (q)=>`https://www.youtube.com/embed?listType=search&list=${encodeURIComponent(q)}`; return (

{r.name}

{r.state.join(' · ')}

{r.unesco && 🔵 UNESCO MAB {r.yearUnesco||''}} {r.frequentlyAsked && ⭐ Frequently Asked} {r.ecosystem.map(e=>{e})}

{TABS.map(t=>( ))}

{tab==="Overview" && <>

States	{r.state.join(', ')}
Area	{r.areaSqKm.toLocaleString()} km²
Established	{r.yearEstablished}
UNESCO MAB	{r.unesco?`Yes (${r.yearUnesco})`:'No'}
Ecosystem	{r.ecosystem.join(', ')}

{r.smartBadges.map(b=>{b})}

} {tab==="Biodiversity" && <>

{r.flora.map(f=>{f})}

{r.fauna.map(f=>{f})}

{r.importantSpecies.map(f=>{f})}

{r.threatenedSpecies.map(f=>{f})}

} {tab==="Geography" &&

Mountain/Terrain	{r.mountainRange}
River System	{r.riverSystem}
Climate	{r.climate}
Elevation	{r.elevationRange}
Biome	{r.biome}
Coordinates	{r.latitude}°N, {r.longitude}°E

} {tab==="UPSC Facts" && <>

{r.pyqs.map((p,i)=>(

{p.year} · {p.exam} · {p.subject}

{p.question}

))}

} {tab==="Gallery" &&

{e.target.style.opacity=.25; e.target.alt='Image unavailable (replace placeholder URL)';}} className="w-full h-full object-cover"/>

{imgs.map((_,i)=>)}

Wildlife · Vegetation · Landscapes · Satellite (swipe / use arrows). Placeholder images load from Unsplash by keyword.

} {tab==="360°" &&

Explore in 360°

{(r.video360||[]).map((v,i)=>(

🌐 {v.title}

))}

Embeds Google Street View / YouTube 360 / virtual tours where available. Watch 360° Wildlife · Drone Flythrough · Documentary.

} {tab==="Videos" &&

{r.videos.map((v,i)=>(

{v.type}

{v.title}

))}

Documentary · Geography · UPSC lecture · Biodiversity. Videos open in a modal, not a redirect.

} {tab==="Flashcards" && }

{modalVid && (

setModalVid(null)}>

e.stopPropagation()}>

{modalVid.title}

)}

); } function MiniFlashcards({cards, reserveName}) { const [i,setI]=useState(0); const [flip,setFlip]=useState(false); const c = cards[i]; return

Active recall · {reserveName} ({i+1}/{cards.length})

setFlip(!flip)} >

Question · tap to flip

{c.q}

Answer

{c.a}

Difficulty: {c.difficulty}

; } /* ============================================================ FLASHCARD MODE (global, with spaced repetition) ============================================================ */ function buildDeck(){ const deck=[]; RESERVES.forEach(r=> r.flashcards.forEach((c,idx)=> deck.push({...c, id:r.id+'-'+idx, reserve:r.name}))); return deck; } function FlashcardMode({ srs, setSrs, bookmarks, toggleBookmark }) { const deck = useMemo(buildDeck, []); const due = useMemo(()=>{ const now = Date.now(); const order = deck.map(c=>({c, due:(srs[c.id]?.next||0)})).sort((a,b)=>a.due-b.due); return order.map(o=>o.c); }, [deck, srs]); const [i,setI]=useState(0); const [flip,setFlip]=useState(false); const c = due[i]; const grade = (g)=>{ const days = {again:0, hard:1, medium:3, easy:7}[g]; setSrs({...srs, [c.id]: {next: Date.now()+days*86400000, grade:g}}); setFlip(false); setI((i+1)%due.length); }; if(!c) return null; const isBm = bookmarks.includes(c.id); return

Card {i+1}/{due.length}{c.reserve}

setFlip(!flip)}>

QUESTION · tap to reveal

{c.q}

ANSWER

{c.a}

Difficulty: {c.difficulty}

{flip &&

} {!flip &&

Spaced repetition: grade after revealing. Progress saved in your browser.

}

; } /* ============================================================ QUIZ MODE ============================================================ */ function genQuestions(n=10){ const qs=[]; const pool = shuffle(RESERVES); pool.forEach(r=>{ const others = shuffle(RESERVES.filter(x=>x.id!==r.id)); // type 1: state qs.push({ q:`In which state(s) is the ${r.name}?`, correct:r.state.join(', '), options: shuffle([r.state.join(', '), ...others.slice(0,3).map(o=>o.state.join(', '))]) }); // type 2: unesco year / status qs.push({ q:`Is ${r.name} part of the UNESCO MAB World Network?`, correct: r.unesco?'Yes':'No', options:['Yes','No'] }); // type 3: important species if(r.importantSpecies[0]) qs.push({ q:`Which biosphere reserve is the flagship habitat of the ${r.importantSpecies[0]}?`, correct:r.name, options: shuffle([r.name, ...others.slice(0,3).map(o=>o.name)]) }); // type 4: PYQ style if(r.pyqs[0]) qs.push({ q:`[PYQ ${r.pyqs[0].year}] ${r.pyqs[0].question}`, correct:r.name, options: shuffle([r.name, ...others.slice(0,3).map(o=>o.name)]), pyq:true }); }); return shuffle(qs).slice(0,n); } function QuizMode(){ const [questions,setQuestions]=useState(()=>genQuestions(10)); const [i,setI]=useState(0); const [picked,setPicked]=useState(null); const [score,setScore]=useState(0); const [done,setDone]=useState(false); const [answered,setAnswered]=useState(0); const q=questions[i]; const choose=(opt)=>{ if(picked!=null) return; setPicked(opt); setAnswered(a=>a+1); if(opt===q.correct) setScore(s=>s+1); }; const next=()=>{ if(i+1>=questions.length){setDone(true);} else {setI(i+1);setPicked(null);} }; const restart=()=>{ setQuestions(genQuestions(10)); setI(0);setPicked(null);setScore(0);setDone(false);setAnswered(0); }; if(done) return

Quiz Complete

{score}/{questions.length}

Accuracy: {Math.round(score/questions.length*100)}%

; return

Q {i+1}/{questions.length} {q.pyq && · PYQ} Score: {score} · Acc: {answered?Math.round(score/answered*100):0}%

{q.q}

{q.options.map((o,idx)=>{ let cls="bg-cream-dark hover:bg-forest-soft/40 text-gray-800"; if(picked!=null){ if(o===q.correct) cls="bg-forest-mid text-white"; else if(o===picked) cls="bg-red-500 text-white"; else cls="bg-cream-dark text-gray-500"; } return ; })}

{picked!=null && }

; } /* ============================================================ MAP LEARNING MODE (identify by location) ============================================================ */ function MapLearnPanel({ target, onAnswer }){ const opts = useMemo(()=>{ const others = shuffle(RESERVES.filter(r=>r.id!==target.id)).slice(0,3); return shuffle([target, ...others]); }, [target.id]); const [picked,setPicked]=useState(null); return

📍 Identify this Biosphere Reserve

{opts.map(o=>{ let cls="bg-cream-dark text-gray-800"; if(picked){ if(o.id===target.id) cls="bg-forest-mid text-white"; else if(o.id===picked) cls="bg-red-500 text-white"; } return ; })}

{picked && }

; } /* ============================================================ COMPARE MODE ============================================================ */ function CompareMode(){ const [a,setA]=useState(RESERVES[0].id); const [b,setB]=useState(RESERVES[6].id); const ra=RESERVES.find(r=>r.id===a), rb=RESERVES.find(r=>r.id===b); const Row=({label,va,vb})=>({label}{va}{vb}); const Sel=({val,set})=>(); return

Compare Reserves

; } /* ============================================================ TIMELINE MODE ============================================================ */ function TimelineMode({onSelect}){ const sorted=[...RESERVES].sort((x,y)=>x.yearEstablished-y.yearEstablished); return

Notification Timeline

{sorted.map(r=>(

))}

; } /* ============================================================ AI REVISION ASSISTANT (rule-based over local data) ============================================================ */ function answerQuery(qRaw){ const q=qRaw.toLowerCase(); const has=(...k)=>k.some(x=>q.includes(x)); const list=(arr)=>arr.map(r=>r.name.replace(' Biosphere Reserve','')).join(', '); if(has('western ghat')) return "Western Ghats biosphere reserves: "+list(RESERVES.filter(r=>r.ecosystem.includes('Western Ghats')))+"."; if(has('himalaya')) return "Himalayan biosphere reserves: "+list(RESERVES.filter(r=>r.ecosystem.includes('Himalayan')))+"."; if(has('mangrove')) return "Mangrove ecosystems: "+list(RESERVES.filter(r=>r.ecosystem.includes('Mangrove')))+". Sundarbans is the world's largest mangrove forest."; if(has('island')) return "Island biosphere reserves: "+list(RESERVES.filter(r=>r.ecosystem.includes('Island')))+"."; if(has('desert')) return "Desert biosphere reserves: "+list(RESERVES.filter(r=>r.ecosystem.includes('Desert')))+"."; if(has('unesco','mab')) return "The 12 UNESCO-MAB reserves from India: "+list(RESERVES.filter(r=>r.unesco))+"."; if(has('largest','biggest')) { const m=[...RESERVES].sort((a,b)=>b.areaSqKm-a.areaSqKm)[0]; return `Largest by area: ${m.name} (~${m.areaSqKm.toLocaleString()} km²).`; } if(has('smallest')) { const m=[...RESERVES].sort((a,b)=>a.areaSqKm-b.areaSqKm)[0]; return `Smallest by area: ${m.name} (~${m.areaSqKm.toLocaleString()} km²).`; } if(has('first','oldest')) return "First biosphere reserve of India: Nilgiri (1986). First marine BR: Gulf of Mannar."; if(has('newest','latest','recent')) return "Newest notified: Panna (2011); newest UNESCO-MAB addition: Panna (2020)."; if(has('tiger')) return "Tiger-associated reserves: Sundarbans, Simlipal (black tigers), Manas, Pachmarhi, Achanakmar, Panna, Nilgiri."; if(has('lion-tailed','macaque')) return "Lion-tailed Macaque: Nilgiri & Agasthyamalai (Western Ghats endemic)."; if(has('wild ass','khur')) return "Indian Wild Ass (Khur): only in the Great Rann of Kutch (Little Rann)."; if(has('dugong','sea cow')) return "Dugong (Sea Cow): Gulf of Mannar — India's first marine BR."; // name / state lookup const byName=RESERVES.find(r=>q.includes(r.id.replace(/-/g,' '))||q.includes(r.name.toLowerCase().split(' ')[0])); if(byName) return `${byName.name} — ${byName.state.join(', ')}; est. ${byName.yearEstablished}${byName.unesco?` (UNESCO ${byName.yearUnesco})`:''}. ${byName.upscImportance[0]}`; const byState=RESERVES.filter(r=>r.state.some(s=>q.includes(s.toLowerCase()))); if(byState.length) return "Reserves there: "+list(byState)+"."; return "Try asking about: Western Ghats, Himalayan, mangrove, island, desert reserves; UNESCO list; largest/smallest/first/newest; a species (tiger, dugong, wild ass); or a reserve/state name."; } function AIAssistant(){ const [msgs,setMsgs]=useState([{role:'ai',text:"Hi! I'm your revision assistant. Ask me e.g. \"Which biosphere reserves are in the Western Ghats?\" or \"largest biosphere reserve\"."}]); const [val,setVal]=useState(''); const endRef=useRef(null); useEffect(()=>{endRef.current?.scrollIntoView({behavior:'smooth'});},[msgs]); const send=()=>{ if(!val.trim())return; const u=val.trim(); setMsgs(m=>[...m,{role:'user',text:u},{role:'ai',text:answerQuery(u)}]); setVal(''); }; const chips=["Western Ghats reserves","UNESCO list","Largest reserve","Mangrove reserves","Reserves with tigers"]; return

AI Revision Assistant

{chips.map(c=>)}

{msgs.map((m,i)=>(

{m.text}

))}

setVal(e.target.value)} onKeyDown={e=>e.key==='Enter'&&send()} placeholder="Ask about reserves…" className="flex-1 border border-earth/20 rounded-lg px-3 py-2 text-sm"/>

Answers are generated locally from the dataset — works offline, no backend.

; } /* ============================================================ APP SHELL ============================================================ */ const MODES=[ {k:'explore',label:'🗺️ Explore'}, {k:'flashcards',label:'🃏 Flashcards'}, {k:'quiz',label:'❓ Quiz'}, {k:'maplearn',label:'📍 Map Learning'}, {k:'compare',label:'⚖️ Compare'}, {k:'timeline',label:'📅 Timeline'}, {k:'ai',label:'🤖 AI Assistant'} ]; function App(){ const [mode,setMode]=useState('explore'); const [basemap,setBasemap]=useState(LS.get('br_basemap','political')); const [selectedId,setSelectedId]=useState(null); const [search,setSearch]=useState(''); const [ecoFilter,setEcoFilter]=useState([]); const [showBR,setShowBR]=useState(true); const [bookmarks,setBookmarks]=useState(LS.get('br_bookmarks',[])); const [srs,setSrs]=useState(LS.get('br_srs',{})); const [layersOpen,setLayersOpen]=useState(false); const [drawerOpen,setDrawerOpen]=useState(false); // map learning const [mlTarget,setMlTarget]=useState(null); const [mlScore,setMlScore]=useState(LS.get('br_mlscore',{right:0,total:0})); useEffect(()=>LS.set('br_basemap',basemap),[basemap]); useEffect(()=>LS.set('br_bookmarks',bookmarks),[bookmarks]); useEffect(()=>LS.set('br_srs',srs),[srs]); useEffect(()=>LS.set('br_mlscore',mlScore),[mlScore]); const toggleBookmark=useCallback((id)=>setBookmarks(b=>b.includes(id)?b.filter(x=>x!==id):[...b,id]),[]); const toggleEco=(e)=>setEcoFilter(f=>f.includes(e)?f.filter(x=>x!==e):[...f,e]); // filtering (search + ecosystem) used on the map const filtered=useMemo(()=>{ const s=search.trim().toLowerCase(); return RESERVES.filter(r=>{ const ecoOk = ecoFilter.length===0 || ecoFilter.some(e=>r.ecosystem.includes(e)); if(!ecoOk) return false; if(!s) return true; const hay=[r.name,...r.state,...r.fauna,...r.flora,...r.importantSpecies,...r.ecosystem, r.unesco?'unesco':'', r.frequentlyAsked?'frequently asked upsc':'', r.mountainRange.includes('Western Ghats')?'western ghats':'', r.ecosystem.includes('Himalayan')?'himalayas himalaya':'', r.ecosystem.includes('Mangrove')?'mangrove':'', (r.fauna.join(' ')+r.importantSpecies.join(' ')).toLowerCase().includes('tiger')?'tiger habitat':'' ].join(' ').toLowerCase(); return hay.includes(s); }); },[search,ecoFilter]); const isMap = mode==='explore' || mode==='maplearn'; const mapLearning = mode==='maplearn'; // pick a map-learning target useEffect(()=>{ if(mapLearning){ setSelectedId(null); setMlTarget(RESERVES[Math.floor(Math.random()*RESERVES.length)]); } },[mapLearning]); const onMapSelect=(id)=>{ if(mapLearning) return; // handled by quiz panel setSelectedId(id); }; const mlAnswer=(res)=>{ if(res==='next'){ setMlTarget(RESERVES[Math.floor(Math.random()*RESERVES.length)]); return; } setMlScore(s=>({right:s.right+(res?1:0), total:s.total+1})); setTimeout(()=>setMlTarget(RESERVES[Math.floor(Math.random()*RESERVES.length)]),900); }; const selected = RESERVES.find(r=>r.id===selectedId); return

{/* HEADER */}

India Biosphere Reserves Explorer

UPSC/UGC Preparation Edition · 18 reserves · 12 UNESCO-MAB

{isMap &&

🔎 setSearch(e.target.value)} placeholder="Search name, state, species, 'mangrove', 'tiger'…" className="bg-transparent placeholder-cream/50 text-sm px-2 py-1 outline-none w-72"/> {search && }

}

{/* MODE BAR (desktop) */} {/* MOBILE DRAWER */} {drawerOpen &&

setDrawerOpen(false)}>

e.stopPropagation()}>

; } (function(){ function fail(msg){ var box=document.getElementById('boot-msg'); if(box){ box.style.display='block'; box.querySelector('.boot-detail').textContent=msg; } } try { if (typeof React==='undefined' || typeof ReactDOM==='undefined') { fail('React did not load (CDN blocked or offline).'); return; } if (typeof L==='undefined') { fail('Leaflet did not load (CDN blocked or offline).'); return; } ReactDOM.createRoot(document.getElementById('root')).render(); var bs=document.getElementById('boot-screen'); if(bs) bs.style.display='none'; } catch(err) { fail((err && err.message) ? err.message : String(err)); } })();

{title}

{r.name}

Explore in 360°

Quiz Complete

Compare Reserves

Notification Timeline

AI Revision Assistant

Menu