:root{
  --bg-1:#1b2340;
  --bg-2:#0f1428;
  --cheese:#ffc93c;
  --cheese-dark:#e8960f;
  --rat-pink:#ff8fab;
  --cream:#fdf6e9;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;font-family:'Nunito',sans-serif;background:var(--bg-2);color:var(--cream);}
body{min-height:100vh;}
#app{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 15%, var(--bg-1), var(--bg-2) 78%);}
.page-shell{width:min(420px,calc(100% - 40px));text-align:center;padding:24px;}
.title-en{font-family:'Baloo 2',sans-serif;font-size:12px;font-weight:700;letter-spacing:6px;text-transform:uppercase;color:var(--rat-pink);margin:0 0 10px;}
.title-jp{font-family:'Baloo 2',sans-serif;font-size:42px;font-weight:800;color:var(--cheese);line-height:1.1;margin:0;}
.desc{margin:18px auto 26px;max-width:320px;color:var(--cream);opacity:0.8;font-size:15px;line-height:1.75;}
.buttons{display:grid;gap:16px;}
.btn{font-family:'Baloo 2',sans-serif;font-size:18px;font-weight:700;color:#2a1e00;background:linear-gradient(180deg,#ffe08a,var(--cheese) 58%,var(--cheese-dark));border:none;border-radius:16px;padding:16px 36px;box-shadow:0 6px 0 #a8630a,0 10px 20px rgba(0,0,0,0.25);text-decoration:none;display:inline-flex;justify-content:center;align-items:center;cursor:pointer;transition:transform .08s ease,opacity .2s ease;}
.btn:hover{opacity:0.95;}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #a8630a,0 6px 10px rgba(0,0,0,0.2);}
.footer{margin-top:24px;color:var(--cream);opacity:0.78;font-size:13px;}
body.ready .page-shell{opacity:1;transform:none;}
.page-shell{opacity:0;transform:translateY(18px);transition:opacity .35s ease,transform .35s ease;}