@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap";:root{--bg-color: #09090b;--text-primary: #f4f4f5;--text-secondary: #a1a1aa;--text-muted: #52525b;--border-color: rgba(255, 255, 255, .08);--border-color-active: rgba(255, 255, 255, .25);--font-serif: "Cormorant Garamond", Georgia, serif;--font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;--app-max-width: 480px}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}body,html{width:100%;height:100%;overflow:hidden;background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-sans);display:flex;justify-content:center;align-items:center}#app-container{width:100%;height:100%;max-width:var(--app-max-width);margin:0 auto;position:relative;display:flex;flex-direction:column;justify-content:flex-start;gap:1rem;padding:2.2rem 1.8rem;background-color:var(--bg-color);border-left:1px solid rgba(255,255,255,.03);border-right:1px solid rgba(255,255,255,.03);overflow-y:auto;-webkit-overflow-scrolling:touch}@media (min-width: 481px) and (max-width: 768px){#app-container{height:90%;border-radius:24px;border:1px solid var(--border-color);box-shadow:0 40px 100px #000000b3}}header{z-index:2;display:flex;justify-content:space-between;align-items:center;gap:1rem}.brand{font-family:var(--font-serif);font-weight:500;font-size:1.35rem;letter-spacing:.5px;color:var(--text-primary)}.status-badge{font-size:.65rem;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--text-secondary);display:flex;align-items:center;gap:6px}.header-meta{display:flex;align-items:center;gap:.7rem;min-width:0}.progress-badge{font-size:.62rem;font-weight:600;letter-spacing:.6px;text-transform:uppercase;color:var(--text-secondary);white-space:nowrap}@media (max-width: 380px){.header-meta{align-items:flex-end;flex-direction:column;gap:.25rem}}.status-dot{width:4px;height:4px;border-radius:50%;background-color:var(--text-secondary)}.status-dot.speaking{background-color:#fff;box-shadow:0 0 6px #fff;animation:pulse-dot 1s infinite alternate ease-in-out}.status-dot.thinking{background-color:var(--text-secondary);animation:pulse-dot .5s infinite alternate ease-in-out}.visualizer-wrapper{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;z-index:2;min-height:215px;margin:1.8rem 0 .6rem}.orb-container{position:relative;width:180px;height:180px;display:flex;justify-content:center;align-items:center;cursor:pointer}#orb-canvas{width:100%;height:100%}.voice-indicator-label{position:absolute;bottom:-15px;font-family:var(--font-serif);font-style:italic;font-size:.95rem;color:var(--text-secondary);text-align:center;pointer-events:none;opacity:.6}.captions-card{z-index:2;text-align:left;min-height:310px;height:310px;max-height:310px;display:flex;flex-direction:column;justify-content:flex-start;margin-bottom:.45rem;padding:.85rem .95rem;overflow-y:auto;border:1px solid var(--border-color);border-radius:14px;background:#ffffff09;box-shadow:inset 0 1px #ffffff0a;transform-origin:top;transform:translateY(0) scaleY(1);transition:opacity .34s ease,max-height .42s cubic-bezier(.22,1,.36,1),min-height .42s cubic-bezier(.22,1,.36,1),height .42s cubic-bezier(.22,1,.36,1),margin .42s cubic-bezier(.22,1,.36,1),padding .42s cubic-bezier(.22,1,.36,1),transform .42s cubic-bezier(.22,1,.36,1),border-color .28s ease,background .28s ease}.captions-card.is-disabled{min-height:0;height:0;max-height:0;margin-bottom:0;padding-top:0;padding-bottom:0;opacity:0;transform:translateY(8px) scaleY(.96);pointer-events:none;overflow:hidden;border-color:#ffffff0b;background:#ffffff05}.captions-card>*{transition:opacity .18s ease}.captions-card.is-disabled>*{opacity:0}.caption-label{font-family:var(--font-serif);font-size:1rem;font-weight:400;color:var(--text-primary);margin-bottom:6px}.captions-text{font-family:var(--font-sans);font-size:.78rem;line-height:1.55;color:var(--text-secondary);font-weight:300;max-width:100%;margin:0;white-space:pre-wrap;text-align:left}.captions-text .cursor{display:inline-block;width:1.5px;height:1em;background-color:var(--text-primary);margin-left:2px;animation:blink .8s infinite;vertical-align:middle}.options-pane{z-index:2;display:flex;flex-direction:column;gap:.75rem;margin-bottom:.4rem;height:auto;overflow:visible;transition:margin .42s cubic-bezier(.22,1,.36,1)}.option-btn{background:transparent;border:1px solid var(--border-color);border-radius:8px;padding:1rem 1.25rem;color:var(--text-primary);font-family:var(--font-sans);font-size:.92rem;font-weight:500;text-align:left;cursor:pointer;outline:none;display:flex;flex-direction:column;gap:4px;will-change:opacity,transform;transition:background .2s ease-in-out,border-color .2s ease-in-out,color .2s ease-in-out,transform .2s ease-in-out}.option-btn .btn-title{font-weight:600;font-size:.92rem}.option-btn .btn-desc{font-size:.76rem;font-weight:400;color:var(--text-secondary);line-height:1.4;transition:color .2s ease-in-out}.option-btn:hover,.option-btn:focus-visible{background:#fff;border-color:#fff;color:#000}.option-btn:hover .btn-desc{color:#444448}.option-btn.single-option-btn{background:#fff;border-color:#fff;color:#000}.option-btn.single-option-btn .btn-desc{color:#444448}.option-btn:active{background:#f4f4f5;border-color:#f4f4f5}.checkout-btn{background:#fff;border:none;border-radius:8px;padding:1.2rem;color:#000;font-family:var(--font-sans);font-size:1.05rem;font-weight:700;letter-spacing:.5px;text-align:center;align-items:center;justify-content:center;transition:all .25s ease-in-out;box-shadow:0 0 0 1px #ffffff1a}.checkout-btn .btn-desc{display:none}.checkout-btn:hover{transform:scale(1.02);background:#fff;box-shadow:0 0 20px #ffffff40}.checkout-btn:active{transform:scale(.99);background:#e4e4e7}.footer-controls{z-index:2;display:inline-flex;justify-content:center;gap:.55rem;align-items:center;align-self:center;margin-top:auto;padding:.62rem;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:#363636d1;box-shadow:0 18px 55px #00000073,inset 0 1px #ffffff0f;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.control-icon-btn{background:#0d0d0eeb;border:0;width:54px;height:54px;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;color:#f7f7f7;box-shadow:0 8px 22px #00000047;transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease}.control-icon-btn:hover{background:#19191bf5;color:#fff;transform:translateY(-1px)}.control-icon-btn:active{transform:scale(.96)}.control-icon-btn.control-primary{background:#f4f4f5;color:#000}.control-icon-btn.control-primary:hover{background:#fff}.control-icon-btn.control-danger{background:#f0033d;color:#fff}.control-icon-btn.control-danger:hover{background:#ff0a48}.control-icon-btn.active{color:#000;background:#f4f4f5}@media (max-width: 380px){#app-container{padding-inline:1.25rem}.visualizer-wrapper{min-height:190px;margin-top:1rem}.orb-container{width:165px;height:165px}.captions-card{height:310px;min-height:310px;max-height:310px}.footer-controls{gap:.45rem;padding:.52rem}.control-icon-btn{width:48px;height:48px}}#welcome-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--bg-color);z-index:100;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem;text-align:center;transition:opacity .4s ease-out,visibility .4s ease-out}#welcome-overlay.fade-out{opacity:0;visibility:hidden}.welcome-logo{position:relative;width:100px;height:100px;margin-bottom:2rem}.welcome-logo-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border:1.5px dashed rgba(255,255,255,.2);border-radius:50%;animation:logo-spin 12s infinite linear}.welcome-logo-dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;background-color:#fff;border-radius:50%}.welcome-title{font-family:var(--font-serif);font-size:2.5rem;font-weight:400;letter-spacing:-.5px;line-height:1.2;margin-bottom:.8rem;color:var(--text-primary)}.welcome-description{font-family:var(--font-sans);font-size:.88rem;line-height:1.6;color:var(--text-secondary);max-width:290px;margin-bottom:3rem;font-weight:300}.welcome-btn{background:#fff;color:#000;border:none;border-radius:8px;padding:1.1rem 2.5rem;font-family:var(--font-sans);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease-in-out}.welcome-btn:hover{transform:scale(1.02);background:#f4f4f5;box-shadow:0 0 15px #ffffff26}.welcome-btn:active{transform:scale(.99)}.welcome-footer{position:absolute;bottom:24px;font-size:.72rem;color:var(--text-muted);font-family:var(--font-serif);font-style:italic}@keyframes pulse-dot{0%{transform:scale(1);opacity:.6}to{transform:scale(1.4);opacity:1}}@keyframes logo-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.option-fade-in{animation:option-appear .52s cubic-bezier(.22,1,.36,1) forwards;opacity:0;transform:translateY(14px) scale(.98)}@keyframes option-appear{to{opacity:1;transform:translateY(0) scale(1)}}.options-pane::-webkit-scrollbar,.captions-card::-webkit-scrollbar{width:2px}.options-pane::-webkit-scrollbar-track,.captions-card::-webkit-scrollbar-track{background:transparent}.options-pane::-webkit-scrollbar-thumb,.captions-card::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}@media (min-width: 769px){#app-container{max-width:1040px;height:85%;border-radius:20px;border:1px solid var(--border-color);box-shadow:0 50px 120px #000c;display:grid;grid-template-columns:1fr 1.35fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header captions" "visualizer captions" "options captions" "footer captions";gap:1.5rem 3.5rem;padding:3rem}header{grid-area:header;border-bottom:1px solid var(--border-color);padding-bottom:1rem}.visualizer-wrapper{grid-area:visualizer;margin:0;min-height:auto;align-self:center}.orb-container{width:240px;height:240px}.options-pane{grid-area:options;margin-bottom:0}.footer-controls{grid-area:footer;border-top:none;margin-top:.5rem}.captions-card{grid-area:captions;margin-bottom:0;height:100%;max-height:100%;min-height:0;opacity:1;pointer-events:auto;overflow-y:auto;border-top:none;border-left:1px solid var(--border-color);padding-top:0;padding-left:3rem;text-align:left;display:flex;flex-direction:column;justify-content:flex-start}.captions-card.is-disabled{height:100%;max-height:100%;margin-bottom:0;padding-bottom:0;opacity:1}.caption-label{font-size:2.1rem;margin-top:.5rem;margin-bottom:1.5rem;text-align:left;border-bottom:1px solid var(--border-color);padding-bottom:.8rem}.captions-text{font-size:.98rem;line-height:1.8;max-width:100%;margin:0;color:var(--text-secondary);text-align:left}}
