.topbar__inner{max-width:1200px;margin:0 auto;padding:10px 18px;display:grid;grid-template-columns:220px 1fr 220px;align-items:center;gap:12px}.main{max-width:1200px;margin:20px auto;padding:0 18px;display:grid;grid-template-columns:260px minmax(0,1fr) 300px;gap:var(--gap)}.sidebar{display:flex;flex-direction:column;gap:var(--gap);margin:10px}.post.card{overflow:hidden;margin-bottom:var(--gap)}.post__action{display:inline-flex;gap:8px;align-items:center;cursor:pointer;padding:8px 12px;border-radius:10px;border:1px solid transparent;margin-right:10px}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,Liberation Sans,sans-serif;background:#fde9e9;color:#222}img{max-width:100%;display:block}button,input,textarea{font:inherit}:root{--bg-page: #fde9e9;--bg-shell: #ffffff;--bg-surface: #ffffff;--bg-muted: #f6f7fb;--text: #1f2937;--text-muted: #6b7280;--brand: #6b8e23;--brand-600:#556b2f;--brand-50:#f3f7ea;--stroke: #e5e7eb;--shadow: 0 8px 28px rgba(16,24,40,.08);--radius-lg: 16px;--radius-md: 12px;--radius-sm: 10px;--gap: 20px}.landing{min-height:100%;display:grid;grid-template-rows:auto 1fr;background:var(--bg-page)}.topbar{position:sticky;top:0;z-index:10;background:var(--bg-shell);border-bottom:1px solid var(--stroke);box-shadow:0 1px #00000005}.topbar__inner{max-width:none;width:100%;margin:0;padding:10px 18px;display:grid;grid-template-columns:220px 1fr 220px;align-items:center;gap:12px}.brand{display:flex;align-items:center;gap:10px}.brand__logo{width:28px;height:28px;border-radius:50%;background:var(--brand-50);border:2px solid var(--brand)}.brand__name{font-weight:700;letter-spacing:.2px}.nav-tabs{display:flex;justify-content:center;gap:18px}.nav-tabs__item{padding:8px 10px;border-radius:999px;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.nav-tabs__item--active{color:var(--brand);background:var(--brand-50);font-weight:600}.topbar__right{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center}.search{background:var(--bg-muted);border:1px solid var(--stroke);border-radius:999px;padding:8px 12px;display:flex;gap:8px;align-items:center}.search input{border:none;outline:none;background:transparent;width:100%}.icon-btn{width:36px;height:36px;border-radius:999px;border:1px solid var(--stroke);background:#fff;display:grid;place-items:center;cursor:pointer}.avatar{width:32px;height:32px;border-radius:50%;background:#ddd;border:2px solid #fff;box-shadow:var(--shadow)}.main{max-width:none;width:100%;margin:20px auto;padding:0 18px;display:grid;grid-template-columns:260px minmax(0,1fr) 300px;gap:var(--gap)}.sidebar{display:flex;flex-direction:column;gap:var(--gap)}.card{background:var(--bg-surface);border:1px solid var(--stroke);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}.card__header{padding:14px 16px;border-bottom:1px solid var(--stroke);font-weight:700;color:#111827}.card__body{padding:14px 16px;color:var(--text-muted)}.card__footer{padding:10px 16px;border-top:1px solid var(--stroke)}.widget-about .about-cover{height:120px;background:#d1d5db;object-fit:cover;width:100%}.widget-about .about-user{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;margin-top:-24px;padding:0 16px 10px}.widget-about .about-avatar{width:48px;height:48px;border-radius:50%;border:3px solid #fff;background:#ccc}.widget-list{list-style:none;margin:0;padding:0}.widget-list li{display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;padding:10px 16px;border-top:1px solid var(--stroke)}.widget-list li:first-child{border-top:none}.widget-list__thumb{width:36px;height:36px;border-radius:8px;background:#e5e7eb}.widget-list__title{font-weight:600;color:#111827}.widget-list__meta{color:var(--text-muted);font-size:12px}.feed{display:flex;flex-direction:column;gap:var(--gap)}.composer.card{padding:0}.composer__row{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:12px 16px}.composer__avatar{width:40px;height:40px;border-radius:50%;background:#ddd}.composer__input{border:1px solid var(--stroke);background:var(--bg-muted);border-radius:999px;padding:10px 14px;color:var(--text)}.composer__btn{border:none;background:var(--brand);color:#fff;padding:10px 16px;border-radius:999px;cursor:pointer;font-weight:600}.composer__btn:hover{background:var(--brand-600)}.post.card{overflow:hidden}.post__header{padding:14px 16px;display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center}.post__avatar{width:40px;height:40px;border-radius:50%;background:#ddd}.post__author{font-weight:700;color:#111827}.post__meta{color:var(--text-muted);font-size:12px}.post__content{padding:0 16px 12px;color:#374151;line-height:1.55}.post__media{width:100%;height:auto;max-height:420px;object-fit:cover}.post__actions{display:flex;justify-content:flex-end;padding:10px 16px;border-top:1px solid var(--stroke);color:var(--text-muted)}.post__action{display:inline-flex;gap:8px;align-items:center;cursor:pointer;padding:8px 12px;border-radius:10px;border:1px solid transparent}.post__action:hover{background:var(--bg-muted);color:var(--text);border-color:var(--stroke)}.post__action .count{font-weight:600;color:var(--brand-600)}.widget-activity .activity-item{padding:12px 16px;border-top:1px solid var(--stroke);display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:start}.widget-activity .activity-item:first-child{border-top:none}.activity__icon{width:36px;height:36px;border-radius:50%;background:#e5e7eb}.activity__text{font-size:14px;color:#374151}.activity__time{font-size:12px;color:var(--text-muted)}.widget-ad .ad-box{display:grid;place-items:center;height:220px;background:#111;color:#fff;font-weight:700;letter-spacing:1px}.widget-friends .friend{padding:12px 16px;border-top:1px solid var(--stroke);display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center}.widget-friends .friend:first-child{border-top:none}.friend__avatar{width:36px;height:36px;border-radius:50%;background:#e5e7eb}.friend__name{font-weight:600;color:#111827}.friend__status{width:8px;height:8px;border-radius:50%;background:#22c55e}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;background:var(--bg-muted);border:1px solid var(--stroke);color:var(--text-muted);font-size:12px;font-weight:600}.hr{border-top:1px solid var(--stroke);margin:10px 0}@media (max-width: 1200px){.topbar__inner{grid-template-columns:200px 1fr 200px}.main{grid-template-columns:240px minmax(0,1fr) 280px}}@media (max-width: 1024px){.main{grid-template-columns:220px minmax(0,1fr)}.sidebar--right{display:none}}@media (max-width: 768px){.topbar__inner{grid-template-columns:1fr auto;gap:10px}.brand,.nav-tabs{display:none}.main{grid-template-columns:minmax(0,1fr)}.sidebar--left{display:none}.composer__row{grid-template-columns:32px 1fr auto}.composer__btn{padding:8px 12px}}