:root{--bg: #fdf6e3;--card-bg: #ffffff;--primary: #d4a373;--text: #8b5e3c;--text-light: #a98467;--accent: #faedcd;--shadow: 0 8px 30px rgba(212, 163, 115, .15)}body{margin:0;font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background-color:var(--bg);color:var(--text)}.app-wrapper{max-width:600px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding-bottom:80px}.main-header{padding:20px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;background:#fdf6e3cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100}.logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.2rem;color:var(--primary)}.sync-status{font-size:12px;color:var(--text-light);display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--accent);border-radius:20px}.syncing{animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.tab-nav{display:flex;padding:10px 20px;gap:10px;overflow-x:auto}.tab-nav button{padding:8px 20px;border:none;background:transparent;color:var(--text-light);font-size:1rem;cursor:pointer;border-radius:12px;transition:all .3s;white-space:nowrap}.tab-nav button.active{background:var(--primary);color:#fff;box-shadow:var(--shadow)}.view-container{padding:20px}.hero-card{background:var(--accent);border-radius:24px;padding:30px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;box-shadow:var(--shadow)}.hero-content h1{margin:0;font-size:1.5rem}.hero-content p{margin:10px 0 0;opacity:.8;font-size:.9rem}.tips-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.tip-card{background:var(--card-bg);padding:20px;border-radius:20px;box-shadow:var(--shadow)}.tip-card h3{margin:10px 0 5px;font-size:1rem}.tip-card p{margin:0;font-size:.8rem;color:var(--text-light)}.input-section{background:var(--card-bg);padding:20px;border-radius:20px;margin-bottom:20px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow)}.input-section input,.input-section textarea{border:1px solid #eee;padding:12px;border-radius:10px;font-family:inherit;outline:none}.input-section button{background:var(--primary);color:#fff;border:none;padding:12px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.post-card{background:var(--card-bg);padding:20px;border-radius:20px;margin-bottom:15px;box-shadow:var(--shadow)}.post-header h3{margin:5px 0}.author{font-size:12px;color:var(--primary);display:flex;align-items:center;gap:4px}.post-actions{display:flex;gap:20px;margin-top:15px;font-size:14px;color:var(--text-light)}.like-btn{background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:4px;color:inherit}.rec-card{background:var(--card-bg);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:20px}.rec-image{height:200px;position:relative;background:#eee}.rec-image img{width:100%;height:100%;object-fit:cover}.rating-badge{position:absolute;top:10px;right:10px;background:#0009;color:#fff;padding:4px 8px;border-radius:8px;font-size:12px;display:flex;align-items:center;gap:4px}.rec-info{padding:15px}.genre{font-size:12px;color:var(--primary);font-weight:700}.fab{position:fixed;bottom:20px;right:20px;width:50px;height:50px;border-radius:25px;background:var(--primary);color:#fff;border:none;box-shadow:0 4px 15px #0003;display:flex;align-items:center;justify-content:center;cursor:pointer}.empty-state{text-align:center;padding:100px 20px;color:var(--text-light)}