{"id":1449,"date":"2025-09-19T21:39:13","date_gmt":"2025-09-19T21:39:13","guid":{"rendered":"https:\/\/teachmeifucan.com\/?p=1449"},"modified":"2025-09-19T21:39:16","modified_gmt":"2025-09-19T21:39:16","slug":"board-game","status":"publish","type":"post","link":"https:\/\/teachmeifucan.com\/?p=1449","title":{"rendered":"Board Game"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<!-- ===================== CREATE YOUR OWN BOARD GAME \u2013 TEACH PAGE (v3) ===================== -->\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Rye&#038;family=Inter:wght@400;600;800&#038;display=swap\" rel=\"stylesheet\">\n\n<style>\n  .cob-wrap{max-width:900px;margin:0 auto;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:#1f2430}\n  .cob-h1{font-family:Rye,Georgia,serif;font-size:34px;margin:8px 0 14px;color:#603c1a}\n  .cob-lead{background:#fff7e1;border:1.5px solid #d1a865;border-radius:12px;padding:14px 16px;margin-bottom:14px}\n  .cob-hr{height:2px;background:repeating-linear-gradient(90deg,#c6a57a,#c6a57a 16px,transparent 16px,transparent 28px);opacity:.5;margin:14px 0}\n  .cob-note{background:#f5f7fb;border:1px dashed #9aa8c2;border-radius:10px;padding:10px 12px;margin-top:10px}\n  .cob-kicker{font-weight:800;letter-spacing:.02em}\n  .cob-small{font-size:13px;opacity:.75}\n\n  details{border:1.5px solid #cbb69a;border-radius:12px;background:#fffef9}\n  details>summary{cursor:pointer;padding:12px 16px;font-weight:800;list-style:none;border-radius:12px;background:#f9f1e1}\n  details[open]>summary{background:#f3e6cf}\n  details .cob-sec{padding:12px 16px 14px}\n\n  .cob-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0}\n  .cob-input{border:1px solid #cbb69a;border-radius:8px;padding:7px 9px;min-width:220px}\n  .cob-options{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}\n  .cob-chip{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #cbb69a;border-radius:10px;background:#fff}\n  .cob-chip input{accent-color:#7d5a38}\n  .cob-btn{padding:8px 12px;border:0;border-radius:10px;background:#66a6ff;color:#fff;font-weight:800;cursor:pointer}\n  .cob-btn.alt{background:#f0c04d;color:#2e210f}\n\n  \/* Recap card *\/\n  .cob-recap{background:#eef8ff;border:2px solid #7aa8d1;border-radius:12px;padding:12px 14px}\n  .cob-recap h3{margin:.2rem 0 .6rem 0;font-size:18px}\n  .cob-recap ul{margin:.2rem 0 .4rem 1.1rem}\n\n  \/* Editable note boxes *\/\n  .cob-edit{border:1px dashed #b7c1d9;border-radius:8px;padding:10px;background:#fff;min-height:56px}\n  .cob-edit:empty:before{content:\"Type notes here\u2026 (you can paste images if your editor allows)\";opacity:.5}\n<\/style>\n\n<div class=\"cob-wrap\" id=\"cob\">\n  <h1 class=\"cob-h1\">Create Your Own Board Game<\/h1>\n\n  <div class=\"cob-lead\">\n    <div class=\"cob-kicker\">Lesson Goal<\/div>\n    Design and play a custom dice board game. We\u2019ll choose a theme, plan rules, build a board, and then play-test!\n    <ul style=\"margin:8px 0 0 20px;\">\n      <li>Design a dice board game<\/li>\n      <li>Write a clear directions\/rules sheet<\/li>\n      <li>Make a playable prototype (board + pieces)<\/li>\n      <li>Play the game together when finished<\/li>\n    <\/ul>\n  <\/div>\n\n  <div class=\"cob-hr\"><\/div>\n\n  <div class=\"cob-lead\" style=\"background:#f7fbff;border-color:#9cc4ec\">\n    <strong>Warm-up:<\/strong> What\u2019s your favorite board game and why?\n    <details style=\"margin-top:8px;\">\n      <summary>Open notes for this warm-up<\/summary>\n      <div class=\"cob-sec\">\n        <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n      <\/div>\n    <\/details>\n  <\/div>\n\n  <!-- STEP 1 -->\n  <details open>\n    <summary>Step 1 \u2013 Choose a Theme \ud83c\udfad<\/summary>\n    <div class=\"cob-sec\">\n      <p>Choose one or more worlds for your game. Collect words\/images that match your theme (characters, places, objects, events).<\/p>\n\n      <!-- Multi-theme quick add -->\n      <div class=\"cob-row\"><strong>Add custom theme:<\/strong>\n        <input id=\"theme-main\" class=\"cob-input\" placeholder=\"Type a theme and press Add\">\n        <button class=\"cob-btn alt\" id=\"add-theme\">Add<\/button>\n        <span class=\"cob-small\">You can select multiple themes below, too.<\/span>\n      <\/div>\n\n      <!-- THEME LIBRARY (classic look, multi-select) -->\n      <details>\n        <summary>Theme Library (click the orange area to expand categories)<\/summary>\n        <div class=\"cob-sec\">\n          <!-- Category template: checkbox + accordion with C\/P\/O\/X + notes -->\n         <!-- CLEAN THEME LIBRARY (26 categories, each one-line expandable) -->\n<!-- Optional tiny style polish (safe to skip if you want) -->\n<style>\n  .cob-theme-block{margin:6px 0}\n  .cob-theme-block summary{list-style:none}\n  .cob-theme-block summary::-webkit-details-marker{display:none}\n<\/style>\n\n<!-- 1) OLD WEST -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Old West\"><strong>Old West<\/strong> \u2014 Cowboys, sheriff, outlaws<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Cowboy, Sheriff, Outlaw, Saloon owner<\/div>\n    <div><strong>P<\/strong>: Desert town, Saloon, Ranch, Gold mine<\/div>\n    <div><strong>O<\/strong>: Lasso, Revolver, Cactus, Horseshoe<\/div>\n    <div><strong>X<\/strong>: Train robbery, Cattle rustlers, Shootout at dawn<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 2) ESPIONAGE -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Espionage\"><strong>Espionage<\/strong> \u2014 spies, gadgets, secret missions<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Spy, Double agent, Hacker, Handler<\/div>\n    <div><strong>P<\/strong>: Safehouse, Embassy, Secret bunker<\/div>\n    <div><strong>O<\/strong>: Briefcase, Disguise kit, Hidden camera<\/div>\n    <div><strong>X<\/strong>: Identity exposed, Mission compromised<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 3) MOBSTERS -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Mobsters\"><strong>Mobsters<\/strong> \u2014 crime families, speakeasies, turf wars<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Gangster, Boss, Hitman, Informant<\/div>\n    <div><strong>P<\/strong>: Speakeasy, Docks, Warehouse<\/div>\n    <div><strong>O<\/strong>: Tommy gun, Cigars, Stolen cash<\/div>\n    <div><strong>X<\/strong>: Betrayal, Turf war, Undercover cop<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 4) SUPERHEROES -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Superheroes\"><strong>Superheroes<\/strong> \u2014 heroes, villains, rescues<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Superhero, Sidekick, Villain<\/div>\n    <div><strong>P<\/strong>: Secret lair, City rooftop, Headquarters<\/div>\n    <div><strong>O<\/strong>: Cape, Utility belt, Kryptonite<\/div>\n    <div><strong>X<\/strong>: Power loss, Civilian in danger<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 5) MARTIAL ARTS -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Martial Arts\"><strong>Martial Arts<\/strong> \u2014 dojos, rival clans, tournaments<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Sensei, Ninja, Fighter, Rival<\/div>\n    <div><strong>P<\/strong>: Dojo, Temple, Tournament arena<\/div>\n    <div><strong>O<\/strong>: Nunchucks, Headband, Scroll<\/div>\n    <div><strong>X<\/strong>: Dishonor, Stolen technique, Surprise challenger<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 6) PIRATES -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Pirates\"><strong>Pirates<\/strong> \u2014 treasure maps, ships, sea monsters<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Pirate captain, First mate, Parrot<\/div>\n    <div><strong>P<\/strong>: Ship deck, Treasure island, Cave<\/div>\n    <div><strong>O<\/strong>: Treasure map, Cutlass, Rum barrel<\/div>\n    <div><strong>X<\/strong>: Mutiny, Sea monster, Lost compass<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 7) RACING -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Racing\"><strong>Racing<\/strong> \u2014 tracks, pits, turbo boosts<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Racer, Mechanic, Rival driver<\/div>\n    <div><strong>P<\/strong>: Pit stop, Racetrack, Garage<\/div>\n    <div><strong>O<\/strong>: Helmet, Tires, Turbo booster<\/div>\n    <div><strong>X<\/strong>: Engine failure, Flat tire, False start<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 8) FANTASY (GENERAL) -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Fantasy (General)\"><strong>Fantasy \u2014 General<\/strong> \u2014 magic, forests, dungeons<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Wizard, Elf, Orc, Sorcerer<\/div>\n    <div><strong>P<\/strong>: Forest, Dungeon, Magic tower<\/div>\n    <div><strong>O<\/strong>: Staff, Potion, Spellbook<\/div>\n    <div><strong>X<\/strong>: Cursed artifact, Evil uprising<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 9) TRAINS -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Trains\"><strong>Trains<\/strong> \u2014 stations, tunnels, dining cars<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Conductor, Passenger, Engineer<\/div>\n    <div><strong>P<\/strong>: Train station, Dining car, Tunnel<\/div>\n    <div><strong>O<\/strong>: Ticket, Steam whistle, Luggage<\/div>\n    <div><strong>X<\/strong>: Derailment, Bandits, Missed stop<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 10) SPORTS -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Sports\"><strong>Sports<\/strong> \u2014 fields, stadiums, trophies<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Athlete, Referee, Coach<\/div>\n    <div><strong>P<\/strong>: Stadium, Locker room, Field<\/div>\n    <div><strong>O<\/strong>: Whistle, Ball, Trophy<\/div>\n    <div><strong>X<\/strong>: Foul, Injury, Tie game<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 11) FINANCIAL -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Financial\"><strong>Financial<\/strong> \u2014 banks, trading, fortunes<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Investor, Banker, Thief<\/div>\n    <div><strong>P<\/strong>: Bank vault, Trading floor<\/div>\n    <div><strong>O<\/strong>: Stocks, Gold bars, Calculator<\/div>\n    <div><strong>X<\/strong>: Market crash, Insider trading<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 12) DETECTIVES -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Detectives\"><strong>Detectives<\/strong> \u2014 clues, suspects, mysteries<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Detective, Suspect, Witness<\/div>\n    <div><strong>P<\/strong>: Crime scene, Office, Alleyway<\/div>\n    <div><strong>O<\/strong>: Magnifying glass, Clue board, Tape recorder<\/div>\n    <div><strong>X<\/strong>: Misdirection, Disappearing suspect<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 13) AVIATION -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Aviation\"><strong>Aviation<\/strong> \u2014 airports, cockpits, hangars<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Pilot, Co-pilot, Air traffic controller<\/div>\n    <div><strong>P<\/strong>: Cockpit, Airport, Hangar<\/div>\n    <div><strong>O<\/strong>: Jet engine, Headset, Map<\/div>\n    <div><strong>X<\/strong>: Turbulence, Fuel leak, Bad landing<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 14) SCI-FI - GENERAL -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Sci-Fi (General)\"><strong>Sci-Fi \u2014 General<\/strong> \u2014 labs, tech, mutations<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Cyborg, Scientist, Clone<\/div>\n    <div><strong>P<\/strong>: Research lab, Underground base<\/div>\n    <div><strong>O<\/strong>: Time machine, Hologram, Serum<\/div>\n    <div><strong>X<\/strong>: Tech malfunction, Rogue AI<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 15) EMPIRE BUILDING -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Empire Building\"><strong>Empire Building<\/strong> \u2014 cities, markets, forts<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Ruler, Architect, Worker<\/div>\n    <div><strong>P<\/strong>: Capital city, Marketplace, Fortress<\/div>\n    <div><strong>O<\/strong>: Throne, Blueprints, Banner<\/div>\n    <div><strong>X<\/strong>: Rebellion, Plague, Natural disaster<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 16) SURREAL \/ SILLY \/ ABSURD -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Surreal \/ Silly \/ Absurd\"><strong>Surreal \/ Silly \/ Absurd<\/strong> \u2014 nonsense worlds &#038; goofy rules<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Talking banana, Dancing robot, Time-traveling dog<\/div>\n    <div><strong>P<\/strong>: Upside-down world, Flying circus<\/div>\n    <div><strong>O<\/strong>: Rubber chicken, Giant pencil, Marshmallow crown<\/div>\n    <div><strong>X<\/strong>: Logic fails, Backward day, Speak in rhymes<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 17) CASTLES \/ MEDIEVAL -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Castles \/ Medieval\"><strong>Castles \/ Medieval<\/strong> \u2014 knights, dragons, moats<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Knight, Squire, Princess, Dragon<\/div>\n    <div><strong>P<\/strong>: Castle tower, Throne room, Moat<\/div>\n    <div><strong>O<\/strong>: Sword, Crown, Shield<\/div>\n    <div><strong>X<\/strong>: Siege, Betrayal, Dragon attack<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 18) SCI-FI - SPACE COMBAT -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Sci-Fi (Space Combat)\"><strong>Sci-Fi \u2014 Space Combat<\/strong> \u2014 fleets, aliens, battles<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Space marine, Alien commander, Droid<\/div>\n    <div><strong>P<\/strong>: Starship, Asteroid base, Battle station<\/div>\n    <div><strong>O<\/strong>: Laser cannon, Warp drive, Plasma shield<\/div>\n    <div><strong>X<\/strong>: Hull breach, Alien ambush<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 19) MOVIES -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Movies\"><strong>Movies<\/strong> \u2014 sets, stars, blockbusters<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Director, Actor, Crew<\/div>\n    <div><strong>P<\/strong>: Movie set, Backlot, Premiere<\/div>\n    <div><strong>O<\/strong>: Camera, Script, Popcorn<\/div>\n    <div><strong>X<\/strong>: Plot twist, Box office flop<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 20) BOOKS -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Books\"><strong>Books<\/strong> \u2014 libraries, quests, lore<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Librarian, Author, Adventurer<\/div>\n    <div><strong>P<\/strong>: Library, Bookshop, Fantasy realm<\/div>\n    <div><strong>O<\/strong>: Quill, Magic tome, Bookmark<\/div>\n    <div><strong>X<\/strong>: Lost manuscript, Cursed page<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 21) TELEVISION -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Television\"><strong>Television<\/strong> \u2014 studios, shows, live broadcasts<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: TV host, Contestant, Crew<\/div>\n    <div><strong>P<\/strong>: Studio set, Control room, Stage<\/div>\n    <div><strong>O<\/strong>: Remote, Communicator, Script<\/div>\n    <div><strong>X<\/strong>: Cancelled show, Transmission glitch<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 22) GEOGRAPHY \/ EXPLORATION -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Geography \/ Exploration\"><strong>Geography \/ Exploration<\/strong> \u2014 maps, climates, expeditions<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Explorer, Cartographer, Local guide<\/div>\n    <div><strong>P<\/strong>: Volcano, Rainforest, Glacier<\/div>\n    <div><strong>O<\/strong>: Compass, Flag, Map<\/div>\n    <div><strong>X<\/strong>: Lost, Natural hazard, No translator<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 23) ANIMALS \/ WILDLIFE -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Animals \/ Wildlife\"><strong>Animals \/ Wildlife<\/strong> \u2014 jungles, zoos, reefs<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Zookeeper, Animal whisperer, Wild animal<\/div>\n    <div><strong>P<\/strong>: Jungle, Zoo, Ocean reef<\/div>\n    <div><strong>O<\/strong>: Binoculars, Collar, Nest<\/div>\n    <div><strong>X<\/strong>: Animal escape, Missing food<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 24) HORROR -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Horror\"><strong>Horror<\/strong> \u2014 ghosts, curses, midnight dares<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Vampire, Ghost, Haunted doll<\/div>\n    <div><strong>P<\/strong>: Abandoned house, Graveyard, Foggy forest<\/div>\n    <div><strong>O<\/strong>: Ouija board, Flashlight, Mirror<\/div>\n    <div><strong>X<\/strong>: Curse, Disappearance, Nightfall trap<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 25) CAVEMAN \/ PREHISTORY -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Caveman \/ Prehistory\"><strong>Caveman \/ Prehistory<\/strong> \u2014 stone tools, beasts, fire<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Caveman, Tribe leader, Mammoth<\/div>\n    <div><strong>P<\/strong>: Cave, Volcano, Riverbank<\/div>\n    <div><strong>O<\/strong>: Club, Fire, Stone wheel<\/div>\n    <div><strong>X<\/strong>: Saber-tooth attack, Rockslide<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n\n<!-- 26) ARCHAEOLOGY -->\n<details class=\"cob-theme-block\">\n  <summary><label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-theme\" value=\"Archaeology\"><strong>Archaeology<\/strong> \u2014 digs, tombs, relics<\/label><\/summary>\n  <div class=\"cob-sec\">\n    <div><strong>C<\/strong>: Archaeologist, Tomb raider, Mummy<\/div>\n    <div><strong>P<\/strong>: Pyramid, Dig site, Desert<\/div>\n    <div><strong>O<\/strong>: Scroll, Pickaxe, Sarcophagus<\/div>\n    <div><strong>X<\/strong>: Booby trap, Sandstorm, Lost map<\/div>\n    <div class=\"cob-edit\" contenteditable=\"true\"><\/div>\n  <\/div>\n<\/details>\n          <!-- You can duplicate the pattern above to add more categories -->\n        <\/div>\n      <\/details>\n\n      <div class=\"cob-note\">\n        <strong>Teacher notes (click to expand):<\/strong>\n        <details><summary>Prompts to spark ideas<\/summary>\n          <div class=\"cob-sec\">\n            &#8211; \u201cWho lives in this world?\u201d \u201cWhat can go wrong?\u201d \u201cWhat cool items exist here?\u201d<br>\n            &#8211; Paste reference images into any theme\u2019s notes box.\n          <\/div>\n        <\/details>\n      <\/div>\n    <\/div>\n  <\/details>\n\n  <!-- STEP 2 -->\n  <details>\n    <summary>Step 2 \u2013 Plan the Game Rules \ud83c\udfb2<\/summary>\n    <div class=\"cob-sec\">\n      <p>Decide how to win and what happens on turns.<\/p>\n\n      <div class=\"cob-row\"><strong>Goal(s):<\/strong><\/div>\n      <div class=\"cob-options\">\n        <!-- multiple selection allowed -->\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-goal\" value=\"Reach the finish first\"> Reach the finish first<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-goal\" value=\"Collect the most treasure\/money\"> Collect the most treasure\/money<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-goal\" value=\"Solve a mystery\"> Solve a mystery<\/label>\n        <div class=\"cob-chip\" style=\"gap:6px;\">\n          <span>Custom:<\/span>\n          <input class=\"cob-input cob-sync\" data-target=\"#recap-goal\" placeholder=\"Type a goal\u2026\">\n        <\/div>\n      <\/div>\n\n      <div class=\"cob-row\" style=\"margin-top:10px;\"><strong>Players:<\/strong>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"players\" class=\"cob-sync\" data-target=\"#recap-players\" value=\"2 players\"> 2 players<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"players\" class=\"cob-sync\" data-target=\"#recap-players\" value=\"3\u20134 players\"> 3\u20134 players<\/label>\n        <input class=\"cob-input cob-sync\" data-target=\"#recap-players\" placeholder=\"Other\u2026\">\n      <\/div>\n\n      <div class=\"cob-row\"><strong>Obstacles:<\/strong><\/div>\n      <div class=\"cob-options\">\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-obstacles\" value=\"Lose a turn\"> Lose a turn<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-obstacles\" value=\"Go backward\"> Go backward<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-obstacles\" value=\"Pay a coin\"> Pay a coin<\/label>\n        <div class=\"cob-chip\"><input class=\"cob-input cob-sync\" data-target=\"#recap-obstacles\" placeholder=\"Custom obstacle\u2026\"><\/div>\n      <\/div>\n\n      <div class=\"cob-row\" style=\"margin-top:10px;\"><strong>Helpers:<\/strong><\/div>\n      <div class=\"cob-options\">\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-helpers\" value=\"Shortcut\"> Shortcut<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-helpers\" value=\"Power-up\"> Power-up<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-helpers\" value=\"Roll again\"> Roll again<\/label>\n        <div class=\"cob-chip\"><input class=\"cob-input cob-sync\" data-target=\"#recap-helpers\" placeholder=\"Custom helper\u2026\"><\/div>\n      <\/div>\n    <\/div>\n  <\/details>\n\n  <!-- STEP 3 -->\n  <details>\n    <summary>Step 3 \u2013 Plan Your Game Board \ud83c\udfa8<\/summary>\n    <div class=\"cob-sec\">\n      <div class=\"cob-row\"><strong>Board shape:<\/strong><\/div>\n      <div class=\"cob-options\">\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"shape\" class=\"cob-sync\" data-target=\"#recap-shape\" value=\"Square\"> Square<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"shape\" class=\"cob-sync\" data-target=\"#recap-shape\" value=\"Rectangle\"> Rectangle<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"shape\" class=\"cob-sync\" data-target=\"#recap-shape\" value=\"Circle\"> Circle<\/label>\n        <div class=\"cob-chip\" style=\"gap:6px;\"><span>Custom shape:<\/span>\n          <input id=\"shape-custom\" class=\"cob-input\" placeholder=\"Type any shape\u2026\">\n        <\/div>\n      <\/div>\n\n      <div class=\"cob-row\" style=\"margin-top:10px;\"><strong>Start &#038; Finish:<\/strong>\n        <input class=\"cob-input cob-sync\" data-target=\"#recap-start\" placeholder=\"Start at\u2026 (e.g., Ranch)\">\n        <input class=\"cob-input cob-sync\" data-target=\"#recap-finish\" placeholder=\"Finish at\u2026 (e.g., Hideout)\">\n      <\/div>\n\n      <div class=\"cob-row\"><strong>Path style:<\/strong><\/div>\n      <div class=\"cob-options\">\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"path\" class=\"cob-sync\" data-target=\"#recap-path\" value=\"Spiral\"> Spiral<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"path\" class=\"cob-sync\" data-target=\"#recap-path\" value=\"Winding trail\"> Winding trail<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"path\" class=\"cob-sync\" data-target=\"#recap-path\" value=\"Zig-zag\"> Zig-zag<\/label>\n        <label class=\"cob-chip\"><input type=\"radio\" name=\"path\" class=\"cob-sync\" data-target=\"#recap-path\" value=\"Straight with forks\"> Straight with forks<\/label>\n      <\/div>\n\n      <div class=\"cob-row\"><strong>Space icons:<\/strong><\/div>\n      <div class=\"cob-options\">\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-spaces\" value=\"Circles\"> Circles<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-spaces\" value=\"Squares\"> Squares<\/label>\n        <label class=\"cob-chip\"><input type=\"checkbox\" class=\"cob-sync\" data-target=\"#recap-spaces\" value=\"Footprints\"> Footprints<\/label>\n        <div class=\"cob-chip\" style=\"gap:6px;\">\n          <label><input id=\"theme-icons-check\" type=\"checkbox\"> Theme icons<\/label>\n          <input id=\"theme-icons-edit\" class=\"cob-input\" placeholder=\"e.g., sheriff stars, clues, treasure chests\">\n        <\/div>\n      <\/div>\n\n      <div class=\"cob-note\">\n        <strong>Board tips:<\/strong>\n        <details><summary>Drafting ideas<\/summary>\n          <div class=\"cob-sec\">\n            &#8211; Sketch with marker first; place special spaces every 4\u20136 moves.<br>\n            &#8211; Add 2\u20134 \u201cbonus spots\u201d and 2\u20134 \u201ctrap spots.\u201d\n          <\/div>\n        <\/details>\n      <\/div>\n    <\/div>\n  <\/details>\n\n  <!-- STEP 4 -->\n  <details>\n    <summary>Step 4 \u2013 Build &#038; Play-test \ud83e\uddea<\/summary>\n    <div class=\"cob-sec\">\n      <p>Make a simple prototype: a printed\/hand-drawn board, dice, and two tokens. Then play 1\u20132 quick rounds and write one rule to improve.<\/p>\n      <div class=\"cob-note\">\n        <strong>Teacher notes:<\/strong>\n        <details><summary>Play-test focus<\/summary>\n          <div class=\"cob-sec\">\n            &#8211; Is the game too long\/short? Is there a dominant strategy?<br>\n            &#8211; Did the theme show up in the actions?\n          <\/div>\n        <\/details>\n      <\/div>\n    <\/div>\n  <\/details>\n\n  <!-- LIVE RECAP (auto-fills) -->\n  <div class=\"cob-hr\"><\/div>\n  <div class=\"cob-recap\" id=\"recap\">\n    <h3>\ud83d\udccc Lesson Recap (auto-filled)<\/h3>\n    <ul>\n      <li><strong>Theme(s):<\/strong> <span id=\"recap-theme\">\u2014<\/span><\/li>\n      <li><strong>Goal(s):<\/strong> <span id=\"recap-goal\">\u2014<\/span><\/li>\n      <li><strong>Players:<\/strong> <span id=\"recap-players\">\u2014<\/span><\/li>\n      <li><strong>Board shape:<\/strong> <span id=\"recap-shape\">\u2014<\/span><\/li>\n      <li><strong>Start:<\/strong> <span id=\"recap-start\">\u2014<\/span> \u2192 <strong>Finish:<\/strong> <span id=\"recap-finish\">\u2014<\/span><\/li>\n      <li><strong>Path:<\/strong> <span id=\"recap-path\">\u2014<\/span><\/li>\n      <li><strong>Spaces:<\/strong> <span id=\"recap-spaces\">\u2014<\/span><\/li>\n    <\/ul>\n    <button class=\"cob-btn\" id=\"recap-copy\">Copy Recap<\/button>\n  <\/div>\n\n  <div class=\"cob-hr\"><\/div>\n  <p class=\"cob-small\">Next: scroll down to your **MATCHING** widget to roll, track coins, and play!<\/p>\n<\/div>\n\n<script>\n(function(){\n  const $ = (sel,root=document)=>root.querySelector(sel);\n  const $$ = (sel,root=document)=>Array.from(root.querySelectorAll(sel));\n\n  \/\/ ----- THEME MULTISELECT (checkboxes + custom add) -----\n  const themeInput = $('#theme-main');\n  const addBtn = $('#add-theme');\n  const themeCheckboxes = $$('.cob-theme');\n\n  let typedThemes = []; \/\/ simple in-memory list\n\n  function updateThemeRecap(){\n    const selected = themeCheckboxes.filter(cb=>cb.checked).map(cb=>cb.value);\n    const all = Array.from(new Set([...selected, ...typedThemes])).filter(Boolean);\n    $('#recap-theme').textContent = all.length ? all.join(', ') : '\u2014';\n  }\n\n  addBtn.addEventListener('click', ()=>{\n    const v = (themeInput.value||'').trim();\n    if(!v) return;\n    typedThemes.push(v);\n    typedThemes = Array.from(new Set(typedThemes));\n    themeInput.value='';\n    updateThemeRecap();\n  });\n  themeInput.addEventListener('keydown', e=>{\n    if(e.key==='Enter'){ e.preventDefault(); addBtn.click(); }\n  });\n  themeCheckboxes.forEach(cb=>cb.addEventListener('change', updateThemeRecap));\n\n  \/\/ ----- GENERIC RECAP SYNC -----\n  function refreshMultiLists(){\n    const groups = {\n      '#recap-goal'    : $$('[data-target=\"#recap-goal\"]'),\n      '#recap-spaces'  : $$('[data-target=\"#recap-spaces\"]')\n    };\n    Object.entries(groups).forEach(([targetSel, nodes])=>{\n      \/\/ Special handling for \"Theme icons\"\n      if(targetSel==='#recap-spaces'){\n        const checked = nodes.filter(n => n.type==='checkbox' && n.checked).map(n=>n.value);\n        const themeCheck = $('#theme-icons-check');\n        const themeText  = ($('#theme-icons-edit').value||'').trim();\n        if(themeCheck && themeCheck.checked){\n          checked.push( themeText ? `Theme icons (${themeText})` : 'Theme icons' );\n        }\n        $('#recap-spaces').textContent = checked.length ? checked.join(', ') : '\u2014';\n        return;\n      }\n      \/\/ Regular multi list (goals)\n      const values = nodes.filter(n => (n.type==='checkbox' && n.checked) || (n.type!=='checkbox' && n.value && n.dataset.target===targetSel))\n                          .map(n => n.type==='checkbox' ? n.value : n.value.trim());\n      $(targetSel).textContent = values.length ? values.join(', ') : '\u2014';\n    });\n  }\n\n  \/\/ Bind for radios\/checkboxes\/texts\n  $$('.cob-sync').forEach(el=>{\n    const targetSel = el.dataset.target;\n    const handler = ()=>{\n      if(el.type==='radio'){ if(el.checked) $(targetSel).textContent = el.value; }\n      else if(el.type==='checkbox'){ refreshMultiLists(); }\n      else { $(targetSel).textContent = el.value || '\u2014'; }\n    };\n    el.addEventListener('input', handler);\n    el.addEventListener('change', handler);\n  });\n\n  \/\/ Hook the \u201cTheme icons\u201d editable pair\n  $('#theme-icons-check').addEventListener('change', refreshMultiLists);\n  $('#theme-icons-edit').addEventListener('input', refreshMultiLists);\n\n  \/\/ STEP 3: Custom shape overrides radio choice\n  const shapeCustom = $('#shape-custom');\n  shapeCustom.addEventListener('input', ()=>{\n    $('#recap-shape').textContent = shapeCustom.value.trim() || '\u2014';\n  });\n\n  \/\/ Copy Recap\n  $('#recap-copy').addEventListener('click', ()=>{\n    const txt = [\n      `Theme(s): ${$('#recap-theme').textContent}`,\n      `Goal(s): ${$('#recap-goal').textContent}`,\n      `Players: ${$('#recap-players').textContent}`,\n      `Board shape: ${$('#recap-shape').textContent}`,\n      `Start: ${$('#recap-start').textContent} -> Finish: ${$('#recap-finish').textContent}`,\n      `Path: ${$('#recap-path').textContent}`,\n      `Spaces: ${$('#recap-spaces').textContent}`\n    ].join('\\\\n');\n    navigator.clipboard.writeText(txt).then(()=>{\n      const b=$('#recap-copy'), old=b.textContent; b.textContent='Copied!'; setTimeout(()=>b.textContent=old,1000);\n    });\n  });\n\n  \/\/ Initialize\n  updateThemeRecap();\n  refreshMultiLists();\n})();\n<\/script>\n\n\n\n<!-- ================= Rina's Game: WANTED WESTERN \u2014 Rules (compact) ================ -->\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Rye&#038;family=Inter:wght@400;600;800&#038;display=swap\" rel=\"stylesheet\">\n<style>\n  .rr-wrap{max-width:860px;margin:0 auto 14px auto;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:#2b2013}\n  .rr-card{background:linear-gradient(#fffef8,#f9f0dc);border:2px solid #5b3c27;border-radius:14px;box-shadow:0 6px 16px rgba(0,0,0,.08)}\n  .rr-hd{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:2px dashed #5b3c27}\n  .rr-title{font-family:Rye,Georgia,serif;font-size:26px;color:#5b3c27;letter-spacing:.4px}\n  .rr-tag{font-weight:800;background:#e9d2a5;border:2px solid #5b3c27;border-radius:10px;padding:4px 8px}\n  .rr-body{padding:12px 16px}\n  .rr-two{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}\n  @media (max-width:780px){.rr-two{grid-template-columns:1fr}}\n  .rr-box{background:#fff;border:2px solid #c9b28f;border-radius:12px;padding:10px 12px}\n  .rr-box h3{margin:.1rem 0 .35rem 0;font-size:18px;color:#5b3c27;font-family:Rye,Georgia,serif}\n  .rr-box ul{margin:.2rem 0 .2rem 1.1rem}\n  .rr-small{font-size:13px;opacity:.8}\n  .rr-hr{height:2px;background:repeating-linear-gradient(90deg,#5b3c27,#5b3c27 14px,transparent 14px,transparent 24px);opacity:.35;margin:10px 0}\n  details.rr-coll{border:2px solid #c9b28f;border-radius:12px;background:#fff}\n  details.rr-coll>summary{cursor:pointer;list-style:none;padding:10px 12px;font-weight:800;background:#fff6e1;border-radius:10px}\n  details.rr-coll[open]>summary{background:#f6ebcf}\n  details .rr-colbody{padding:10px 12px}\n  .rr-pill{display:inline-block;border:2px solid #5b3c27;border-radius:999px;padding:2px 8px;font-weight:800;background:#fff8e7;margin-right:6px}\n<\/style>\n\n<div class=\"rr-wrap rr-card\" id=\"rinas-rules\">\n  <div class=\"rr-hd\">\n    <div class=\"rr-title\">Wanted Western \u2014 Rina\u2019s Game<\/div>\n    <div class=\"rr-tag\">Quick Rules<\/div>\n  <\/div>\n\n  <div class=\"rr-body\">\n    <div class=\"rr-two\">\n      <!-- Left column -->\n      <div class=\"rr-box\">\n        <h3>Setup<\/h3>\n        <ul>\n          <li>Players: <strong>2<\/strong><\/li>\n          <li>Start at the <strong>Ranch<\/strong>. Finish at the <strong>Wanted Poster<\/strong>.<\/li>\n          <li>Place <strong>3 Magic Towers<\/strong> anywhere on the path.<\/li>\n          <li>Use <strong>sheriff stars<\/strong> as spaces. Follow the path to the end.<\/li>\n          <li>Each player starts with <strong>3 coins<\/strong> (use the Scorekeeper).<\/li>\n          <li>Pick your role on the Scorekeeper: <span class=\"rr-pill\">Cowboy\/Cowgirl<\/span> or <span class=\"rr-pill\">Outlaw<\/span> (open roles).<\/li>\n        <\/ul>\n\n        <div class=\"rr-hr\"><\/div>\n        <h3>How to Win<\/h3>\n        <ul>\n          <li><strong>Cowboy\/Cowgirl:<\/strong> reach the Finish first <em>or<\/em> have more coins at the end.<\/li>\n          <li><strong>Outlaw:<\/strong> have the <em>most coins<\/em> when any player reaches the Finish.<\/li>\n        <\/ul>\n\n        <div class=\"rr-hr\"><\/div>\n        <h3>Turn<\/h3>\n        <ul>\n          <li><strong>Roll<\/strong> the die \u2192 <strong>Move<\/strong> forward that many spaces.<\/li>\n          <li>Optional: after moving, draw 1 <strong>Mission\/Event<\/strong> card from the widget.<\/li>\n        <\/ul>\n      <\/div>\n\n      <!-- Right column -->\n      <div class=\"rr-box\">\n        <h3>Spaces &#038; Coins<\/h3>\n        <ul>\n          <li><strong>Magic Tower:<\/strong> +2 coins from the bank.<\/li>\n          <li><strong>Same Space as opponent:<\/strong> take <strong>1 coin<\/strong> from them. If they can\u2019t pay, they move back to <strong>Start<\/strong>.<\/li>\n          <li><strong>Off the path?<\/strong> Stay on the nearest star forward.<\/li>\n          <li><strong>At Finish:<\/strong> stop on it; game ends after that turn\u2019s effects.<\/li>\n        <\/ul>\n\n        <div class=\"rr-hr\"><\/div>\n        <h3>End of Game<\/h3>\n        <ul>\n          <li>Ends when any player reaches the <strong>Finish<\/strong>.<\/li>\n          <li>Count coins. Apply role goals above to decide the winner.<\/li>\n          <li><span class=\"rr-small\">Tie-breakers (in order): most Magic Towers visited \u2192 highest last die roll.<\/span><\/li>\n        <\/ul>\n      <\/div>\n    <\/div>\n\n    <!-- Collapsibles -->\n    <div style=\"margin-top:12px;display:grid;gap:10px\">\n      <details class=\"rr-coll\">\n        <summary>\u2b50 Mission \/ Event Cards (how we use them)<\/summary>\n        <div class=\"rr-colbody\">\n          Draw after you move. Resolve immediately. If a card conflicts with a rule here, the card text wins for that turn.\n        <\/div>\n      <\/details>\n\n      <details class=\"rr-coll\">\n        <summary>\ud83c\udfaf Teacher\/House Rules (editable notes)<\/summary>\n        <div class=\"rr-colbody\" contenteditable=\"true\" style=\"min-height:56px;border:1px dashed #c9b28f;border-radius:8px;background:#fff\">\n          Type any tweaks here\u2026 (e.g., Towers are +3 coins, draw a card only on \u2b50 spaces, etc.)\n        <\/div>\n      <\/details>\n    <\/div>\n  <\/div>\n<\/div>\n<!-- ===================== end rules block ===================== -->\n\n\n\n<!-- WANTED WESTERN: Mission Card + Scoreboard (stacked default) + Roles + Save + Dice Anim + Layout Toggle + Dice in Titlebar -->\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Rye&#038;family=Spectral:wght@400;700&#038;display=swap\" rel=\"stylesheet\">\n\n<style>\n  :root{\n    --ww-ink:#2b2013; --ww-parchment:#f9f0dc; --ww-rail:#5b3c27;\n    --ww-gold:#c7952c; --ww-denim:#2a5d8f; --ww-sky:#eaf2fb;\n    --ww-cowboy-bg:#fff9ed; --ww-cowboy-border:#b68d5a;\n    --ww-outlaw-bg:#fff0f0; --ww-outlaw-border:#a94442;\n  }\n\n  .ww-wrap{font-family:Spectral,Georgia,serif;max-width:820px;margin:18px auto;color:var(--ww-ink);\n    background:linear-gradient(#fffdf7,var(--ww-parchment));border:2px solid var(--ww-rail);\n    border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.1);padding:16px 18px;position:relative}\n  .ww-brand{position:absolute;top:-12px;left:16px;background:var(--ww-parchment);\n    border:2px solid var(--ww-rail);border-radius:10px;padding:2px 8px;font-family:Rye,Georgia,serif;color:var(--ww-rail)}\n\n  .ww-section-title{font-family:Rye,Georgia,serif;color:var(--ww-rail);font-size:22px;margin:8px 0 10px}\n  .ww-divider{height:2px;background:repeating-linear-gradient(90deg,var(--ww-rail),var(--ww-rail) 10px,transparent 10px,transparent 18px);opacity:.3;margin:10px 0 14px}\n\n  .ww-btn{margin:5px;padding:8px 14px;font-size:16px;border:2px solid var(--ww-rail);border-radius:8px;background:linear-gradient(#6ea3d4,#5786b1);color:#fff;cursor:pointer;font-weight:700}\n  .ww-btn:hover{filter:brightness(.97)}\n  .ww-chip{padding:6px 10px;border:2px solid var(--ww-rail);border-radius:999px;background:linear-gradient(#ffe19e,#ffd078);cursor:pointer;font-weight:700}\n\n  \/* Mission Card *\/\n  .ww-card-wrap{perspective:1000px;display:flex;justify-content:center;margin:10px 0 6px}\n  .ww-card{width:min(100%,360px);height:190px;border:2px solid var(--ww-rail);border-radius:12px;\n    box-shadow:0 4px 10px rgba(0,0,0,.25);transition:transform .8s;transform-style:preserve-3d;position:relative;cursor:pointer}\n  .ww-card.flip{transform:rotateY(180deg)}\n  .ww-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;border-radius:12px;padding:10px;border:6px double var(--ww-rail);text-align:center}\n  .ww-front{background:linear-gradient(#ffe19e,#ffd078);font-family:Rye,Georgia,serif}\n  .ww-back{background:var(--ww-sky);transform:rotateY(180deg);font-weight:700;font-size:18px}\n\n  \/* Scoreboard *\/\n  .ww-panel{border:2px solid var(--ww-rail);border-radius:12px;padding:12px;background:#fffdf7}\n\n  \/* Title bar with dice on the right *\/\n  .ww-titlebar{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:8px 0 6px}\n  .ww-dicebar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}\n  .ww-die{width:46px;height:46px;display:grid;place-items:center;border:2px solid var(--ww-rail);border-radius:8px;background:#fff;font-size:20px;font-weight:800}\n  .ww-die.animate{animation:shake .6s}\n  @keyframes shake{0%{transform:rotate(0)}25%{transform:rotate(10deg)}50%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}100%{transform:rotate(0)}}\n\n  .ww-grid{display:grid;grid-template-columns:1fr;gap:16px}            \/* stacked by default *\/\n  .ww-wrap.wide .ww-grid{grid-template-columns:1fr 1fr}                 \/* side-by-side when toggled *\/\n\n  .ww-player{border:2px solid var(--ww-rail);border-radius:12px;padding:12px;transition:box-shadow .2s,border-color .2s,background .2s}\n  .ww-top{display:flex;gap:8px;align-items:center;margin-bottom:8px}\n  .ww-name input{border:1px solid var(--ww-cowboy-border);border-radius:6px;padding:6px 8px;font-size:16px;width:100%;background:#fff9ed}\n  .ww-role-badge{font-family:Rye,Georgia,serif;border:2px solid var(--ww-rail);border-radius:999px;padding:6px 10px;background:#ffe7b6;cursor:pointer;white-space:nowrap}\n  .ww-role-info{font-size:12px;opacity:.75;margin-left:auto}\n\n  .ww-coins{font-size:28px;font-weight:800}\n  .ww-row{display:flex;align-items:center;justify-content:space-between;margin:6px 0}\n  .ww-controls button{padding:6px 10px;border:2px solid var(--ww-rail);background:#f7e2b7;border-radius:6px;cursor:pointer;font-weight:700}\n  .ww-controls button:hover{filter:brightness(.97)}\n\n  \/* Role skins *\/\n  .role-cowboy{background:var(--ww-cowboy-bg);border-color:var(--ww-cowboy-border)}\n  .role-cowboy .ww-name input{border-color:var(--ww-cowboy-border)}\n  .role-cowboy .ww-role-badge{background:#ffe7b6;border-color:#a97b32}\n  .role-outlaw{background:var(--ww-outlaw-bg);border-color:var(--ww-outlaw-border)}\n  .role-outlaw .ww-name input{border-color:var(--ww-outlaw-border)}\n  .role-outlaw .ww-role-badge{background:#ffd0d0;border-color:#a94442}\n<\/style>\n\n<div class=\"ww-wrap\" id=\"ww-wrap\">\n  <div class=\"ww-brand\">Rina\u2019s Board Gmae: Wanted in the Wild West<\/div>\n\n  <!-- Mission Card -->\n  <div class=\"ww-section-title\">\ud83c\udfb4 Mission \/ Event Card<\/div>\n  <div class=\"ww-card-wrap\">\n    <div class=\"ww-card\" id=\"ww-card\">\n      <div class=\"ww-face ww-front\">Click &#8220;Draw&#8221; to see a card<\/div>\n      <div class=\"ww-face ww-back\" id=\"ww-card-back\"><\/div>\n    <\/div>\n  <\/div>\n  <div style=\"text-align:center;\">\n    <button class=\"ww-btn\" id=\"ww-draw\">\ud83c\udfb2 Draw Card<\/button>\n    <button class=\"ww-btn\" id=\"ww-hide\">\ud83d\ude48 Hide Card<\/button>\n  <\/div>\n\n  <div class=\"ww-divider\"><\/div>\n\n  <!-- Scoreboard title with dice on the right -->\n  <div class=\"ww-titlebar\">\n    <div class=\"ww-section-title\" style=\"margin:0;\">\ud83e\ude99 2-Player Scorekeeper<\/div>\n    <div class=\"ww-dicebar\">\n      <button class=\"ww-btn\" id=\"ww-roll\">\ud83c\udfb2 Roll Dice<\/button>\n      <div class=\"ww-die\" id=\"ww-die\"><span id=\"ww-die-val\">\u2013<\/span><\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"ww-panel\">\n    <div class=\"ww-grid\" id=\"ww-grid\">\n      <!-- Player 1 -->\n      <div class=\"ww-player role-cowboy\" id=\"ww-p1\">\n        <div class=\"ww-top\">\n          <input id=\"ww-p1-name\" type=\"text\" placeholder=\"Player 1\" \/>\n          <button class=\"ww-role-badge\" id=\"ww-p1-role\">\ud83e\udd20 Cowboy\/Cowgirl<\/button>\n          <span class=\"ww-role-info\">click to toggle<\/span>\n        <\/div>\n        <div class=\"ww-row\"><span>Coins<\/span><div class=\"ww-coins\" id=\"ww-p1-coins\">3<\/div><\/div>\n        <div class=\"ww-row ww-controls\">\n          <button data-p=\"1\" data-delta=\"-1\">-1<\/button>\n          <button data-p=\"1\" data-delta=\"+1\">+1<\/button>\n        <\/div>\n      <\/div>\n\n      <!-- Player 2 -->\n      <div class=\"ww-player role-cowboy\" id=\"ww-p2\">\n        <div class=\"ww-top\">\n          <input id=\"ww-p2-name\" type=\"text\" placeholder=\"Player 2\" \/>\n          <button class=\"ww-role-badge\" id=\"ww-p2-role\">\ud83e\udd20 Cowboy\/Cowgirl<\/button>\n          <span class=\"ww-role-info\">click to toggle<\/span>\n        <\/div>\n        <div class=\"ww-row\"><span>Coins<\/span><div class=\"ww-coins\" id=\"ww-p2-coins\">3<\/div><\/div>\n        <div class=\"ww-row ww-controls\">\n          <button data-p=\"2\" data-delta=\"-1\">-1<\/button>\n          <button data-p=\"2\" data-delta=\"+1\">+1<\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <div style=\"display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px\">\n      <button class=\"ww-btn\" id=\"ww-save\">\ud83d\udcbe Save<\/button>\n      <button class=\"ww-btn\" id=\"ww-reset\">\ud83d\udd04 Reset<\/button>\n      <button class=\"ww-chip\" id=\"ww-layout\">Toggle Layout: Side-by-Side \/ Stacked<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  \/* Missions *\/\n  const missions=[\n    \"\ud83e\udd20 Stay Cowboy: Keep racing to the finish.\",\n    \"\ud83d\ude08 Become Outlaw: Collect the most money before the finish.\",\n    \"\ud83c\udf81 Treasure Hunter: Collect coins AND reach the finish to win.\",\n    \"\ud83c\udfb2 Double Agent: Roll twice on your next turn.\",\n    \"\ud83d\udcb0 Bank Robber: Steal 2 coins from the other player.\",\n    \"\ud83d\udee1 Sheriff\u2019s Favor: No one can steal from you until your next turn.\",\n    \"\ud83c\udfdc Desert Storm: Lose 1 turn while you wait out the storm.\",\n    \"\ud83d\udc0e Fast Horse: Move forward 3 spaces immediately.\",\n    \"\ud83e\ude99 Lucky Find: Gain 2 extra coins.\",\n    \"\ud83d\udd12 Locked Gate: Pay 1 coin to pass or go back 2 spaces.\",\n    \"\ud83d\ude82 Train Heist: Roll again \u2014 on 5 or 6, collect 3 coins.\",\n    \"\ud83c\udf89 Festival in Town: Skip ahead to the next Magic Tower.\",\n    \"\u2694\ufe0f Showdown: Duel the other player. Winner +1 coin.\"\n  ];\n\n  \/* Card *\/\n  const card=document.getElementById('ww-card');\n  const back=document.getElementById('ww-card-back');\n  document.getElementById('ww-draw').addEventListener('click',()=>{\n    back.textContent=missions[Math.floor(Math.random()*missions.length)];\n    card.classList.add('flip'); \/\/ stays open\n  });\n  document.getElementById('ww-hide').addEventListener('click',()=>card.classList.remove('flip'));\n\n  \/* Players \/ roles *\/\n  const p1={name:document.getElementById('ww-p1-name'), coins:document.getElementById('ww-p1-coins'), box:document.getElementById('ww-p1'), roleBtn:document.getElementById('ww-p1-role'), role:'cowboy'};\n  const p2={name:document.getElementById('ww-p2-name'), coins:document.getElementById('ww-p2-coins'), box:document.getElementById('ww-p2'), roleBtn:document.getElementById('ww-p2-role'), role:'cowboy'};\n\n  function getCoins(el){return parseInt(el.textContent,10)||0}\n  function setCoins(el,n){el.textContent=Math.max(0,n)}\n\n  function setRole(player,role){\n    player.box.classList.toggle('role-cowboy', role==='cowboy');\n    player.box.classList.toggle('role-outlaw', role==='outlaw');\n    player.roleBtn.textContent = (role==='cowboy') ? '\ud83e\udd20 Cowboy\/Cowgirl' : '\ud83d\ude08 Outlaw';\n    player.role=role; save();\n  }\n  function toggleRole(p){ setRole(p, p.role==='cowboy' ? 'outlaw' : 'cowboy'); }\n  p1.roleBtn.addEventListener('click',()=>toggleRole(p1));\n  p2.roleBtn.addEventListener('click',()=>toggleRole(p2));\n\n  document.querySelectorAll('.ww-controls button').forEach(btn=>{\n    btn.addEventListener('click',()=>{\n      const delta=parseInt(btn.dataset.delta,10);\n      const target=(btn.dataset.p==='1')?p1.coins:p2.coins;\n      setCoins(target, getCoins(target)+delta); save();\n    });\n  });\n\n  \/* Dice with animation (titlebar) *\/\n  const rollBtn=document.getElementById('ww-roll');\n  const die=document.getElementById('ww-die');\n  const dieVal=document.getElementById('ww-die-val');\n  rollBtn.addEventListener('click',()=>{\n    die.classList.add('animate');\n    let frames=0;\n    const t=setInterval(()=>{\n      dieVal.textContent=1+Math.floor(Math.random()*6);\n      if(++frames>10){ clearInterval(t); die.classList.remove('animate'); save(); }\n    },90);\n  });\n\n  \/* Layout toggle + save *\/\n  const wrap=document.getElementById('ww-wrap');\n  const layoutBtn=document.getElementById('ww-layout');\n  function setLayout(mode){ wrap.classList.toggle('wide', mode==='wide'); localStorage.setItem('ww-layout', mode); }\n  layoutBtn.addEventListener('click',()=>{ setLayout( wrap.classList.contains('wide') ? 'stacked' : 'wide' ); });\n\n  \/* Save \/ Load *\/\n  const KEY='ww-save-v5';\n  function save(){\n    const state={\n      p1Name:p1.name.value, p2Name:p2.name.value,\n      p1Coins:getCoins(p1.coins), p2Coins:getCoins(p2.coins),\n      p1Role:p1.role, p2Role:p2.role,\n      die:dieVal.textContent,\n      layout: wrap.classList.contains('wide') ? 'wide' : 'stacked'\n    };\n    try{ localStorage.setItem(KEY, JSON.stringify(state)); }catch(e){}\n  }\n  function load(){\n    try{\n      const raw=localStorage.getItem(KEY); if(raw){\n        const s=JSON.parse(raw);\n        if(s.p1Name!=null) p1.name.value=s.p1Name;\n        if(s.p2Name!=null) p2.name.value=s.p2Name;\n        if(Number.isFinite(s.p1Coins)) setCoins(p1.coins,s.p1Coins);\n        if(Number.isFinite(s.p2Coins)) setCoins(p2.coins,s.p2Coins);\n        setRole(p1, (s.p1Role==='outlaw')?'outlaw':'cowboy');\n        setRole(p2, (s.p2Role==='outlaw')?'outlaw':'cowboy');\n        if(s.die) dieVal.textContent=s.die;\n        setLayout(s.layout==='wide' ? 'wide' : 'stacked');\n      } else {\n        const savedLayout = localStorage.getItem('ww-layout');\n        if(savedLayout) setLayout(savedLayout);\n      }\n    }catch(e){}\n  }\n\n  document.getElementById('ww-save').addEventListener('click',save);\n  document.getElementById('ww-reset').addEventListener('click',()=>{\n    p1.name.value='Player 1'; p2.name.value='Player 2';\n    setCoins(p1.coins,3); setCoins(p2.coins,3);\n    setRole(p1,'cowboy'); setRole(p2,'cowboy');\n    dieVal.textContent='\u2013'; setLayout('stacked'); save();\n  });\n\n  load();\n})();\n<\/script>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"<p>Create Your Own Board Game Lesson Goal Design and play a custom dice board game. We\u2019ll choose a theme, plan rules, build a board, and then play-test! Design a dice board game Write a clear directions\/rules sheet Make a playable prototype (board + pieces) Play the game together when finished Warm-up: What\u2019s your favorite board [&hellip;]<\/p>\n","protected":false},"author":132,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[215,17,94],"tags":[217,220,218,216,219],"class_list":["post-1449","post","type-post","status-publish","format-standard","hentry","category-board-game-lessons","category-lesson-activities","category-topics","tag-kids","tag-online-english-lesson","tag-project","tag-project-based-learning","tag-student-made-games"],"_links":{"self":[{"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=\/wp\/v2\/posts\/1449","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=\/wp\/v2\/users\/132"}],"replies":[{"embeddable":true,"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1449"}],"version-history":[{"count":0,"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=\/wp\/v2\/posts\/1449\/revisions"}],"wp:attachment":[{"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1449"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1449"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/teachmeifucan.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1449"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}