:root{--bg: #080a13;--bg-soft: #0d1020;--panel: rgba(20, 25, 43, .6);--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .16);--text: #eef1f7;--text-muted: #8b93a7;--cyan: #2ea3ff;--purple: #a855f7;--danger: #ff5c7c;--gradient: linear-gradient(135deg, #2ea3ff 0%, #7c5cff 55%, #a855f7 100%);--radius: 16px;--radius-lg: 22px;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}body:before,body:after{content:"";position:fixed;width:60vmax;height:60vmax;border-radius:50%;filter:blur(120px);opacity:.18;pointer-events:none;z-index:0}body:before{top:-25vmax;left:-20vmax;background:var(--cyan)}body:after{bottom:-28vmax;right:-22vmax;background:var(--purple)}.app{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.75rem;padding:2.5rem 1.25rem 5.5rem;text-align:center}.app-header{display:flex;flex-direction:column;align-items:center;gap:.85rem;max-width:30rem}.brand-logo{width:clamp(240px,62vw,320px);height:auto;-webkit-user-select:none;user-select:none}.app-header p{margin:0;color:var(--text-muted);font-size:.98rem}.consent{display:flex;flex-direction:column;align-items:center;gap:.55rem;max-width:30rem}.consent-check{display:flex;align-items:flex-start;gap:.6rem;font-size:.86rem;color:var(--text-muted);text-align:left;cursor:pointer}.consent-check input{flex:none;margin-top:.15rem;width:1.05rem;height:1.05rem;accent-color:var(--purple);cursor:pointer}.consent-link{background:none;border:none;padding:0;font:inherit;font-size:.78rem;font-weight:400;color:var(--text-muted);cursor:pointer;text-decoration:underline;text-decoration-color:#ffffff2e;text-underline-offset:3px;opacity:.8;transition:color .15s ease,opacity .15s ease}.consent-link:hover{color:var(--text);opacity:1}.recorder{display:flex;flex-direction:column;align-items:center;gap:.9rem}.mic-button{position:relative;width:104px;height:104px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;color:#fff;background:var(--gradient);box-shadow:0 10px 40px -12px #7c5cffb3;transition:transform .15s ease,box-shadow .2s ease,filter .2s ease}.mic-button:after{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:50%;background:var(--bg-soft);transition:opacity .2s ease}.mic-button svg{position:relative;z-index:1;width:38px;height:38px}.mic-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 48px -12px #7c5cffd9}.mic-button:disabled{opacity:.5;cursor:not-allowed}.mic-button.is-recording:after{opacity:0}.mic-button.is-recording{animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #a855f780}50%{box-shadow:0 0 0 18px #a855f700}}.recorder-hint{font-size:.9rem;color:var(--text-muted);letter-spacing:.01em}.recorder-error{margin:0;color:var(--danger);font-size:.9rem}.status{margin:0;color:var(--text-muted);display:inline-flex;align-items:center;gap:.55rem}.status-error{color:var(--danger)}.spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:var(--cyan);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.result{width:100%;max-width:34rem;display:flex;flex-direction:column;gap:1.1rem;padding:1.5rem;text-align:left;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 24px 60px -28px #000c;animation:rise .35s ease}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}.prompt-field{display:flex;flex-direction:column;gap:.45rem}.prompt-field-label{font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}textarea{width:100%;padding:.85rem .95rem;font:inherit;color:var(--text);background:#00000040;border:1px solid var(--border);border-radius:var(--radius);resize:vertical;transition:border-color .15s ease,box-shadow .15s ease}textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px #2ea3ff26}textarea[readonly]{color:var(--text-muted)}.emotion{margin:0;font-size:.92rem;color:var(--text-muted)}.emotion-chip{display:inline-block;margin-left:.15rem;padding:.2rem .7rem;border-radius:999px;font-weight:600;color:#fff;background:var(--gradient)}.copy-button{align-self:stretch;padding:.85rem 1.25rem;font-size:.98rem;font-weight:700;letter-spacing:.01em;color:#fff;background:var(--gradient);border:none;border-radius:var(--radius);cursor:pointer;transition:transform .15s ease,filter .15s ease,opacity .15s ease}.copy-button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}.copy-button:disabled{opacity:.5;cursor:not-allowed}.privacy-note{margin:0;font-size:.8rem;color:var(--text-muted);opacity:.8}.app-footer{position:fixed;bottom:0;left:0;right:0;z-index:5;display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));text-align:center;font-size:.76rem;color:var(--text-muted);background:linear-gradient(to top,var(--bg) 35%,rgba(8,10,19,0))}.app-footer p{margin:0}.footer-links{display:flex;align-items:center;gap:.5rem;margin-top:.1rem}.footer-sep{opacity:.5}.footer-credit{color:var(--text);font-weight:500;text-decoration:none;transition:color .15s ease}.footer-credit:hover{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:1.25rem;background:#04060cb3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade .2s ease}@keyframes fade{0%{opacity:0}}.modal{position:relative;width:100%;max-width:32rem;max-height:85vh;overflow-y:auto;padding:1.75rem 1.75rem 2rem;text-align:left;background:#0f1322;border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:0 30px 80px -30px #000000e6;animation:rise .25s ease}.modal-close{position:absolute;top:.9rem;right:1.1rem;width:2rem;height:2rem;font-size:1.5rem;line-height:1;color:var(--text-muted);background:none;border:none;border-radius:8px;cursor:pointer;transition:color .15s ease,background .15s ease}.modal-close:hover{color:var(--text);background:#ffffff0f}.modal h2{margin:0 0 .25rem;font-size:1.4rem;background:var(--gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.modal-meta{margin:0 0 1.25rem;font-size:.85rem;color:var(--text-muted)}.modal h3{margin:1.25rem 0 .35rem;font-size:.92rem;color:var(--text)}.modal p{margin:0;font-size:.9rem;color:var(--text-muted)}.modal a{color:var(--cyan)}