@import"https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&display=swap";:root{--color-bg: #fdfaf1;--color-paper: #ffffff;--color-text: #4a3f35;--color-primary: #8fb9a8;--color-secondary: #fefad4;--color-accent: #ff8c94;--color-sky: #a1d9eb;--color-border: #e0d7c6;--font-main: "Zen Maru Gothic", "Inter", system-ui, -apple-system, sans-serif;--shadow-warm: 0 4px 15px rgba(74, 63, 53, .08);--radius-lg: 24px;--radius-md: 16px;--transition-smooth: .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-main);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;background-image:radial-gradient(circle at 10% 20%,rgba(143,185,168,.05) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(161,217,235,.05) 0%,transparent 40%),url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.02'/%3E%3C/svg%3E")}#root{display:flex;flex-direction:column;min-height:100vh}h1,h2,h3{font-weight:700;color:#3d342d}button{cursor:pointer;font-family:inherit;border:none;background:none;transition:var(--transition-smooth)}.container{max-width:800px;margin:0 auto;padding:2rem 1rem;width:100%}.card{background:var(--color-paper);border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-warm);border:1px solid var(--color-border)}.mode-card{border:2px solid transparent!important;transition:all .3s cubic-bezier(.4,0,.2,1)!important}.mode-card:hover{transform:translateY(-5px);border-color:var(--color-primary)!important;box-shadow:0 10px 20px #8fb9a826!important;background-color:#fff!important}.mode-card h3{transition:color .3s ease}.mode-card:hover h3{color:var(--color-secondary)!important}.fade-in{animation:fadeIn .8s var(--transition-smooth)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.input-container{position:relative;width:100%}.mic-button{position:absolute;right:12px;bottom:12px;width:40px;height:40px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a;color:var(--color-primary);border:1px solid var(--color-border);z-index:10;transition:all .2s ease}.mic-button:hover{transform:scale(1.1);background:var(--color-secondary)}.mic-button.recording{background:var(--color-accent);color:#fff;animation:pulse-red 1.5s infinite}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #ff8c94b3}70%{transform:scale(1);box-shadow:0 0 0 10px #ff8c9400}to{transform:scale(.95);box-shadow:0 0 #ff8c9400}}.tb-chest{position:relative;margin:0 auto;transform:translateZ(0);will-change:transform,opacity}.tb-chest--small{width:80px;height:76px;animation:tb-chest-pop 1.5s ease-out both}.tb-chest--large{width:150px;height:140px}.tb-chest--shake{animation:tb-chest-shake .35s ease-in-out 3,tb-chest-open-fast 1s ease-out 1.05s both}.tb-chest-body{position:absolute;left:10%;right:10%;bottom:8%;height:55%;border-radius:10px;border:3px solid #8a5a1f;background:linear-gradient(180deg,#f6c75d,#c58d2c);box-shadow:inset 0 -6px #6e481340}.tb-chest-lid{position:absolute;left:10%;right:10%;top:18%;height:28%;border-radius:10px 10px 5px 5px;border:3px solid #8a5a1f;background:linear-gradient(180deg,#ffd976,#d59a33);transform-origin:14% 92%;will-change:transform}.tb-chest--small .tb-chest-lid{animation:tb-lid-open-soft 1.5s ease-out both}.tb-chest--large .tb-chest-lid{animation:tb-lid-open-fast .9s cubic-bezier(.12,.78,.29,1.04) 1.05s both}.tb-chest-glow{position:absolute;top:-20%;left:-10%;width:120%;height:120%;background:radial-gradient(circle,#fff5c2cc,#ffd70066 45%,#ffd70000 75%);opacity:0;transform:scale(.7);will-change:opacity,transform}.tb-chest--small .tb-chest-glow{animation:tb-glow-pop 1.5s ease-out both}.tb-chest-light{position:absolute;top:-38%;left:-20%;width:140%;height:140%;border-radius:50%;background:radial-gradient(circle,#fffffff2,#ffe480bf 28%,#ffd70000 70%);opacity:0;transform:scale(.5);will-change:opacity,transform;animation:tb-light-burst 1.2s ease-out 1.2s both}.tb-small-fx{position:relative;width:100%;padding-top:.4rem}.tb-small-sparkles{position:absolute;left:50%;top:5px;width:110px;height:90px;transform:translate(-50%);pointer-events:none}.tb-sparkle{position:absolute;left:50%;top:48px;font-size:1rem;opacity:0;transform:translate3d(-50%,0,0) scale(.7);animation:tb-sparkle-float 1.1s ease-out calc(var(--i) * .13s) both}.tb-small-fx-text{margin-top:.55rem;color:#8a6820;font-weight:800;font-size:.95rem;opacity:0;animation:tb-fade-up .45s ease-out .85s forwards}.tb-unlock-overlay{position:fixed;inset:0;z-index:9000;background:#1710099e;display:flex;align-items:center;justify-content:center;padding:1rem;animation:tb-overlay-fade .35s ease-out}.tb-unlock-stage{position:relative;width:min(96vw,520px);min-height:430px;text-align:center}.tb-confetti-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none}.tb-confetti{position:absolute;top:-12px;left:var(--left);width:10px;height:16px;border-radius:2px;opacity:0;transform:translate3d(0,-20px,0) rotate(0);animation:tb-confetti-fall var(--duration) linear var(--delay) forwards}.tb-confetti:nth-child(4n+1){background:#e74c3c}.tb-confetti:nth-child(4n+2){background:gold}.tb-confetti:nth-child(4n+3){background:#2ecc71}.tb-confetti:nth-child(4n+4){background:#3498db}.tb-unlock-title{margin-top:1.15rem;font-size:clamp(1.75rem,5.8vw,32px);color:#fff3ce;font-weight:900;letter-spacing:.02em;opacity:0;animation:tb-fade-up .5s ease-out 1.85s forwards}.tb-unlock-subtitle{margin-top:.35rem;color:#fff;font-size:clamp(.95rem,3.4vw,1.15rem);opacity:0;animation:tb-fade-up .55s ease-out 2.15s forwards}.tb-unlock-cta{margin-top:1rem;padding:.65rem 1.35rem;border-radius:999px;border:none;background:linear-gradient(180deg,#ffdc7d,#d5a13d);color:#4b3514;font-weight:800;font-size:.95rem;box-shadow:0 8px 18px #0000004d;animation:tb-fade-up .35s ease-out}@keyframes tb-chest-pop{0%{transform:scale(1)}35%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes tb-lid-open-soft{0%,20%{transform:rotate(0)}70%{transform:rotate(-60deg)}to{transform:rotate(-54deg)}}@keyframes tb-lid-open-fast{0%{transform:rotate(0)}80%{transform:rotate(-110deg)}to{transform:rotate(-100deg)}}@keyframes tb-glow-pop{0%,25%{opacity:0;transform:scale(.7)}70%{opacity:.95;transform:scale(1.1)}to{opacity:.75;transform:scale(1)}}@keyframes tb-light-burst{0%{opacity:0;transform:scale(.5)}35%{opacity:.95;transform:scale(1)}to{opacity:.2;transform:scale(1.45)}}@keyframes tb-sparkle-float{0%{opacity:0;transform:translate3d(-50%,0,0) scale(.7)}18%{opacity:1}to{opacity:0;transform:translate3d(calc(-50% + (var(--i) - 2) * 18px),-56px,0) scale(1.1)}}@keyframes tb-fade-up{0%{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:translateZ(0)}}@keyframes tb-overlay-fade{0%{opacity:0}to{opacity:1}}@keyframes tb-chest-shake{0%{transform:translate(0)}25%{transform:translate(-6px)}50%{transform:translate(6px)}75%{transform:translate(-4px)}to{transform:translate(0)}}@keyframes tb-chest-open-fast{0%{transform:translateY(4px) scale(.97)}65%{transform:translateY(-3px) scale(1.02)}to{transform:translateY(0) scale(1)}}@keyframes tb-confetti-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}8%{opacity:1}to{opacity:.95;transform:translate3d(var(--drift),112vh,0) rotate(680deg)}}.tb-hero-carousel-frame:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}