@import"https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&family=Noto+Sans+JP:wght@400;500;700&display=swap";:root{--pink: #f5a8c8;--purple: #c4a7f5;--pale-blue: #9dd4f0;--mint: #b8e6d8;--peach: #ffc9a8;--gold: #e8c872;--coral: #ffb5a0;--lavender: #e8d5ff;--cream: #fffaf7;--text: #3d3545;--text-soft: #7a6b85;--shadow: rgba(196, 167, 245, .28);--radius: 28px;--radius-sm: 20px;--font: "Zen Maru Gothic", "Noto Sans JP", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);color:var(--text);background:var(--cream);min-height:100vh;line-height:1.7;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;transition:opacity .5s}body:before{background:radial-gradient(ellipse 70% 50% at 15% 20%,rgba(245,168,200,.35) 0%,transparent 55%),radial-gradient(ellipse 60% 45% at 85% 75%,rgba(157,212,240,.3) 0%,transparent 50%),radial-gradient(ellipse 50% 40% at 50% 50%,rgba(196,167,245,.15) 0%,transparent 60%)}body.theme-tansak:before{background:radial-gradient(ellipse 80% 55% at 20% 15%,rgba(255,180,140,.4) 0%,transparent 50%),radial-gradient(ellipse 70% 50% at 80% 30%,rgba(245,168,200,.35) 0%,transparent 50%),radial-gradient(ellipse 60% 45% at 50% 85%,rgba(196,167,245,.25) 0%,transparent 55%)}body.theme-compass:before{background:radial-gradient(ellipse 75% 50% at 25% 25%,rgba(184,230,216,.4) 0%,transparent 50%),radial-gradient(ellipse 65% 45% at 75% 20%,rgba(245,168,200,.3) 0%,transparent 50%),radial-gradient(ellipse 55% 40% at 50% 80%,rgba(255,201,168,.3) 0%,transparent 55%)}body.theme-chighag:before{background:radial-gradient(ellipse 70% 50% at 20% 30%,rgba(157,212,240,.35) 0%,transparent 50%),radial-gradient(ellipse 65% 45% at 80% 25%,rgba(255,181,160,.35) 0%,transparent 50%),radial-gradient(ellipse 50% 40% at 50% 75%,rgba(232,200,114,.2) 0%,transparent 55%)}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}.app-shell{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;padding:.65rem 1rem;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffa6;border-bottom:1px solid rgba(255,255,255,.85);position:sticky;top:0;z-index:100}.app-header__logo{display:flex;align-items:center;justify-content:center}.app-header__logo-img{height:36px;width:auto;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(196,167,245,.25))}.app-header__back{font-size:.8rem;color:var(--text-soft);padding:.4rem .85rem;border-radius:999px;background:#ffffffbf;border:1px solid rgba(196,167,245,.2);transition:transform .2s,background .2s;white-space:nowrap}.app-header__back:hover{transform:translate(-2px)}.app-main{flex:1;padding:0 1.25rem 6rem;max-width:480px;margin:0 auto;width:100%}.app-logo-hero{text-align:center;padding:1.25rem 0 1.75rem;position:relative}.app-logo-hero__img{width:min(280px,85vw);height:auto;object-fit:contain;filter:drop-shadow(0 8px 24px rgba(196,167,245,.2));animation:logoFloat 5s ease-in-out infinite}.app-logo-hero__sparkle{position:absolute;font-size:.75rem;opacity:.6;animation:sparkle 2.5s ease-in-out infinite;pointer-events:none}.app-logo-hero__sparkle--1{top:10%;left:15%;animation-delay:0s}.app-logo-hero__sparkle--2{top:20%;right:12%;animation-delay:.8s}.app-logo-hero__sparkle--3{bottom:15%;left:20%;animation-delay:1.5s}@keyframes logoFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes sparkle{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:.9;transform:scale(1.1)}}.step-label{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.08em;color:var(--purple);background:#c4a7f533;padding:.3rem .8rem;border-radius:999px;margin-bottom:.75rem}.step-title{font-size:1.35rem;font-weight:700;margin-bottom:.5rem;line-height:1.5}.step-hint{font-size:.9rem;color:var(--text-soft);margin-bottom:1.5rem}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2rem;border-radius:999px;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--pink),var(--purple));box-shadow:0 8px 24px var(--shadow);transition:transform .2s,box-shadow .2s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px var(--shadow)}.btn-primary:active{transform:scale(.98)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:999px;font-size:.9rem;font-weight:500;color:var(--text);background:#fffc;border:1px solid rgba(196,167,245,.4)}.mic-btn{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#ff9ecd,var(--purple));box-shadow:0 8px 32px #f8a4d880;display:flex;align-items:center;justify-content:center;font-size:2rem;z-index:200;transition:transform .2s,box-shadow .2s}.mic-btn:hover{transform:translate(-50%) scale(1.05)}.mic-btn.recording{animation:pulse-mic 1s ease-in-out infinite;box-shadow:0 0 0 8px #f8a4d84d}@keyframes pulse-mic{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.08)}}.fade-in{animation:fadeIn .6s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.float-tag{position:absolute;font-weight:700;white-space:nowrap;animation:floatTag 3s ease-in-out infinite;pointer-events:none}@keyframes floatTag{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.cloud-card{background:#ffffffd1;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius);border:1px solid rgba(255,255,255,.95);box-shadow:0 8px 32px var(--shadow),inset 0 1px #ffffffe6;padding:1.25rem;position:relative;overflow:hidden}.cloud-card:before{content:"";position:absolute;top:-30%;right:-20%;width:60%;height:60%;border-radius:50%;background:radial-gradient(circle,rgba(245,168,200,.08),transparent 70%);pointer-events:none}.hidden{display:none!important}