:root{--color-background: #f0f8ff;--color-primary: #ffc0cb;--color-secondary: #fdfd96;--color-accent: #c1e1c1;--color-text-main: #333333;--color-text-secondary: #5f5f5f;--font-family-main: "M PLUS Rounded 1c", "Kosugi Maru", sans-serif;--border-radius: 16px;--box-shadow: 0 4px 12px #0000001a}body{margin:0;font-family:var(--font-family-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-background);background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><filter id="f"><feTurbulence type="fractalNoise" baseFrequency="0.65" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23f)" opacity="0.03"/></svg>');color:var(--color-text-main);line-height:1.6}*,*:before,*:after{box-sizing:border-box}#root{width:100%}.app-container{width:100%;min-height:100vh}.home-page{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100%;background:linear-gradient(135deg,var(--color-background),#e6f7ff);position:relative;overflow:hidden;padding:2rem}.home-content{text-align:center;z-index:2;background-color:#ffffffb3;padding:3rem 4rem;border-radius:24px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:3px solid white;box-shadow:var(--box-shadow)}.home-title{font-size:3rem;font-weight:800;color:var(--color-text-main);margin:0;margin-bottom:1rem}.home-character{margin:1.5rem 0;animation:float 4s ease-in-out infinite;filter:drop-shadow(5px 8px 8px rgba(0,0,0,.2))}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.start-button{font-family:var(--font-family-main);font-size:1.5rem;font-weight:700;padding:1rem 3rem;border-radius:16px;border:3px solid var(--color-text-main);background-color:var(--color-primary);color:var(--color-text-main);cursor:pointer;transition:all .2s ease}.start-button:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 15px #00000026}.shape{position:absolute;border-radius:50%;background-color:var(--color-secondary);opacity:.5;z-index:1;animation:move 20s infinite alternate ease-in-out}.shape-1{width:200px;height:200px;top:10%;left:10%;animation-delay:0s}.shape-2{width:150px;height:150px;bottom:15%;right:5%;background-color:var(--color-accent);animation-delay:-5s}.shape-3{width:100px;height:100px;top:60%;left:15%;background-color:var(--color-primary);animation-delay:-10s}@keyframes move{0%{transform:translate(0) rotate(0)}to{transform:translate(100px,50px) rotate(90deg)}}.grade-selector-container{background-color:#fff;padding:1.5rem 2rem;border-radius:var(--border-radius);box-shadow:var(--box-shadow);text-align:center;margin-bottom:2rem}.grade-selector-container label{display:block;margin-bottom:1rem;font-size:1.1rem;font-weight:700;color:var(--color-text-main)}.grade-select{width:100%;padding:.8rem 1rem;font-family:var(--font-family-main);font-size:1rem;border-radius:12px;border:2px solid var(--color-primary);background-color:#fff;cursor:pointer;appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2216%22%20height%3D%2210%22%20viewBox%3D%220%200%2016%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M2%202L8%208L14%202%22%20stroke%3D%22%23333333%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 1rem center;background-size:1em}.grade-select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #98e29880}.word-card{background-color:#fff;border-radius:var(--border-radius);box-shadow:var(--box-shadow);padding:2rem;display:flex;flex-direction:column;align-items:center;text-align:center;border:3px solid var(--color-text-main);position:relative}.word-card:before{content:"★";position:absolute;top:1rem;left:1rem;font-size:1.5rem;color:var(--color-secondary);transform:rotate(-15deg)}.word-card-emoji{font-size:5rem;line-height:1;margin-bottom:1rem;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.word-card-main{margin-bottom:1rem}.word-card-word{font-size:2.8rem;font-weight:800;color:var(--color-text-main);margin:0}.word-card-phonetic{font-size:1.2rem;color:var(--color-text-secondary);margin:.2rem 0}.word-card-translation{font-size:1.5rem;font-weight:700;color:var(--color-primary);margin-bottom:1.5rem;background-color:var(--color-secondary);padding:.2rem .8rem;border-radius:8px;display:inline-block}.word-card-sentences{text-align:left;width:100%;border-top:2px dashed var(--color-accent);padding-top:1.5rem}.word-card-sentences h3{margin:0 0 1rem;font-size:1.1rem;color:var(--color-text-secondary);font-weight:700}.word-card-sentences ul{margin:0;padding-left:1.5rem;list-style-type:"🌱"}.word-card-sentences li{padding-left:.5rem;margin-bottom:.8rem;font-size:1rem}.word-card-derived{text-align:left;width:100%;border-top:2px dashed var(--color-primary);padding-top:1.5rem;margin-top:1.5rem}.word-card-derived h3{margin:0 0 1rem;font-size:1.1rem;color:var(--color-text-secondary);font-weight:700}.word-card-derived ul{margin:0;padding-left:1.5rem;list-style-type:"✨"}.word-card-derived li{padding-left:.5rem;margin-bottom:1rem;font-size:1rem}.derived-note{color:var(--color-primary);font-weight:700;margin-left:.5rem}.modal-overlay{position:fixed;inset:0;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:#fff;padding:2rem 3rem;border-radius:var(--border-radius);box-shadow:0 10px 25px #0003;display:flex;flex-direction:column;align-items:center;text-align:center;border:4px solid var(--color-primary);animation:modal-pop .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes modal-pop{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.usagi-character{margin-bottom:1rem;transform:rotate(-5deg);animation:wiggle 2s infinite;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.2))}@keyframes wiggle{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.modal-text{font-size:2.5rem;font-weight:800;color:var(--color-primary);margin:0 0 1.5rem}.modal-close-button{font-family:var(--font-family-main);font-size:1rem;font-weight:700;padding:.8rem 2rem;border-radius:12px;border:2px solid var(--color-text-main);background-color:var(--color-secondary);color:var(--color-text-main);cursor:pointer;transition:all .2s ease}.modal-close-button:hover{transform:translateY(-2px);box-shadow:var(--box-shadow)}.learning-page{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;padding:2rem;box-sizing:border-box}.header{margin-bottom:2rem;text-align:center}.header h1{font-size:2.5rem;font-weight:800;color:var(--color-text-main);margin:0}.header p{font-size:1.1rem;color:var(--color-text-secondary);margin-top:.5rem}.content{width:100%;max-width:500px}.navigation-buttons{display:flex;justify-content:space-between;margin-top:1.5rem}.navigation-buttons button{font-family:var(--font-family-main);font-size:1rem;font-weight:700;padding:.8rem 1.5rem;border-radius:12px;border:2px solid var(--color-text-main);background-color:var(--color-secondary);color:var(--color-text-main);cursor:pointer;transition:all .2s ease}.navigation-buttons button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.navigation-buttons .back-button{background-color:#fff;border-color:var(--color-accent)}