:root{--bg: #0f0f0f;--surface: #1a1a1a;--border: rgba(255, 255, 255, .08);--text: #e8e8e8;--text-dim: rgba(255, 255, 255, .5);--accent: #6c8cff;--accent-dim: rgba(108, 140, 255, .15);--thought: #7c8fff;--worry: #f08c6e;--hope: #f5c842;--happy: #5ec98f}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.6}.app{max-width:600px;margin:0 auto;padding:0 1rem 4rem;position:relative}.beta-badge{position:fixed;top:14px;right:14px;background:#fff;color:#000;font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.25rem .6rem;border-radius:6px;z-index:100;box-shadow:0 2px 8px #0006}.banner{background:linear-gradient(135deg,#6c8cff,#c084fc,#f472b6);padding:.85rem 1rem;border-radius:0 0 12px 12px;margin:0 -1rem 2rem}.banner-content{display:flex;align-items:center;justify-content:center;gap:.6rem}.banner-text{font-size:.82rem;font-weight:600;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.15)}.banner-emoji{font-size:.9rem}.header{text-align:center;margin-bottom:2rem;padding-top:2rem}.header-top{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-bottom:.25rem}.title{font-size:1.75rem;font-weight:700;letter-spacing:-.03em;background:linear-gradient(135deg,#6c8cff,#c084fc,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-icon{color:var(--text-dim);display:flex;align-items:center}.subtitle{color:var(--text-dim);font-size:.9rem;max-width:360px;margin:0 auto}.compose{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem;margin-bottom:1.5rem}.compose-categories{display:flex;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}.category-btn{background:transparent;border:1px solid var(--border);color:var(--text-dim);font-size:.8rem;padding:.35rem .7rem;border-radius:20px;cursor:pointer;transition:all .15s}.category-btn:hover{border-color:var(--accent);color:var(--text)}.category-btn.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.compose-input{width:100%;background:#ffffff0a;border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.95rem;font-family:inherit;padding:.75rem;resize:vertical;line-height:1.5;margin-bottom:.75rem}.compose-input::placeholder{color:var(--text-dim)}.compose-input:focus{outline:none;border-color:var(--accent)}.submit-btn{background:var(--accent);color:#fff;border:none;font-size:.85rem;font-weight:600;padding:.55rem 1.25rem;border-radius:8px;cursor:pointer;transition:opacity .15s}.submit-btn:disabled{opacity:.35;cursor:default}.submit-btn:not(:disabled):hover{opacity:.85}.filters{display:flex;gap:.4rem;margin-bottom:1.25rem;flex-wrap:wrap}.filter-btn{background:transparent;border:1px solid var(--border);color:var(--text-dim);font-size:.78rem;padding:.3rem .65rem;border-radius:20px;cursor:pointer;transition:all .15s}.filter-btn:hover{border-color:#fff3;color:var(--text)}.filter-btn.active{background:#ffffff14;border-color:#fff3;color:var(--text)}.feed{display:flex;flex-direction:column;gap:.75rem}.empty{text-align:center;color:var(--text-dim);font-size:.9rem;padding:2rem 0}.note{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem 1.1rem;border-left:3px solid transparent;transition:border-color .2s}.note--thought{border-left-color:var(--thought)}.note--worry{border-left-color:var(--worry)}.note--hope{border-left-color:var(--hope)}.note--happy{border-left-color:var(--happy)}.note-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.note-tag{font-size:.75rem;color:var(--text-dim)}.note-time{font-size:.72rem;color:var(--text-dim)}.note-text{font-size:.95rem;line-height:1.6;color:var(--text);margin-bottom:.5rem}.note-author{font-size:.78rem;color:var(--text-dim)}.image-preview-wrap{position:relative;margin-bottom:.75rem}.image-preview{width:100%;max-height:240px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}.image-remove{position:absolute;top:6px;right:6px;width:26px;height:26px;border-radius:50%;background:#000000b3;color:#fff;border:none;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.compose-actions{display:flex;align-items:center;gap:.75rem}.attach-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all .15s}.attach-btn:hover{border-color:var(--accent);color:var(--accent)}.note-image{width:100%;max-height:360px;object-fit:cover;border-radius:8px;margin-bottom:.6rem}.footer{text-align:center;padding:2.5rem 0 1rem}.footer-divider{width:40px;height:2px;background:linear-gradient(135deg,#6c8cff,#c084fc,#f472b6);margin:0 auto 1.5rem;border-radius:2px}.footer-tagline{font-size:1rem;font-weight:600;color:var(--text);margin-bottom:1rem;letter-spacing:-.01em}.footer-links{display:flex;justify-content:center;gap:1.2rem;margin-bottom:1rem}.footer-link{display:flex;align-items:center;gap:.35rem;color:var(--text-dim);font-size:.82rem;text-decoration:none;transition:color .15s}.footer-link:hover{color:var(--text)}.footer-credit{font-size:.75rem;color:var(--text-dim)}