@import "https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&display=swap";html,body,#root{min-height:100%}:root{font-family:Zen Maru Gothic,Hiragino Maru Gothic ProN,"Rounded M+ 1c",sans-serif;line-height:1.4}*{box-sizing:border-box}body{color:#4a3b32;background:linear-gradient(#d4f0fd 0%,#e0f2fe 30%,#fdfbf7 100%);min-height:100vh;margin:0;position:relative}body:before{content:"★";color:#a7d0e3;opacity:.6;z-index:-1;text-shadow:50vw 10vh #a7d0e3,80vw 5vh #b0c4de,20vw 30vh #b0c4de,70vw 40vh #a7d0e3;font-size:24px;position:absolute;top:5%;left:10%}body:after{content:"✦";color:#d1d5db;opacity:.7;z-index:-1;text-shadow:-40vw 15vh #e2e8f0,-70vw 25vh #e2e8f0,-20vw 50vh #cbd5e1;font-size:16px;position:absolute;top:15%;left:85%}.app{justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}.container{width:100%;max-width:340px}.game-header{justify-content:space-between;align-items:flex-end;margin-bottom:12px;display:flex}.game-header h1{color:#0284c7;text-shadow:1px 1px #fff,0 0 5px #fffc;margin:0;font-size:24px;font-weight:900}.subtitle{color:#64748b;margin:0;font-size:12px;font-weight:700}.score-area{text-align:right;background:#ffffffb3;border-radius:12px;padding:4px 12px;box-shadow:0 2px 4px #0000000d}.score-area span{color:#64748b;font-size:12px;font-weight:700;display:block}.score-area strong{color:#f59e0b;text-shadow:1px 1px #fff;font-size:32px;font-weight:900;line-height:1}.message-banner{text-align:center;color:#ec4899;opacity:0;text-shadow:1px 1px #fff;min-height:24px;margin-bottom:8px;font-size:16px;font-weight:900;transition:opacity .2s}.message-banner.visible{opacity:1}.board-container{margin:0 auto;position:relative}.board-wrapper{background:#fff6;border:3px solid #bae6fd;border-radius:16px;padding:4px;box-shadow:0 4px 12px #0000000d}.ceiling{border-top:4px dashed #7dd3fc;border-radius:2px;margin-bottom:4px}.board{background:0 0;grid-template-columns:repeat(5,1fr);gap:3px;display:grid}.cell{aspect-ratio:1;color:#4a3b32;cursor:pointer;background:#f1f5f9;border:1px solid #0000001a;border-bottom-width:3px;border-radius:8px;width:100%;padding:0;font-size:clamp(22px,6vw,28px);font-weight:900;box-shadow:0 2px #0000000d}.cell-color-blue{background:#bae6fd}.cell-color-green{background:#bbf7d0}.cell-color-yellow{background:#fef08a}.cell-color-pink{background:#fbcfe8}.cell-color-orange{background:#fed7aa}.cell:disabled{cursor:default}.hand{grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px;display:grid}.hand-card{aspect-ratio:1;color:#4a3b32;cursor:pointer;background:#f8fafc;border:2px solid #0000000d;border-bottom-width:4px;border-radius:12px;font-size:28px;font-weight:900;transition:transform .1s;box-shadow:0 4px 6px #0000000d}.hand-card:active{border-bottom-width:2px;transform:translateY(2px)}.hand-card.selected{background-clip:padding-box;border:3px solid #0000;position:relative}.hand-card.selected:before{content:"";z-index:-1;background:linear-gradient(45deg,#ff9a9e,#fecfef,#a1c4fd,#c2e9fb,#ff9a9e);border-radius:14px;animation:2s linear infinite rainbowGlow;position:absolute;inset:-3px}.hand-card:disabled{opacity:.6;cursor:default;transform:none}.help-text{text-align:center;color:#64748b;margin-top:18px;font-size:14px;font-weight:700}.game-over-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;background:#ffffffd9;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:absolute;inset:0;box-shadow:inset 0 0 20px #0000000d}.game-over-overlay p{color:#f43f5e;letter-spacing:.05em;text-shadow:2px 2px #fff;margin:0;font-size:30px;font-weight:900}.game-over-overlay button{color:#fff;cursor:pointer;background:#38bdf8;border:none;border-radius:20px;padding:12px 24px;font-size:18px;font-weight:900;box-shadow:0 4px #0284c7}.game-over-overlay button:active{transform:translateY(4px);box-shadow:0 0 #0284c7}.title-screen{text-align:center;flex-direction:column;align-items:center;gap:24px;padding:40px 0;display:flex}.title-screen h1{color:#0284c7;text-shadow:2px 2px #fff,0 0 10px #fffc;margin:0;font-size:36px;font-weight:900}.title-screen .subtitle{color:#64748b;margin-top:-16px;font-size:16px}.menu-buttons{flex-direction:column;gap:16px;width:100%;max-width:240px;display:flex}.menu-btn{color:#fff;cursor:pointer;background:#38bdf8;border:none;border-radius:20px;padding:16px 24px;font-size:18px;font-weight:900;transition:transform .1s,box-shadow .1s;box-shadow:0 4px #0284c7}.menu-btn:hover{background:#7dd3fc}.menu-btn:active{transform:translateY(4px);box-shadow:0 0 #0284c7}.menu-btn.panepon-btn{background:#34d399;box-shadow:0 4px #059669}.menu-btn.panepon-btn:hover{background:#6ee7b7}.menu-btn.panepon-btn:active{transform:translateY(4px);box-shadow:0 0 #059669}.license-section{width:100%;margin-top:32px}.license-toggle-btn{color:#64748b;cursor:pointer;background:0 0;border:2px dashed #cbd5e1;border-radius:12px;padding:8px 16px;font-size:12px;font-weight:700}.bgm-control{justify-content:flex-end;margin-bottom:10px;display:flex}.bgm-toggle-btn{min-width:110px}.license-content{color:#475569;text-align:left;background:#fff9;border-radius:12px;max-height:320px;margin-top:12px;padding:12px;font-size:12px;overflow:auto}.license-legal-text{white-space:pre-wrap;color:#cbd5e1;margin:8px 0 12px;line-height:1.35}.cell.active{z-index:10;transition:transform .1s;position:relative;transform:scale(1.05)}.cell.active:after{content:"";z-index:-1;background:linear-gradient(90deg,#ff9a9e,#fecfef,#a1c4fd,#c2e9fb,#ff9a9e);border-radius:10px;animation:1.5s linear infinite rainbowGlow;position:absolute;inset:-4px;box-shadow:0 0 10px #ff9a9e80}.cell.matched{color:#d97706;pointer-events:none;border-color:#fcd34d;animation:.8s infinite sparkle-pulse;box-shadow:0 0 15px 5px #fde68acc;background:#fef08a!important}.cell-empty{aspect-ratio:1;background:0 0;width:100%}@keyframes rainbowGlow{0%{background-position:0%}to{background-position:200%}}@keyframes sparkle-pulse{0%{transform:scale(1);box-shadow:0 0 5px #fde68a80}50%{transform:scale(1.05);box-shadow:0 0 20px 8px #fde68a}to{transform:scale(1);box-shadow:0 0 5px #fde68a80}}.cell-trail{pointer-events:none;aspect-ratio:1;z-index:5;background:#fff9;border-radius:8px;width:100%;animation:.5s ease-out forwards trailFade;box-shadow:inset 0 0 0 2px #ffffffe6}@keyframes trailFade{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.word-history{background:#fff9;border:2px solid #bae6fd;border-radius:12px;flex-wrap:wrap;gap:6px;min-height:32px;margin-bottom:12px;padding:6px 10px;display:flex}.word-history-item{color:#0284c7;white-space:nowrap;background:#e0f2fe;border:1px solid #bae6fd;border-radius:16px;padding:2px 10px;font-size:14px;font-weight:900;box-shadow:0 1px 2px #0000000d}.word-history-empty{color:#94a3b8;align-self:center;font-size:14px;font-weight:700}.match-effect-char{text-align:center;color:#d97706;will-change:transform, opacity;background:#fef08a;border:2px solid #fcd34d;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;font-size:26px;font-weight:900;display:flex;box-shadow:0 4px 10px #fde68acc}