*{margin:0;padding:0;box-sizing:border-box}:root{--forest-green: #2d5016;--sage-green: #87a96b;--ocean-blue: #4a90a4;--sand-beige: #f4f1e8;--warm-white: #fefcf7;--charcoal: #2c3e50;--gold: #d4af37}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#1a1a1a,#2d2d2d);color:#fff;min-height:100vh;overflow-x:hidden}.container{display:flex;flex-direction:column;min-height:100vh;max-width:100%}.image-section{flex:1;display:flex;align-items:center;justify-content:center;padding:20px;min-height:50vh}.bowdaro-image{width:100%;height:100%;object-fit:cover;cursor:default;transition:none;box-shadow:0 10px 30px #0000004d}.content-section{background:#000c;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:30px 20px;text-align:center}.title{font-size:36px;font-weight:700;color:var(--gold);margin-bottom:10px;text-shadow:2px 2px 4px rgba(0,0,0,.5);text-align:center}.subtitle{font-size:18px;color:var(--sage-green);font-weight:500;margin-bottom:20px;text-align:center}.instruction{font-size:16px;color:#ffffffe6;margin-bottom:30px;line-height:1.4;text-align:center}.controls{display:flex;justify-content:center;gap:30px;margin-bottom:30px}.mic-button,.stop-button{width:80px;height:80px;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:0 4px 20px #0000004d}.mic-button{background:linear-gradient(135deg,var(--forest-green) 0%,var(--sage-green) 100%);color:#fff}.mic-button:hover,.mic-button:active{transform:scale(1.1);box-shadow:0 6px 25px #87a96b66}.stop-button{background:#fff3;color:#fff;border:2px solid rgba(255,255,255,.3)}.stop-button:hover,.stop-button:active{background:#e74c3ccc;border-color:#e74c3c;transform:scale(1.1)}.mic-icon,.stop-icon{width:32px;height:32px}.status{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:30px;padding:15px 25px;background:#ffffff1a;border-radius:25px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-flex}.status-dot{width:12px;height:12px;border-radius:50%;background:var(--sage-green);animation:breathe 2s ease-in-out infinite}@keyframes breathe{0%,to{opacity:.6}50%{opacity:1}}.status-text{color:#ffffffe6;font-weight:500;font-size:16px}.conversation-toggle{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:15px 30px;border-radius:25px;cursor:pointer;font-size:16px;font-weight:500;transition:all .3s ease;margin-bottom:20px}.conversation-toggle:hover{background:#fff3}.conversation-log{max-height:0;overflow:hidden;transition:max-height .3s ease;background:#00000080;border-radius:15px;margin-top:20px}.conversation-log.expanded{max-height:300px}.conversation-log h3{color:var(--gold);font-size:20px;font-weight:600;padding:20px 20px 10px;border-bottom:1px solid rgba(255,255,255,.1)}.conversation-log #log{padding:20px;max-height:200px;overflow-y:auto;white-space:pre-wrap;font-size:16px;line-height:1.5;color:#ffffffe6}.conversation-log #log::-webkit-scrollbar{width:4px}.conversation-log #log::-webkit-scrollbar-track{background:#ffffff1a}.conversation-log #log::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}@media (min-width: 768px){.container{flex-direction:row;align-items:stretch}.image-section{flex:1;min-height:100vh}.content-section{flex:1;max-width:500px;display:flex;flex-direction:column;justify-content:center}.title{font-size:36px}.subtitle{font-size:18px}.instruction,.status-text,.conversation-toggle{font-size:16px}.conversation-log h3{font-size:18px}.conversation-log #log{font-size:14px}}