:root{--primary: #7c5ce0;--primary-dark: #5b3fc4;--primary-soft: #ede7fb;--bg: #f7f5fb;--card: #ffffff;--text: #2d2a33;--muted: #8b8494;--muted-2: #b0a9bc;--border: #f0ecf6;--accent: #ff6b9d;--ok: #4cd97b;--radius: 14px;--shadow: 0 2px 10px rgba(0, 0, 0, .06)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:IBM Plex Sans,Inter,system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}.container{max-width:1180px;margin:0 auto;padding:0 20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 18px;border-radius:999px;font-weight:600;font-size:14px;transition:background .15s,transform .1s}.btn:active{transform:scale(.97)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-ghost{color:var(--primary);background:var(--primary-soft)}.btn-ghost:hover{background:#e3daf8}.btn-outline{border:1px solid var(--border);color:var(--text);background:var(--card)}.btn-outline:hover{border-color:var(--primary);color:var(--primary)}.btn-block{width:100%}.topbar{position:sticky;top:0;z-index:20;background:var(--card);border-bottom:1px solid var(--border)}.topbar-inner{max-width:1180px;margin:0 auto;padding:0 20px;height:56px;display:flex;align-items:center;gap:20px}.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:18px;color:var(--primary-dark)}.logo-img{height:28px;width:auto;display:block}.search{flex:1;max-width:420px}.search input{width:100%;padding:8px 16px;border-radius:999px;border:none;background:var(--bg);font-size:14px;color:var(--text);outline:none}.search input::placeholder{color:var(--muted-2)}.topbar-nav{display:flex;gap:4px;margin-left:auto;align-items:center}.topbar-nav a{padding:8px 14px;border-radius:999px;font-weight:500;font-size:14px;color:var(--muted)}.topbar-nav a:hover,.topbar-nav a.active{background:var(--primary-soft);color:var(--primary-dark)}.topbar-bell{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#f7f5fb;border:1px solid #e8e2f0;color:var(--muted);margin:0 4px}.topbar-bell:hover{color:var(--primary-dark)}.avatar-menu{position:relative}.avatar-menu .avatar-link{background:none;border:none;cursor:pointer;padding:0}.avatar-dropdown{position:absolute;right:0;top:44px;z-index:30;background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 10px 30px #0000001f;padding:6px;min-width:180px;display:flex;flex-direction:column}.avatar-dropdown a,.avatar-dropdown button{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:8px;font-size:14px;color:var(--text);background:none;border:none;text-align:left;cursor:pointer}.avatar-dropdown a:hover,.avatar-dropdown button:hover{background:var(--bg)}.avatar-dropdown button{color:var(--danger, #d6336c)}.avatar{width:32px;height:32px;border-radius:50%;background:#dcd2f5;display:grid;place-items:center;font-weight:700;font-size:13px;color:var(--primary-dark)}.layout{display:grid;grid-template-columns:220px 1fr 300px;gap:24px;padding:24px 0;align-items:start}.rail{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.rail h3{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:12px}.rail-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:500}.rail-item:hover{background:var(--bg)}.rail-item .r{width:28px;height:28px;border-radius:50%;background:var(--primary-soft);color:var(--primary-dark);display:grid;place-items:center;font-size:11px;font-weight:800}.rail-item .r--img{background-size:cover;background-position:center;color:transparent}.main,.side{display:flex;flex-direction:column;gap:16px}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.post-card{border-radius:16px;display:flex;gap:12px;padding:0;overflow:hidden}.vote-col{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 6px;background:#faf9fd;border-right:1px solid var(--border);width:44px;flex-shrink:0}.vote-btn{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:var(--muted-2);transition:background .12s,color .12s}.vote-btn:hover{background:var(--primary-soft);color:var(--primary-dark)}.vote-btn.up.on{color:#e8590c;background:#fff0e6}.vote-btn.down.on{color:#4263eb;background:#edf2ff}.score{font-size:12px;font-weight:700;color:var(--muted)}.score.up{color:#e8590c}.score.down{color:#4263eb}.post-main{flex:1;min-width:0;padding:12px 16px 0}.post-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.post-meta{font-size:13px;display:flex;flex-direction:column;line-height:1.2}.post-meta .author{font-weight:600;color:var(--text);font-size:12px}.post-meta .comm{color:var(--muted);font-size:12px;display:flex;flex-wrap:wrap;gap:3px;align-items:center}.post-meta .comm-name{color:var(--text);font-weight:500}.post-meta .time{color:var(--muted)}.post-more{margin-left:auto;color:var(--muted);display:grid;place-items:center;padding:4px;border-radius:8px}.post-more:hover{color:#c0392b;background:#fff0f4}.post-link{display:block}.post-title{font-size:16px;font-weight:500;margin-bottom:6px;line-height:1.35}.post-body{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:12px;white-space:pre-wrap}.post-img{width:100%;border-radius:10px;max-height:400px;object-fit:cover}.post-actions{display:flex;gap:4px;border-top:1px solid var(--border);padding-top:8px;margin-top:8px}.action{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border-radius:8px;font-size:12px;color:var(--muted);font-weight:500}.action:hover{background:var(--bg);color:var(--text)}.action.liked{color:var(--accent)}.report{position:relative}.report-pop{position:absolute;right:0;top:24px;z-index:20;display:flex;gap:6px;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:8px;box-shadow:0 6px 20px #0000001a}.report-pop input{width:180px;padding:6px 10px;border:1px solid var(--border);border-radius:8px;font-size:12px}.report-btn{font-size:12px;padding:6px 10px}.report-ok{font-size:12px;color:var(--accent);margin-left:6px;white-space:nowrap}.tag-chip{display:inline-flex;align-items:center;vertical-align:middle;background:var(--primary-soft);color:var(--primary-dark);border-radius:999px;padding:2px 9px;margin-right:8px;font-size:11px;font-weight:700}.tag-chip.danger{background:#fff0f4;color:#d6336c}.tag-chip button{font-size:13px;line-height:1;color:inherit}.link-card{display:flex;align-items:center;gap:10px;margin-bottom:12px;border:1.5px solid var(--border);border-radius:10px;padding:10px 12px}.link-card:hover{border-color:var(--primary)}.link-card img{width:20px;height:20px;border-radius:4px;flex-shrink:0}.link-host{display:block;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.link-url{display:block;font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.poll{display:flex;flex-direction:column;gap:8px;margin:4px 0 12px}.poll-opt{position:relative;display:flex;align-items:center;gap:8px;border:1.5px solid var(--border);border-radius:10px;padding:10px 12px;text-align:left;overflow:hidden}.poll-opt:hover,.poll-opt.on{border-color:var(--primary)}.poll-fill{position:absolute;left:0;top:0;bottom:0;background:var(--primary-soft);transition:width .3s;z-index:0}.poll-label,.poll-pct{position:relative;z-index:1;font-size:14px;font-weight:500}.poll-pct{margin-left:auto;font-weight:700;color:var(--primary-dark)}.mod-panel{border-left:3px solid var(--primary)}.mod-panel input{width:100%}.feed-tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:0}.feed-tabs button{padding:10px 14px;font-weight:500;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}.feed-tabs button:hover{color:var(--text)}.feed-tabs button.active{color:var(--primary-dark);font-weight:700;border-bottom-color:var(--primary)}.welcome{text-align:center;padding:20px}.welcome .big-av{width:56px;height:56px;margin:0 auto 10px;font-size:20px}.welcome h4{font-size:15px;margin-bottom:4px}.welcome p{font-size:13px;color:var(--muted);margin-bottom:12px}.welcome-btn{width:100%}.login-wrap{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px}.login-card{background:var(--card);border-radius:20px;box-shadow:var(--shadow);padding:40px;width:100%;max-width:440px}.login-logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px}.login-logo-img{height:44px;width:auto;display:block}.login-card h1{font-size:22px;text-align:center;font-weight:800}.login-sub{text-align:center;color:var(--muted);font-size:13px;margin:8px 0 24px}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}.field input{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;outline:none;transition:border .15s}.field input:focus{border-color:var(--primary)}.compose-row{display:flex;gap:10px;margin-bottom:16px}.compose-row textarea{flex:1}.compose-row .btn{flex-shrink:0}.hint{font-size:12px;color:var(--muted);margin-top:6px}.error{background:#fff0f4;color:#d6336c;border:1px solid #ffc9d6;padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:16px}.ok{background:#eefbf3;color:#1a7f46;border:1px solid #b8ecd0;padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:16px}.login-tabs{display:flex;gap:6px;background:#f1eef8;border-radius:12px;padding:4px;margin-bottom:20px}.login-tabs .tab{flex:1;padding:9px 0;border:none;background:transparent;border-radius:9px;font-size:14px;font-weight:700;color:var(--muted);cursor:pointer}.login-tabs .tab.active{background:var(--card);color:var(--primary);box-shadow:0 1px 3px #00000014}.create-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.create-head h2{font-size:20px}.comm-select{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.comm-chip{padding:7px 14px;border-radius:999px;border:1.5px solid var(--border);font-size:13px;font-weight:600;color:var(--muted)}.comm-chip.active{background:var(--primary-soft);border-color:var(--primary);color:var(--primary-dark)}textarea{width:100%;resize:vertical}.comment-row{display:flex;gap:8px;border-top:1px solid var(--border);padding:8px 0}.comment-votes{width:36px;padding:4px 0;gap:0}.comment-votes .score{font-size:11px}.comment{display:flex;gap:10px;padding:4px 0;border-top:none;flex:1;min-width:0}.comment .avatar{flex-shrink:0}.comment .c-body{font-size:14px;line-height:1.5}.comment .c-meta{font-size:12px;color:var(--muted);margin-bottom:2px}.profile-page{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.profile-topbar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--border)}.profile-topbar-inner{max-width:1180px;margin:0 auto;padding:0 20px;height:56px;display:flex;align-items:center;gap:14px}.profile-logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:20px;color:var(--primary)}.profile-logo .logo-img{height:28px}.profile-back{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:14px;font-weight:500;margin-left:auto}.profile-back:hover{color:var(--primary-dark)}.profile-topbar-title{flex:1;text-align:center;font-size:16px;font-weight:700;color:var(--text)}.profile-gear{color:var(--muted);display:grid;place-items:center;padding:4px}.profile-gear:hover{color:var(--text)}.profile-topbar-user{display:flex;align-items:center;gap:8px}.profile-topbar-user .avatar-name{color:var(--muted);font-size:13px;font-weight:500}.profile-hero{position:relative}.profile-cover{background:var(--primary);height:110px}.profile-identity-wrap{position:relative}.profile-identity{display:flex;align-items:flex-end;gap:16px;margin-top:-52px}.profile-avatar{width:76px;height:76px;border-radius:50%;flex-shrink:0;background:#dcd2f5;border:3px solid #fff;display:grid;place-items:center;font-weight:700;font-size:26px;color:var(--primary-dark)}.profile-info{flex:1;min-width:0;padding-bottom:4px}.profile-name{font-size:20px;font-weight:700;color:var(--text);line-height:1.2}.profile-handle{color:var(--muted);font-size:13px;font-weight:500;margin-top:2px}.profile-bio{color:var(--text);font-size:12px;margin-top:4px;line-height:1.4}.profile-edit{display:none}.profile-body{padding-top:20px}.profile-stats{display:flex;justify-content:space-between;gap:8px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px 18px}.profile-stats div{display:flex;flex-direction:column;align-items:center;gap:2px}.profile-stats b{font-size:16px;font-weight:700}.profile-stats span{font-size:10px;font-weight:500;color:var(--muted);white-space:nowrap}.stat-following{display:none}.profile-edit-panel{margin-top:16px}.profile-tabs{display:flex;margin-top:20px;border-bottom:1px solid var(--border)}.profile-tabs button{flex:1;padding:14px 0;font-size:13px;font-weight:500;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;position:relative}.profile-tabs button.active{color:var(--primary);font-weight:700;border-bottom-color:var(--primary)}.profile-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px}.profile-posts,.profile-side{display:flex;flex-direction:column;gap:16px}.about-card h3{font-size:20px;font-weight:700;margin-bottom:12px}.about-card .about-body{font-size:13px;color:var(--text);line-height:1.6;margin-bottom:12px}.about-meta{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;font-weight:500}.help-card{background:var(--primary-dark);border-radius:16px;padding:20px}.help-card .help-title{font-size:18px;font-weight:700;color:#fff;margin-bottom:6px}.help-card .help-body{font-size:12px;color:var(--primary-soft);margin-bottom:12px}.help-btn{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:var(--primary-dark);border-radius:18px;padding:8px 18px;font-size:12px;font-weight:700}.help-btn:hover{background:var(--primary-soft)}.comm-card{display:flex;gap:14px;align-items:center}.comm-card .banner{width:48px;height:48px;border-radius:12px;background:var(--primary);display:grid;place-items:center;color:#fff;font-weight:800;flex-shrink:0}.comm-card .banner--img{background-size:cover;background-position:center;color:transparent}.comm-card h4{font-size:15px}.comm-card p{font-size:13px;color:var(--muted)}.comm-meta{font-size:12px;color:var(--muted-2);margin-bottom:2px}.comm-card .btn{margin-left:auto;flex-shrink:0}.comm-banner-wrap{border-radius:14px;overflow:hidden;background:var(--card);border:1px solid var(--border)}.comm-banner{width:100%;height:160px;background:linear-gradient(135deg,var(--primary),#7c3aed);background-size:cover;background-position:center;display:grid;place-items:center}.comm-banner-letter{font-size:64px;font-weight:800;color:#ffffff4d}.comm-banner-info{display:flex;align-items:center;gap:14px;padding:12px 16px}.comm-banner-icon{width:56px;height:56px;border-radius:50%;border:3px solid var(--card);background:var(--primary);display:grid;place-items:center;color:#fff;font-weight:800;font-size:20px;flex-shrink:0;margin-top:-36px;background-size:cover;background-position:center}.comm-banner-info .btn{margin-left:auto;flex-shrink:0}.comm-hero{display:flex;gap:14px;align-items:center;margin-bottom:16px}.comm-hero .banner{width:56px;height:56px;border-radius:14px;background:var(--primary);display:grid;place-items:center;color:#fff;font-weight:800;font-size:20px;flex-shrink:0}.comm-hero .banner--img{background-size:cover;background-position:center;color:transparent}.comm-hero .btn{margin-left:auto;flex-shrink:0}.comm-hero h2{font-size:18px}.comm-meta{font-size:13px;color:var(--muted)}.bottomnav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:20;background:var(--card);border-top:1px solid var(--border);padding:6px 0 calc(6px + env(safe-area-inset-bottom))}.bottomnav a,.bottomnav .bnav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:9px;color:var(--muted);padding:4px;flex:1;min-height:52px}.bottomnav a.active{color:var(--primary);font-weight:700}.bottomnav .ico{font-size:20px;line-height:1;display:grid;place-items:center}.bottomnav .ico svg{display:block}@media (pointer: coarse){.btn,.action,.comm-chip,.tab{min-height:44px}.comm-chip{display:inline-flex;align-items:center;justify-content:center}.field input,.compose-row textarea,textarea{font-size:16px}}@media (min-width: 768px) and (max-width: 1199px){.layout{grid-template-columns:1fr 300px}.rail,.bottomnav{display:none}}@media (max-width: 767px){.layout{grid-template-columns:1fr}.side,.rail{display:none}.bottomnav{display:flex}body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}.topbar-nav a:not(.avatar-link){display:none}.topbar-bell{display:none}.topbar-inner{gap:12px;padding:0 12px}.field input{font-size:16px}.login-card{padding:28px 20px}.compose-row{flex-direction:column;align-items:stretch}.compose-row .btn{width:100%}.pw-row{flex-direction:column;align-items:stretch}.pw-row .btn{width:100%}.profile-logo,.profile-back,.profile-topbar-user{display:none}.profile-topbar-inner{padding:0 16px;gap:10px}.profile-edit.follow-btn{display:inline-flex;margin-left:auto;flex-shrink:0}.comm-card,.post-actions{flex-wrap:wrap}.vote-col{width:40px;padding:10px 4px}.vote-btn{width:28px;height:28px}.post-title{font-size:15px}}@media (min-width: 768px){.profile-page{padding-bottom:0}.profile-topbar-inner{height:64px}.profile-topbar-title,.profile-gear{display:none}.profile-logo{margin-right:28px}.profile-back{margin-left:0}.profile-cover{height:140px}.profile-identity-wrap{position:absolute;top:0;left:0;right:0}.profile-identity{margin-top:0;padding-top:24px;align-items:flex-end;gap:20px}.profile-avatar{width:96px;height:96px;font-size:34px;background:#bcb4d2;border-width:3px}.profile-name{font-size:24px}.profile-handle{font-size:14px;margin-top:4px}.profile-bio{font-size:13px;margin-top:6px}.profile-edit{display:inline-flex;margin-left:auto;flex-shrink:0;align-self:center;border:1.5px solid var(--primary);color:var(--primary);background:#fff;padding:9px 20px;border-radius:20px;font-size:13px;font-weight:600}.profile-edit:hover{background:var(--primary-soft)}.profile-edit.following{border-color:var(--border);color:var(--text)}.profile-edit.following:hover{border-color:var(--primary);color:var(--primary)}.profile-body{padding-top:28px}.profile-stats{border-radius:16px;padding:0 28px;justify-content:flex-start;height:64px}.profile-stats div{flex:1;align-items:flex-start;justify-content:center}.profile-stats b{font-size:18px}.profile-stats span{font-size:11px}.stat-following{display:flex}.profile-tabs{width:300px}.profile-grid{grid-template-columns:1fr 360px;margin-top:24px}}
