*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--green: #5cb85c;--green-dark: #449d44;--green-light: #f0faf0;--text: #373a3c;--text-muted: #687077;--text-light: #aaa;--border: #ddd;--bg: #f5f5f5;--white: #fff;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}.navbar{background:var(--white);border-bottom:1px solid var(--border);height:56px;display:flex;align-items:center}.navbar-inner{max-width:1140px;margin:0 auto;padding:0 15px;width:100%;display:flex;align-items:center;justify-content:space-between}.navbar-brand{font-size:1.25rem;font-weight:700;color:var(--green);letter-spacing:-.5px}.navbar-brand:hover{color:var(--green-dark)}.navbar-nav{display:flex;align-items:center;gap:4px;list-style:none}.nav-item a{padding:6px 10px;font-size:13px;color:var(--text-muted);border-radius:4px;display:flex;align-items:center;gap:4px;transition:color .15s}.nav-item a:hover,.nav-item a.active{color:var(--text)}.banner{background:var(--green);color:var(--white);text-align:center;padding:34px 15px}.banner h1{font-size:3.5rem;font-weight:700;letter-spacing:-1px;text-shadow:0 1px 3px rgba(0,0,0,.15);margin-bottom:8px;text-decoration:underline;text-underline-offset:4px}.banner p{font-size:1.25rem;font-weight:300;opacity:.9}.page-content{max-width:700px;margin:0 auto;padding:24px 15px;display:flex;flex-direction:column;gap:0}.sidebar-col{width:100%;margin-bottom:16px}.sidebar-box{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:16px}.sidebar-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:10px}.popular-tags{display:flex;flex-wrap:wrap;gap:5px}.popular-tag{font-size:12px;padding:2px 10px;border:1px solid rgba(0,0,0,.1);border-radius:20px;color:var(--text-muted);background:var(--white);cursor:pointer;transition:background .15s,color .15s}.popular-tag:hover,.popular-tag.selected{background:var(--green);color:var(--white);border-color:var(--green)}.feed-col{width:100%}.feed-toggle{display:flex;border-bottom:1px solid var(--border)}.feed-tab{padding:10px 16px;font-size:14px;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;background:none;border-top:none;border-left:none;border-right:none;font-family:var(--font);transition:color .15s,border-color .15s}.feed-tab.active{color:var(--green);border-bottom-color:var(--green)}.feed-tab:hover:not(.active){color:var(--text)}.article-preview{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:20px;margin-top:16px}.article-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.author-info{display:flex;align-items:center;gap:8px}.author-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;background:var(--border)}.author-details{display:flex;flex-direction:column}.author-name{font-size:13px;font-weight:600;color:var(--green);line-height:1.2}.author-name:hover{color:var(--green-dark);text-decoration:underline}.article-date{font-size:12px;color:var(--text-light)}.btn-like{display:flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--green);border-radius:3px;background:none;color:var(--green);font-size:13px;cursor:not-allowed;font-family:var(--font);transition:background .15s,color .15s;white-space:nowrap}.btn-like:hover{background:var(--green);color:var(--white)}.btn-like svg{width:14px;height:14px;fill:currentColor;flex-shrink:0}.article-title{font-size:1.25rem;font-weight:700;margin-bottom:6px;color:var(--text);line-height:1.3;cursor:pointer;transition:color .15s}.article-title:hover{color:var(--green-dark)}.article-description{font-size:14px;color:var(--text-muted);margin-bottom:16px;line-height:1.6;font-weight:300}.article-footer{display:flex;align-items:center;justify-content:space-between}.read-more{font-size:12px;color:var(--text-light);font-weight:300}.read-more:hover{color:var(--text-muted)}.tag-list{display:flex;flex-wrap:wrap;gap:4px}.tag-pill{font-size:12px;padding:1px 8px;border:1px solid var(--border);border-radius:20px;color:var(--text-light);background:var(--white);font-weight:300}.pagination{display:flex;justify-content:center;gap:4px;margin-top:20px;flex-wrap:wrap}.page-item{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--border);border-radius:3px;background:var(--white);color:var(--green);font-size:14px;cursor:pointer;font-family:var(--font);transition:background .15s,color .15s,border-color .15s;font-weight:400}.page-item:hover{background:var(--green-light);border-color:var(--green)}.page-item.active{background:var(--green);color:var(--white);border-color:var(--green)}.page-item:disabled{opacity:.5;cursor:not-allowed}.loading-state{padding:40px;text-align:center;color:var(--text-muted)}.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--green);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 12px}@keyframes spin{to{transform:rotate(360deg)}}.error-state{padding:20px;color:#a94442;background:#f2dede;border:1px solid #ebccd1;border-radius:4px;margin-top:16px}.btn-retry{margin-top:8px;padding:4px 12px;background:#a94442;color:#fff;border:none;border-radius:3px;cursor:pointer;font-size:13px;font-family:var(--font)}.article-page-banner{background:var(--green);color:var(--white);padding:32px 15px}.article-page-banner h1{max-width:1140px;margin:0 auto 16px;font-size:2.25rem;font-weight:700;letter-spacing:-.5px;line-height:1.2}.article-page-banner .article-meta{max-width:1140px;margin:0 auto}.article-page-banner .author-name{color:var(--white)}.article-page-banner .article-date{color:#ffffffb3}.article-page-banner .btn-like{border-color:#ffffffb3;color:var(--white)}.article-page-banner .btn-like:hover{background:#ffffff26}.article-body-wrap{max-width:1140px;margin:0 auto;padding:32px 15px 48px}.article-body-content{font-size:1rem;line-height:1.8;color:var(--text);margin-bottom:32px;border-bottom:1px solid var(--border);padding-bottom:32px}.article-body-content h1,.article-body-content h2,.article-body-content h3,.article-body-content h4{margin:1.5em 0 .5em;font-weight:700;line-height:1.3}.article-body-content p{margin-bottom:1em}.article-body-content ul,.article-body-content ol{margin:0 0 1em 1.5em}.article-body-content blockquote{border-left:4px solid var(--border);padding:.5em 1em;margin:1em 0;color:var(--text-muted);font-style:italic}.article-body-content code{background:#f5f5f5;padding:.1em .4em;border-radius:3px;font-size:.9em}.article-body-content pre{background:#2b2b2b;color:#f8f8f2;padding:1em;border-radius:4px;overflow-x:auto;margin-bottom:1em}.article-body-content pre code{background:none;color:inherit;padding:0}.article-body-content a{color:var(--green);text-decoration:underline}.article-body-content img{max-width:100%;margin:1em 0}.article-page-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:16px}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);margin-bottom:24px;padding:4px 0;transition:color .15s}.back-link:hover{color:var(--text)}.site-footer{border-top:1px solid var(--border);padding:20px 15px;text-align:center;font-size:12px;color:var(--text-light);background:var(--white)}.site-footer a{color:var(--green)}.auth-page{min-height:calc(100vh - 108px);display:flex;align-items:flex-start;justify-content:center;padding:40px 15px;background:var(--bg)}.auth-card{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:32px;width:100%;max-width:540px}.auth-card-wide{max-width:640px}.auth-title{font-size:1.625rem;font-weight:700;text-align:center;color:var(--text);margin-bottom:8px}.auth-switch{text-align:center;font-size:14px;color:var(--text-muted);margin-bottom:24px}.auth-switch a{color:var(--green)}.auth-switch a:hover{text-decoration:underline}.form-group{margin-bottom:16px}.form-group-check{margin-bottom:20px}.form-input{width:100%;padding:10px 14px;font-size:14px;font-family:var(--font);border:1px solid var(--border);border-radius:4px;color:var(--text);background:var(--white);transition:border-color .15s,box-shadow .15s;outline:none}.form-input:focus{border-color:#80bdff;box-shadow:0 0 0 3px #007bff26}.form-input.input-error{border-color:#dc3545}.form-input.input-error:focus{box-shadow:0 0 0 3px #dc354526}.form-input::placeholder{color:var(--text-light)}.form-textarea{resize:vertical;min-height:100px}.field-error{font-size:12px;color:#dc3545;margin-top:4px}.server-errors{background:#fdf3f3;border:1px solid #f5c6cb;border-radius:4px;padding:12px 16px;margin-bottom:16px;list-style:none;color:#721c24;font-size:13px}.server-errors li{margin-bottom:2px}.server-errors li:last-child{margin-bottom:0}.form-success{background:#d4edda;border:1px solid #c3e6cb;color:#155724;padding:10px 14px;border-radius:4px;font-size:14px;margin-bottom:16px}.btn-submit{width:100%;padding:10px 20px;background:var(--green);color:var(--white);border:none;border-radius:4px;font-size:1rem;font-weight:600;font-family:var(--font);cursor:pointer;transition:background .15s;margin-top:8px}.btn-submit:hover:not(:disabled){background:var(--green-dark)}.btn-submit:disabled{opacity:.65;cursor:not-allowed}.checkbox-label{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--text);cursor:pointer;line-height:1.4}.checkbox-label input[type=checkbox]{width:16px;height:16px;margin-top:2px;flex-shrink:0;accent-color:var(--green)}.checkbox-label.check-error{color:#dc3545}.btn-logout-block{background:none;border:none;color:#dc3545;font-size:14px;font-family:var(--font);cursor:pointer;padding:0}.btn-logout-block:hover{text-decoration:underline}.nav-icon{font-size:13px;opacity:.7}.nav-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1px solid var(--border);vertical-align:middle}.nav-btn-logout{background:none;border:none;font-family:var(--font);font-size:13px;color:var(--text-muted);cursor:pointer;padding:6px 10px;border-radius:4px;transition:color .15s}.nav-btn-logout:hover{color:#dc3545}.profile-banner{background:var(--bg);border-bottom:1px solid var(--border);text-align:center;padding:32px 15px 24px}.profile-avatar{width:100px;height:100px;border-radius:50%;object-fit:cover;border:3px solid var(--white);box-shadow:0 1px 4px #00000026;margin:0 auto 12px;display:block}.profile-username{font-size:1.25rem;font-weight:700;color:var(--text);margin-bottom:8px}.profile-bio{font-size:14px;color:var(--text-muted);max-width:480px;margin:0 auto 16px;line-height:1.6}.btn-edit-profile{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:1px solid var(--border);border-radius:4px;font-size:13px;color:var(--text-muted);background:var(--white);transition:all .15s}.btn-edit-profile:hover{border-color:var(--text-muted);color:var(--text)}.ap-wrapper{background:#fff}.ap-spacer{height:90px;background:#fff}.ap-banner{background:#333;padding:48px 16px}.ap-banner-inner{max-width:1140px;margin:0 auto;width:100%;padding-left:140px}.ap-title{font-size:2.5rem;font-weight:700;line-height:1.25;color:#fff;max-width:800px;margin-bottom:24px}.ap-banner-author{display:flex;align-items:center;gap:10px}.ap-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.ap-author-name{display:block;font-size:13px;font-weight:600;color:var(--green);line-height:1.3}.ap-author-name:hover{color:#7dd87d;text-decoration:underline}.ap-date{display:block;font-size:12px;color:#fff9;margin-top:2px}.ap-content{max-width:1280px;margin:0 auto;padding:48px 200px}.ap-body{font-size:1rem;line-height:1.8;color:var(--text);margin-bottom:32px}.ap-body h1,.ap-body h2,.ap-body h3,.ap-body h4{margin:1.5em 0 .5em;font-weight:700}.ap-body p{margin-bottom:1em}.ap-body ul,.ap-body ol{margin:0 0 1em 1.5em}.ap-body blockquote{border-left:4px solid var(--border);padding:.5em 1em;margin:1em 0;color:var(--text-muted);font-style:italic}.ap-body code{background:#f5f5f5;padding:.1em .4em;border-radius:3px;font-size:.9em}.ap-body pre{background:#2b2b2b;color:#f8f8f2;padding:1em;border-radius:4px;overflow-x:auto;margin-bottom:1em}.ap-body pre code{background:none;color:inherit;padding:0}.ap-body a{color:var(--green);text-decoration:underline}.ap-body img{max-width:100%;margin:1em 0}.ap-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:40px}.ap-footer{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px}.ap-footer-author{display:flex;align-items:center;gap:8px}.ap-footer-author-info{display:flex;flex-direction:column}.ap-footer-author-name{font-size:13px;font-weight:600;color:var(--green);line-height:1.3}.ap-footer-author-name:hover{text-decoration:underline;color:var(--green-dark)}.ap-footer-date{font-size:12px;color:var(--text-light)}.ap-footer-actions{display:flex;align-items:center;gap:8px}.ap-btn-edit{display:inline-flex;align-items:center;gap:4px;padding:5px 16px;border:1px solid var(--green);border-radius:4px;background:none;color:var(--green);font-size:13px;font-family:var(--font);text-decoration:none;cursor:pointer;transition:background .15s,color .15s}.ap-btn-edit:hover{background:var(--green);color:#fff}.ap-btn-delete{display:inline-flex;align-items:center;gap:4px;padding:5px 16px;border:1px solid #dc3545;border-radius:4px;background:none;color:#dc3545;font-size:13px;font-family:var(--font);text-decoration:none;cursor:pointer;transition:background .15s,color .15s}.ap-btn-delete:hover{background:#dc3545;color:#fff}.ap-btn-delete:disabled{opacity:.5;cursor:not-allowed}.form-textarea-tall{min-height:200px}.tags-preview{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.form-actions{display:flex;justify-content:flex-end;margin-top:8px}.btn-submit-right{width:auto;padding:10px 24px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:15px}.modal-box{background:#fff;border-radius:6px;padding:28px 32px;max-width:440px;width:100%;box-shadow:0 8px 32px #0000002e}.modal-title{font-size:1.25rem;font-weight:700;color:var(--text);margin-bottom:12px}.modal-text{font-size:14px;color:var(--text-muted);line-height:1.6;margin-bottom:24px}.modal-actions{display:flex;justify-content:flex-end;gap:10px}.btn-modal-cancel{padding:8px 20px;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--text-muted);font-size:14px;font-family:var(--font);cursor:pointer;transition:border-color .15s,color .15s}.btn-modal-cancel:hover{border-color:var(--text-muted);color:var(--text)}.btn-modal-confirm{padding:8px 20px;border:none;border-radius:4px;background:#dc3545;color:#fff;font-size:14px;font-weight:600;font-family:var(--font);cursor:pointer;transition:background .15s}.btn-modal-confirm:hover{background:#c82333}.ap-btn-favorite{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;border:none;border-radius:4px;background:var(--green);color:#fff;font-size:13px;font-family:var(--font);cursor:pointer;transition:background .15s}.ap-btn-favorite:hover:not(:disabled){background:var(--green-dark)}.ap-btn-favorite:disabled{opacity:.7;cursor:not-allowed}.ap-btn-favorite--active{background:var(--green-dark)!important}.btn-like--active{background:var(--green)!important;color:#fff!important;border-color:var(--green)!important;cursor:pointer}.btn-like:disabled{cursor:not-allowed;opacity:.7}.profile-banner{background:#333;border-bottom:none;text-align:center;padding:56px 15px 40px}.profile-avatar{width:130px;height:130px;border-radius:50%;object-fit:cover;border:3px solid rgba(255,255,255,.2);box-shadow:0 2px 8px #0000004d;margin:0 auto 16px;display:block}.profile-username{font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:8px}.profile-bio{color:#ffffffb3;font-size:14px;max-width:480px;margin:0 auto 16px;line-height:1.6}.btn-edit-profile{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:1px solid rgba(255,255,255,.4);border-radius:4px;font-size:13px;font-family:var(--font);color:#fffc;background:none;text-decoration:none;transition:all .15s;margin-top:4px}.btn-edit-profile:hover{background:#ffffff1a;color:#fff;border-color:#ffffffb3}.btn-follow{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;border:1px solid rgba(255,255,255,.4);border-radius:4px;background:none;color:#fffc;font-size:13px;font-family:var(--font);cursor:pointer;transition:all .15s;margin-top:4px}.btn-follow:hover{background:#ffffff1a;color:#fff;border-color:#ffffffb3}.btn-follow--active{background:var(--green);color:#fff;border-color:var(--green)}.btn-follow--active:hover{background:var(--green-dark);border-color:var(--green-dark)}.btn-follow:disabled{opacity:.7;cursor:not-allowed}.write-page{background:#fff;min-height:calc(100vh - 108px);padding:40px 15px}.write-card{max-width:600px;margin:0 auto}.write-field{margin-bottom:12px}.write-input{width:100%;padding:10px 16px;font-size:14px;font-family:var(--font);border:1px solid #aaaaaa;border-radius:4px;color:var(--text);background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}.write-input::placeholder{color:#aaa}.write-input:focus{border-color:#80bdff;box-shadow:0 0 0 3px #007bff1f}.write-input--error{border-color:#dc3545}.write-input--error:focus{box-shadow:0 0 0 3px #dc35451f}.write-textarea{resize:vertical;min-height:200px;line-height:1.6}.write-input--tags{border-radius:4px}.write-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.write-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border:1px solid #aaaaaa;border-radius:20px;font-size:12px;color:var(--text-muted);background:#fff}.write-tag-remove{background:none;border:none;font-size:14px;color:var(--text-light);cursor:pointer;padding:0;line-height:1;transition:color .15s}.write-tag-remove:hover{color:#dc3545}.write-error{font-size:12px;color:#dc3545;margin-top:4px}.write-actions{display:flex;justify-content:flex-end;margin-top:8px}.write-btn-publish{padding:8px 24px;background:#61bb61;color:#fff;border:1px solid #61bb61;border-radius:4px;font-size:1rem;font-weight:500;font-family:var(--font);cursor:pointer;transition:background .15s}.write-btn-publish:hover:not(:disabled){background:#4cae4c;border-color:#4cae4c}.write-btn-publish:disabled{opacity:.65;cursor:not-allowed}.settings-page{background:#fff;min-height:calc(100vh - 108px);padding:40px 15px}.settings-card{max-width:580px;margin:0 auto}.settings-title{font-size:1.625rem;font-weight:700;text-align:center;color:var(--text);margin-bottom:24px}.settings-field{margin-bottom:16px}.settings-input{width:100%;padding:10px 16px;font-size:14px;font-family:var(--font);border:1px solid #aaaaaa;border-radius:4px;color:var(--text);background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}.settings-input::placeholder{color:#aaa}.settings-input:focus{border-color:#80bdff;box-shadow:0 0 0 3px #007bff1f}.settings-input--error{border-color:#dc3545}.settings-input--error:focus{box-shadow:0 0 0 3px #dc35451f}.settings-textarea{resize:vertical;min-height:120px;line-height:1.6}.settings-error{font-size:12px;color:#dc3545;margin-top:4px}.settings-actions{display:flex;justify-content:flex-end;margin-top:8px}.settings-btn-submit{padding:8px 24px;background:#61bb61;color:#fff;border:1px solid #61bb61;border-radius:4px;font-size:1rem;font-weight:500;font-family:var(--font);cursor:pointer;transition:background .15s}.settings-btn-submit:hover:not(:disabled){background:#4cae4c;border-color:#4cae4c}.settings-btn-submit:disabled{opacity:.65;cursor:not-allowed}.settings-divider{border:none;border-top:1px solid var(--border);margin:24px 0}.settings-btn-logout{background:none;border:none;color:#bb6161;font-size:14px;font-family:var(--font);cursor:pointer;padding:0;transition:color .15s}.settings-btn-logout:hover{color:#a94442;text-decoration:underline}.btn-like{cursor:pointer!important}.btn-like:disabled{cursor:wait!important;opacity:1!important}.btn-like--active{background:var(--green)!important;color:#fff!important;border-color:var(--green)!important}.btn-like--active:hover{background:var(--green-dark)!important;border-color:var(--green-dark)!important}.author-name--guest{cursor:default!important;color:var(--green)}.author-name--guest:hover{text-decoration:none!important;color:var(--green)!important}.ap-author-name.author-name--guest{color:var(--green)!important}@media (max-width: 900px){.ap-banner{padding:48px 24px}.ap-content{padding:32px 24px}}@media (max-width: 768px){.banner h1{font-size:2.25rem}.page-content{padding:16px 15px}}.nav-icon-img{width:14px;height:14px;opacity:.7}