๐ŸŽฎArcadeLab

STARRY DAYS

by BlazingTurtle39
819 lines24.3 KB
โ–ถ Play
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>STARRY DAYS ๐ŸŽ€</title>

<style>

:root {

  --pink:#f4a8c8;

  --rose:#d96f9e;

  --lav:#c8b5f7;

  --cream:#fff9fc;

  --ink:#514054;

  --muted:#987f99;

  --line:#f2dce9;

}

*{box-sizing:border-box}

body{

 margin:0;font-family:system-ui,-apple-system,sans-serif;

 color:var(--ink);

 background:linear-gradient(150deg,#fff4fa,#f8f2ff 50%,#fff8e9);

 min-height:100vh;

}

button{font:inherit;cursor:pointer;touch-action:manipulation}

button:focus-visible{outline:3px solid #9d71d9}

.top{text-align:center;padding:25px 12px 15px}

.logo{font-size:clamp(29px,8vw,47px);font-weight:950;letter-spacing:4px;color:#d879a5}

.subtitle{font-size:11px;letter-spacing:3px;color:var(--muted)}

.wrap{max-width:900px;margin:auto;padding:10px 13px 35px}

.panel,.stat,.card{

 background:rgba(255,255,255,.88);border:1px solid var(--line);

 border-radius:19px;box-shadow:0 5px 20px #d5b3d51c;

}

.panel{padding:18px;margin-bottom:13px}

h1{font-size:25px;margin:0 0 9px}

h2{font-size:19px;margin:0 0 12px}

h3{font-size:15px;margin:0 0 7px}

p{font-size:14px;line-height:1.6;color:#806d83}

small,.muted{color:var(--muted)}

.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:13px}

.stat{padding:11px;text-align:center}

.stat span{display:block;font-size:11px;color:var(--muted)}

.stat strong{font-size:19px;color:#b75e91}

.kicker{font-size:10px;letter-spacing:2px;font-weight:850;color:#cb75a0;margin-bottom:8px}

.grid{display:grid;grid-template-columns:1fr;gap:10px}

.card{padding:14px}

.emoji{font-size:30px;margin-bottom:6px}

.btn{

 display:block;width:100%;text-align:left;padding:13px;

 margin:6px 0;border-radius:13px;border:1px solid #edd5e6;

 background:#fff7fb;color:var(--ink);font-weight:700;

}

.btn:active{transform:scale(.99)}

.btn:hover{background:#ffedf6;border-color:#e6a1c2}

.btn.primary{background:linear-gradient(100deg,#efb2d0,#e1cdfd);border:0;color:#583c61}

.btn:disabled{opacity:.45;cursor:not-allowed}

.desc{display:block;font-size:12px;font-weight:400;color:#987f99;margin-top:4px}

.pills{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}

.pill{background:#fff0f7;padding:5px 9px;border-radius:20px;font-size:11px;color:#a35f89}

.bar{height:8px;background:#f3e5ef;border-radius:8px;overflow:hidden;margin:7px 0 12px}

.bar div{height:100%;background:linear-gradient(90deg,#f1a5c7,#c8b5f7);width:50%;transition:width .2s}

.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px}

.tab{border:1px solid var(--line);border-radius:12px;padding:11px 3px;background:#fff;color:#967d99;font-size:12px}

.tab.active{background:#f9e4f0;border-color:#e9a6c7;color:#a44e80;font-weight:800}

.hidden{display:none!important}

.notice{padding:12px;background:#fff2f8;border:1px solid #f3d6e7;border-radius:13px;font-size:13px;line-height:1.6;margin:10px 0}

.logline{padding:9px 0;border-bottom:1px solid #f5e5ef;font-size:12px;line-height:1.5}

.logline:last-child{border:0}

.footer{text-align:center;font-size:11px;color:#b49ab1;padding:20px}

@media(min-width:620px){

 .stats{grid-template-columns:repeat(4,1fr)}

 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}

 .panel{padding:22px}

}

</style>

</head>

<body>

<header class="top">

 <div class="logo">STARRY DAYS ๐ŸŽ€</div>

 <div class="subtitle">YOUR SCHOOL โ€ข YOUR STORY โ€ข YOUR STARS</div>

</header>

<main class="wrap">

<section id="intro" class="panel">

 <div class="emoji">๐ŸŒทโœจ๐Ÿ“š</div>

 <div class="kicker">A BRAND-NEW SCHOOL YEAR</div>

 <h1>Welcome to Moonberry High!</h1>

 <p>New classmates, cute outfits, secret crushes, friendship drama, and exams. Your story begins on the first day of school.</p>

 <p>You can become the school's star student, the most loved friend, a fashion icon, or someone who discovers that being yourself is the best ending of all.</p>

 <h3>First, what should we call you?</h3>

 <input id="playername" maxlength="16" placeholder="Your nickname..." style="width:100%;padding:13px;border:1px solid #edcddd;border-radius:12px;font:inherit;background:white">

 <h3 style="margin-top:16px">Choose your school vibe</h3>

 <div class="grid">

  <button class="btn" onclick="chooseStyle('๐ŸŽ€','Soft pink')">๐ŸŽ€ Soft pink<span class="desc">Bows, blush, and ribbons</span></button>

  <button class="btn" onclick="chooseStyle('๐ŸŒ™','Lavender dream')">๐ŸŒ™ Lavender dream<span class="desc">Moonlight and dreamy vibes</span></button>

  <button class="btn" onclick="chooseStyle('๐ŸŒผ','Sunny yellow')">๐ŸŒผ Sunny yellow<span class="desc">Sunshine and happy days</span></button>

  <button class="btn" onclick="chooseStyle('๐Ÿ–ค','Cool and mysterious')">๐Ÿ–ค Cool and mysterious<span class="desc">Quiet confidence and secrets</span></button>

 </div>

 <div id="chosen" class="notice">Choose your vibe to begin! ๐Ÿ’—</div>

 <button class="btn primary" onclick="startGame()">START MY SCHOOL STORY โ†’</button>

 <button class="btn" onclick="toggleHelp()">HOW TO PLAY?</button>

 <div id="help" class="hidden"><p>Play through 10 school days. Each action changes your friendship, grades, style, energy, or reputation. You can do three activities per day. Keep your energy up, study before exams, and choose the kind of person you want to be. Your decisions determine your ending!</p></div>

</section>

<section id="game" class="hidden">

 <div class="stats">

  <div class="stat"><span>๐Ÿ’— Friendship</span><strong id="friend">10</strong></div>

  <div class="stat"><span>๐Ÿ“š Grades</span><strong id="grades">50</strong></div>

  <div class="stat"><span>โœจ Style</span><strong id="style">10</strong></div>

  <div class="stat"><span>โšก Energy</span><strong id="energy">100</strong></div>

 </div>

 <div class="panel">

  <div class="kicker">YOUR SCHOOL DIARY</div>

  <div style="display:flex;justify-content:space-between;gap:8px;align-items:center">

   <h2 id="daytitle">Day 1: First Impressions</h2>

   <span class="pill" id="daycount">DAY 1/10</span>

  </div>

  <div class="pills"><span class="pill" id="look">๐ŸŽ€ Soft pink</span><span class="pill" id="coins">๐Ÿช™ 30 coins</span><span class="pill" id="club">No club yet</span></div>

  <div class="bar"><div id="daybar"></div></div>

  <p id="story"></p>

  <div class="notice" id="event"></div>

 </div>

 <div class="tabs">

  <button class="tab active" onclick="showTab('activities',this)">๐Ÿซ Activities</button>

  <button class="tab" onclick="showTab('friends',this)">๐Ÿ’Œ Friends</button>

  <button class="tab" onclick="showTab('closet',this)">๐Ÿ‘— Closet</button>

 </div>

 <section id="activities" class="panel page">

  <div class="kicker">MAKE TODAY COUNT</div>

  <h2>What will you do?</h2>

  <p id="actioncount">Actions left: 3</p>

  <div class="grid">

   <div class="card"><div class="emoji">๐Ÿ“–</div><h3>Study in the library</h3><p>Prepare for exams and improve your grades.</p><button class="btn" onclick="act('study')">Study โœจ<span class="desc">+12 grades, costs energy</span></button></div>

   <div class="card"><div class="emoji">๐Ÿฅ</div><h3>Visit the cafeteria</h3><p>Chat with classmates over a snack.</p><button class="btn" onclick="act('cafe')">Hang out<span class="desc">Friendship +8, energy +10</span></button></div>

   <div class="card"><div class="emoji">๐ŸŽจ</div><h3>Art room</h3><p>Paint, sketch, and discover your creative side.</p><button class="btn" onclick="act('art')">Make art<span class="desc">Style +6, friendship +3</span></button></div>

   <div class="card"><div class="emoji">๐Ÿƒโ€โ™€๏ธ</div><h3>Sports field</h3><p>Get moving and feel more confident.</p><button class="btn" onclick="act('sport')">Play sports<span class="desc">Energy -10, friendship +5</span></button></div>

   <div class="card"><div class="emoji">๐ŸŽค</div><h3>Music room</h3><p>Practice a song for the school festival.</p><button class="btn" onclick="act('music')">Practice singing<span class="desc">Style +5, friendship +4</span></button></div>

   <div class="card"><div class="emoji">๐Ÿช™</div><h3>Help a teacher</h3><p>Organize books and earn a few coins.</p><button class="btn" onclick="act('work')">Help out<span class="desc">Earn 12 coins, grades +3</span></button></div>

  </div>

  <hr style="border:0;border-top:1px solid #f2dce9;margin:16px 0">

  <button class="btn primary" onclick="nextDay()">FINISH THE DAY & SLEEP ๐ŸŒ™ โ†’</button>

 </section>

 <section id="friends" class="panel page hidden">

  <div class="kicker">YOUR PEOPLE</div>

  <h2>Friendship corner ๐Ÿ’Œ</h2>

  <p>Everyone has a story. Be kind, be curious, and see who becomes part of yours.</p>

  <div class="grid" id="friendcards"></div>

  <hr style="border:0;border-top:1px solid #f2dce9;margin:16px 0">

  <h3>Join a school club</h3>

  <p>Joining a club costs 5 coins. You can join only one.</p>

  <button class="btn" onclick="joinClub('Art Club')">๐ŸŽจ Art Club<span class="desc">Creativity and new friends</span></button>

  <button class="btn" onclick="joinClub('Book Club')">๐Ÿ“š Book Club<span class="desc">Reading and academic confidence</span></button>

  <button class="btn" onclick="joinClub('Music Club')">๐ŸŽค Music Club<span class="desc">Performance and confidence</span></button>

 </section>

 <section id="closet" class="panel page hidden">

  <div class="kicker">YOUR PERSONAL STYLE</div>

  <h2>The Moonberry Closet ๐Ÿ‘—</h2>

  <p>Choose a look that feels like you. You earn style points from activities and can buy extra looks with coins.</p>

  <div class="notice">๐Ÿช™ Coins: <b id="closetcoins">30</b></div>

  <div class="grid" id="outfits"></div>

 </section>

 <section class="panel">

  <div style="display:flex;justify-content:space-between;gap:10px;align-items:center">

   <h2>๐Ÿ“” Your diary</h2>

   <button class="tab" onclick="saveGame()">Save ๐Ÿ’พ</button>

  </div>

  <div id="diary"></div>

  <button class="btn" onclick="loadGame()">Load saved game</button>

 </section>

</section>

<section id="ending" class="panel hidden">

 <div class="emoji" id="endemoji" style="font-size:50px">๐ŸŒŸ</div>

 <div class="kicker">MOONBERRY HIGH โ€ข YEARBOOK</div>

 <h1 id="endtitle">Your story</h1>

 <p id="endtext"></p>

 <div class="notice" id="report"></div>

 <h2>Your yearbook memories ๐Ÿ’—</h2>

 <div id="memories"></div>

 <button class="btn primary" onclick="restart()">PLAY A NEW STORY โ†ป</button>

 <button class="btn" onclick="loadGame()">LOAD SAVED STORY</button>

</section>

<div class="footer">Made with โ™ก โ€ข STARRY DAYS โ€ข YOUR STORY MATTERS</div>

</main>

<script>

const $=id=>document.getElementById(id);

let G=null;

const outfits=[

 {id:'uniform',name:'Classic uniform',emoji:'๐ŸŽ€',cost:0,desc:'The timeless school look.'},

 {id:'pastel',name:'Pastel princess',emoji:'๐Ÿฉท',cost:8,desc:'Soft pink, cute bows, sweet vibes.'},

 {id:'lavender',name:'Lavender dream',emoji:'๐Ÿ’œ',cost:8,desc:'Dreamy and gentle.'},

 {id:'sunshine',name:'Sunny day',emoji:'๐ŸŒผ',cost:8,desc:'Bright, happy, and cheerful.'},

 {id:'midnight',name:'Midnight star',emoji:'๐ŸŒ™',cost:12,desc:'Mysterious and elegant.'},

 {id:'fairy',name:'Fairycore',emoji:'๐Ÿงšโ€โ™€๏ธ',cost:15,desc:'A little magic in every detail.'}

];

const people=[

 {id:'hana',name:'Hana',emoji:'๐ŸŒธ',role:'The sweet new girl',desc:'Loves cute stationery and always saves you a seat.',base:'You notice Hana sitting alone near the window.'},

 {id:'yuna',name:'Yuna',emoji:'๐ŸŽง',role:'The music lover',desc:'Quiet at first, but knows every song ever written.',base:'Yuna is humming a song outside the music room.'},

 {id:'leo',name:'Leo',emoji:'โšฝ',role:'The friendly athlete',desc:'Always cheering for classmates and sharing snacks.',base:'Leo waves from the school courtyard.'},

 {id:'mika',name:'Mika',emoji:'๐Ÿฆ‹',role:'The mysterious artist',desc:'Keeps a sketchbook full of beautiful drawings.',base:'You spot Mika drawing stars in the corner of the art room.'}

];

function fresh(){

 return {name:'Star',vibe:'Soft pink',vibeEmoji:'๐ŸŽ€',friend:10,grades:50,style:10,energy:100,coins:30,day:1,actions:3,club:'No club yet',outfit:'uniform',owned:['uniform'],bonds:{hana:0,yuna:0,leo:0,mika:0},talked:{},events:[],memories:[],ended:false,flags:{},logs:[]};

}

function chooseStyle(e,n){

 document.querySelectorAll('#intro .grid .btn').forEach(b=>b.style.borderColor='#edd5e6');

 event.currentTarget.style.borderColor='#d879a5';

 if(!G)G=fresh();

 G.vibe=n;G.vibeEmoji=e;

 $('chosen').textContent=e+' Your vibe: '+n+'. Perfect!';

}

function toggleHelp(){$('help').classList.toggle('hidden')}

function startGame(){

 if(!G)G=fresh();

 G.name=$('playername').value.trim().slice(0,16)||'Star';

 $('intro').classList.add('hidden');$('game').classList.remove('hidden');

 diary("Your first school year begins. You picked "+G.vibe+" as your vibe.");

 dayStory();render();

}

function diary(s){if(!G)return;G.logs.unshift(s);G.logs=G.logs.slice(0,18);drawDiary();}

function drawDiary(){$('diary').innerHTML=G.logs.map(s=>'<div class="logline">๐ŸŒท '+esc(s)+'</div>').join('')}

function esc(s){return String(s).replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]))}

function clamp(){['friend','grades','style','energy'].forEach(k=>G[k]=Math.max(0,Math.min(100,G[k])));G.coins=Math.max(0,G.coins)}

function change(k,n){G[k]+=n;clamp()}

function showTab(id,el){

 document.querySelectorAll('.page').forEach(x=>x.classList.add('hidden'));

 $(id).classList.remove('hidden');

 document.querySelectorAll('.tab').forEach(x=>x.classList.remove('active'));

 el.classList.add('active');

}

function dayStory(){

 const titles=[

 'First Impressions','The Cafeteria Mystery','A Little Friendship Drama',

 'Midterm Countdown','The Club Fair','The Rumor',

 'A Rainy School Day','The Talent Show','Final Exam Week','The Last Bell'

 ];

 const stories=[

 'Your shoes squeak against the shiny hallway floor. New lockers, new faces, and a whole new beginning. What kind of person will you be?',

 'Someone has left a tiny envelope on the cafeteria table. Inside is a note: โ€œMake one person smile today.โ€',

 'Two classmates disagree over a group project. You can help them understand each otherโ€”or stay out of it.',

 'Midterms are approaching. Your friends are nervous, and the library is full of students reviewing their notes.',

 'The club fair fills the courtyard with colorful posters, music, and handmade decorations.',

 'A rumor is spreading about the upcoming school festival. You can ask questions kindly instead of jumping to conclusions.',

 'Rain taps against the windows. Everyone seems sleepy, and the school feels strangely peaceful.',

 'The talent show is almost here! Your friends are preparing music, art, and performances.',

 'Final exams begin soon. A little preparation now can make a big difference.',

 'It is the final day of the school year. Look aroundโ€”these ordinary moments became your memories.'

 ];

 $('daytitle').textContent='Day '+G.day+': '+titles[G.day-1];

 $('story').textContent=stories[G.day-1];

 $('daycount').textContent='DAY '+G.day+'/10';

 $('daybar').style.width=(G.day*10)+'%';

 const ev=[

 '๐Ÿ’Œ A classmate compliments your stationery. You feel a little more confident.',

 '๐Ÿ“ The cafeteria is serving strawberry milk today. Small joys count!',

 '๐Ÿฆ‹ You hear that someone needs a partner for a project.',

 '๐Ÿ“š A surprise quiz is coming soon. Studying could help!',

 '๐ŸŽจ The art club is displaying student work in the courtyard.',

 '๐ŸŒง๏ธ Someone looks upset after hearing gossip. Kindness matters.',

 'โ˜‚๏ธ You share an umbrella with a classmate on the way to class.',

 '๐ŸŽค The talent show sign-up sheet is almost full.',

 'โญ Your teacher reminds everyone that effort matters more than perfection.',

 '๐ŸŒท Your class is preparing a memory wall for the last day.'

 ];

 $('event').textContent=ev[G.day-1];

}

function spendAction(){if(G.actions<=0){diary("You're out of activities for today. Get some rest!");render();return false;}G.actions--;return true}

function act(a){

 if(!G||G.ended||G.actions<=0)return;

 if(!spendAction())return;

 switch(a){

 case 'study':

  if(G.energy<8){G.actions++;diary("You're too tired to focus. Try resting or getting a snack.");break}

  change('energy',-8);change('grades',12);diary("You studied carefully in the library. Your future self says thank you.");break;

 case 'cafe':

  change('friend',8);change('energy',10);G.coins=Math.max(0,G.coins-2);diary("You spent a lovely break chatting with classmates. Friendship grew.");break;

 case 'art':

  change('style',6);change('friend',3);change('energy',-5);diary("You created something beautiful in the art room.");break;

 case 'sport':

  if(G.energy<10){G.actions++;diary("You need more energy before playing sports.");break}

  change('energy',-10);change('friend',5);diary("You played a game with classmates and cheered each other on.");break;

 case 'music':

  change('style',5);change('friend',4);change('energy',-4);diary("You practiced your favorite song. Someone nearby started singing along.");break;

 case 'work':

  G.coins+=12;change('grades',3);change('energy',-5);diary("You helped your teacher organize the classroom and earned 12 coins.");break;

 }

 render();

}

function talk(id){

 if(G.actions<=0){diary("You need another day to have more conversations.");render();return}

 if(G.talked[G.day+'-'+id]){diary("You already had a chat with this friend today.");return}

 G.actions--;G.talked[G.day+'-'+id]=true;

 const p=people.find(x=>x.id===id);

 let before=G.bonds[id];

 let choice=Math.random();

 let msg;

 if(choice<.33){msg="You ask how their day is going and listen carefully."}

 else if(choice<.66){msg="You share a funny school story and laugh together."}

 else{msg="You compliment something they worked hard on."}

 G.bonds[id]+=10;change('friend',5);change('energy',-2);

 if(G.bonds[id]>=20&&!G.memories.includes(p.name+' became a close friend'))G.memories.push(p.name+' became a close friend');

 diary("You talked with "+p.name+". "+msg+" Your friendship grows.");

 render();renderFriends();

}

function renderFriends(){

 $('friendcards').innerHTML=people.map(p=>{

 let n=G.bonds[p.id];

 return '<div class="card"><div class="emoji">'+p.emoji+'</div><h3>'+p.name+'</h3><span class="pill">'+p.role+'</span><p>'+p.desc+'</p><p>Friendship: '+n+'/100</p><div class="bar"><div style="width:'+n+'%"></div></div><button class="btn" '+(G.actions<=0||G.talked[G.day+'-'+p.id]?'disabled':'')+' onclick="talk(\''+p.id+'\')">'+(G.talked[G.day+'-'+p.id]?'Chatted today โœ“':'Talk & become friends ๐Ÿ’Œ')+'</button></div>';

 }).join('');

}

function joinClub(name){

 if(G.club!=='No club yet'){diary("You're already part of "+G.club+". Enjoy your club!");return}

 if(G.coins<5){diary("You need 5 coins to join a club. Help a teacher to earn more.");return}

 G.coins-=5;G.club=name;change('friend',5);

 if(name==='Book Club')change('grades',5);

 if(name==='Art Club')change('style',5);

 if(name==='Music Club')change('style',3);

 G.memories.push('Joined '+name);

 diary("You joined "+name+"! You found a place where you belong.");

 render();

}

function buy(id){

 const o=outfits.find(x=>x.id===id);

 if(G.owned.includes(id)){G.outfit=id;diary("You changed into "+o.name+". Confidence looks good on you.");render();return}

 if(G.coins<o.cost){diary("Not enough coins for that outfit yet. Help a teacher to earn more.");return}

 G.coins-=o.cost;G.owned.push(id);G.outfit=id;change('style',5);

 diary("You bought "+o.name+" and added it to your closet!");

 render();

}

function renderOutfits(){

 $('outfits').innerHTML=outfits.map(o=>{

 const owned=G.owned.includes(o.id);

 return '<div class="card"><div class="emoji">'+o.emoji+'</div><h3>'+o.name+'</h3><p>'+o.desc+'</p><button class="btn" onclick="buy(\''+o.id+'\')">'+(G.outfit===o.id?'โœ“ Wearing':owned?'Wear outfit':'Buy โ€ข '+o.cost+' coins')+'</button></div>';

 }).join('');

}

function nextDay(){

 if(!G||G.ended)return;

 G.day++;

 if(G.day>10){finish();return}

 G.actions=3;change('energy',22);

 if(G.club!=='No club yet')change('friend',2);

 if(G.day===4)diary("Midterms are getting closer. Remember to balance fun with study.");

 if(G.day===6)diary("A classmate tells you that kindness can stop a rumor before it grows.");

 if(G.day===9)diary("Tomorrow is the last day! Your choices have shaped your year.");

 dayStory();render();

 document.querySelectorAll('.page').forEach(x=>x.classList.add('hidden'));

 $('activities').classList.remove('hidden');

 document.querySelectorAll('.tabs .tab').forEach((b,i)=>b.classList.toggle('active',i===0));

 window.scrollTo({top:0,behavior:'smooth'});

}

function render(){

 if(!G)return;clamp();

 $('friend').textContent=G.friend;$('grades').textContent=G.grades;

 $('style').textContent=G.style;$('energy').textContent=G.energy;

 $('look').textContent=G.vibeEmoji+' '+G.vibe;

 $('coins').textContent='๐Ÿช™ '+G.coins+' coins';

 $('club').textContent=G.club;$('closetcoins').textContent=G.coins;

 $('actioncount').textContent='Actions left: '+G.actions;

 renderFriends();renderOutfits();drawDiary();

}

function saveGame(){

 try{localStorage.setItem('starryDaysSave',JSON.stringify(G));diary("Your school story has been saved on this device.");}

 catch(e){alert("Saving isn't available in this browser. Keep this tab open!")}

}

function loadGame(){

 try{

  const raw=localStorage.getItem('starryDaysSave');

  if(!raw){alert("No saved game found yet.");return}

  const data=JSON.parse(raw);

  if(!data||typeof data.day!=='number'||!data.bonds)throw Error();

  G=data;$('intro').classList.add('hidden');$('ending').classList.add('hidden');$('game').classList.remove('hidden');

  if(G.ended){finish();return}

  dayStory();render();diary("Welcome back, "+G.name+"! Your story continues.");

 }catch(e){alert("Couldn't load the saved game.")}

}

function finish(){

 G.ended=true;clamp();

 $('game').classList.add('hidden');$('ending').classList.remove('hidden');

 let title,emoji,text;

 const bestFriend=Math.max(...Object.values(G.bonds));

 if(G.grades>=85&&G.friend>=55){

  title='Moonberryโ€™s Star Student';emoji='๐Ÿ†';

  text='Your hard work paid off! You finished the year with amazing grades and strong friendships. Teachers admire your dedication, and classmates remember your kindness. You proved that success and friendship can shine together.';

 }else if(G.friend>=70){

  title='The Heart of Moonberry';emoji='๐Ÿ’—';

  text='Your greatest achievement was the people you met. You listened, laughed, helped classmates, and made school feel warmer. Your yearbook is full of messages from friends who are glad you came into their lives.';

 }else if(G.style>=70){

  title='Moonberry Fashion Icon';emoji='๐Ÿ‘‘';

  text='Your style became legendary! From your signature outfits to your creative personality, you showed everyone that fashion can be a form of self-expression. The school festival looks like a runway whenever you walk by.';

 }else if(G.grades>=70){

  title='The Academic Dream';emoji='๐Ÿ“š';

  text='Your effort turned into progress. You learned to keep going even when school got difficult. You may not have had a perfect year, but your determination became your superpower.';

 }else if(G.friend>=40){

  title='A Year of New Beginnings';emoji='๐ŸŒท';

  text='Your school year was full of small victories, new faces, and lessons about yourself. You discovered that life is not a competition. Every day gave you another chance to grow.';

 }else{

  title='The Quiet Dreamer';emoji='๐ŸŒ™';

  text='You kept your own rhythm through the school year. You learned that it is okay to be quiet, take your time, and discover what matters to you. Next year is another chance to open a new chapter.';

 }

 $('endemoji').textContent=emoji;$('endtitle').textContent=title;$('endtext').textContent=text;

 $('report').innerHTML='<b>YOUR FINAL YEARBOOK STATS</b><br><br>๐Ÿ’Œ Friendship: '+G.friend+'/100<br>๐Ÿ“š Grades: '+G.grades+'/100<br>โœจ Style: '+G.style+'/100<br>โšก Energy: '+G.energy+'/100<br>๐Ÿช™ Coins: '+G.coins+'<br>๐Ÿ‘— Outfits owned: '+G.owned.length+'<br>๐Ÿซ Club: '+esc(G.club);

 const memories=G.memories.length?G.memories.map(x=>'<div class="logline">๐ŸŒธ '+esc(x)+'</div>').join(''):'<p>You made your own memories along the way. Every little moment counts.</p>';

 $('memories').innerHTML=memories;

 window.scrollTo({top:0,behavior:'smooth'});

}

function restart(){

 if(!confirm("Start a brand-new school year? Your current unsaved story will be replaced."))return;

 G=fresh();$('ending').classList.add('hidden');$('game').classList.add('hidden');$('intro').classList.remove('hidden');

 $('playername').value='';$('chosen').textContent='Choose your vibe to begin! ๐Ÿ’—';

}

</script>

</body>

</html>

Game Source: STARRY DAYS

Creator: BlazingTurtle39

Libraries: none

Complexity: complex (819 lines, 24.3 KB)

The full source code is displayed above on this page.

Remix Instructions

To remix this game, copy the source code above and modify it. Add a ARCADELAB header at the top with "remix_of: starry-days-blazingturtle39" to link back to the original. Then publish at arcadelab.ai/publish.