:root{--primary:#4a9eff;--primary-light:#e8f4ff;--primary-dark:#2d7dd2;--bg:#f5f9fc;--bg-white:#fff;--text:#1a2b3c;--text-muted:#6b7c8d;--border:#d4e3f0;--shadow:0 2px 8px #4a9eff14;--shadow-hover:0 4px 16px #4a9eff26;--radius:10px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.header{background:var(--bg-white);border-bottom:1px solid var(--border);z-index:100;position:sticky;top:0}.header-container{justify-content:space-between;align-items:center;max-width:1100px;height:64px;margin:0 auto;padding:0 24px;display:flex}.header-logo{color:var(--primary);letter-spacing:-.02em;font-size:1.3rem;font-weight:700}.header-nav{align-items:center;gap:16px;display:flex}.header-user{align-items:center;gap:12px;display:flex}.header-username{color:var(--text-muted);font-size:.9rem;font-weight:500}.btn-logout{border:1px solid var(--border);cursor:pointer;color:var(--text-muted);background:0 0;border-radius:6px;padding:6px 14px;font-size:.85rem;transition:all .2s}.btn-logout:hover{border-color:var(--primary);color:var(--primary)}.home-page{max-width:1100px;margin:0 auto;padding:40px 24px}.articles-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px;display:grid}.article-card{background:var(--bg-white);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;transition:box-shadow .2s,transform .2s;display:flex;overflow:hidden}.article-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}.article-card-image{object-fit:cover;width:100%;height:200px}.article-card-body{flex-direction:column;flex:1;padding:20px 24px 24px;display:flex}.article-card-title{color:var(--text);margin-bottom:8px;font-size:1.15rem;font-weight:700;line-height:1.3}.article-card-excerpt{color:var(--text-muted);flex:1;margin-bottom:16px;font-size:.9rem;line-height:1.5}.btn-continue{background:var(--primary);color:#fff;text-align:center;border-radius:6px;align-self:flex-start;padding:8px 20px;font-size:.88rem;font-weight:600;transition:background .2s;display:inline-block}.btn-continue:hover{background:var(--primary-dark)}.article-page{max-width:780px;margin:0 auto;padding:40px 24px 80px}.article-hero{border-radius:var(--radius);object-fit:cover;width:100%;max-height:420px;margin-bottom:28px}.article-title{margin-bottom:12px;font-size:2rem;font-weight:800;line-height:1.25}.article-meta{align-items:center;gap:16px;margin-bottom:28px;display:flex}.article-date{color:var(--text-muted);font-size:.9rem}.btn-share{background:var(--primary-light);color:var(--primary);cursor:pointer;border:none;border-radius:6px;padding:6px 16px;font-size:.85rem;font-weight:600;transition:background .2s}.btn-share:hover{background:#d0e8ff}.article-content{white-space:pre-wrap;color:var(--text);font-size:1.05rem;line-height:1.8}.comments-section{border-top:1px solid var(--border);margin-top:48px;padding-top:32px}.comments-title{margin-bottom:20px;font-size:1.3rem;font-weight:700}.comment-form{margin-bottom:24px}.comment-input{border:1px solid var(--border);border-radius:var(--radius);resize:vertical;background:var(--bg-white);width:100%;padding:12px 16px;font-family:inherit;font-size:.95rem;transition:border-color .2s}.comment-input:focus{border-color:var(--primary);outline:none}.comment-input:disabled{background:var(--bg);cursor:not-allowed}.btn-comment{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;margin-top:10px;padding:10px 24px;font-size:.9rem;font-weight:600;transition:background .2s}.btn-comment:hover:not(:disabled){background:var(--primary-dark)}.btn-comment:disabled{opacity:.5;cursor:not-allowed}.login-hint{color:var(--text-muted);margin-bottom:24px;font-size:.9rem}.link-btn{color:var(--primary);cursor:pointer;background:0 0;border:none;padding:0;font-size:.9rem;font-weight:600;text-decoration:underline}.comments-list{flex-direction:column;gap:14px;display:flex}.no-comments{color:var(--text-muted);font-size:.9rem}.comment-card{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}.comment-header{justify-content:space-between;margin-bottom:8px;display:flex}.comment-author{font-size:.9rem;font-weight:600}.comment-user-id{color:var(--text-muted);opacity:.5;-webkit-user-select:all;user-select:all;margin-top:2px;font-size:.72rem;font-weight:400;display:block}.comment-date{color:var(--text-muted);font-size:.8rem}.comment-text{font-size:.92rem;line-height:1.5}.status-msg{text-align:center;color:var(--text-muted);padding:60px 24px;font-size:1rem}.status-msg.error{color:#e74c3c}.modal-overlay{z-index:200;background:#0006;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal{background:var(--bg-white);border-radius:var(--radius);width:100%;max-width:400px;padding:32px;position:relative;box-shadow:0 8px 32px #00000026}.modal-close{cursor:pointer;color:var(--text-muted);background:0 0;border:none;font-size:1.5rem;line-height:1;position:absolute;top:12px;right:16px}.modal-title{margin-bottom:20px;font-size:1.3rem;font-weight:700}.modal-error{color:#e74c3c;background:#fdf0ef;border-radius:6px;margin-bottom:12px;padding:8px 12px;font-size:.88rem}.modal-input{border:1px solid var(--border);border-radius:6px;width:100%;margin-bottom:12px;padding:10px 14px;font-family:inherit;font-size:.92rem;transition:border-color .2s}.modal-input:focus{border-color:var(--primary);outline:none}.modal-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;width:100%;margin-top:4px;padding:10px;font-size:.95rem;font-weight:600;transition:background .2s}.modal-btn:hover:not(:disabled){background:var(--primary-dark)}.modal-btn:disabled{opacity:.6;cursor:not-allowed}.modal-toggle{text-align:center;color:var(--text-muted);margin-top:16px;font-size:.88rem}.modal-toggle button{color:var(--primary);cursor:pointer;background:0 0;border:none;font-weight:600;text-decoration:underline}@media (width<=700px){.articles-grid{grid-template-columns:1fr}.article-title{font-size:1.5rem}}