.article-page{max-width:900px;margin:0 auto .3rem;padding:0 0 0 2rem;background:var(--color-surface-light);color:var(--color-text-light);transition:background .2s,color .2s}body.dark-mode .article-page{background:var(--color-surface-dark-alt);color:var(--color-text-dark)}.article-header{margin-bottom:2.5rem;margin-top:0;padding-top:0}.article-hero{width:100%;height:320px;margin-bottom:2rem;overflow:hidden;border-radius:14px}.article-hero-img{width:100%;height:100%;object-fit:cover;display:block}.hero-image-wrapper{will-change:transform;transform:translateZ(0);backface-visibility:hidden}.hero-image{content-visibility:auto;contain-intrinsic-size:700px 500px;border-radius:12px}.hero-image[fetchpriority=high]{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.article-page .article-header .article-title{font-size:2.5rem;font-weight:700;margin-bottom:2rem;margin-top:0;padding-top:2rem;color:inherit;line-height:1.2}@media (max-width:1400px){.article-page .article-header .article-title{font-size:2.2rem}}@media (max-width:1200px){.article-page .article-header .article-title{font-size:2rem}}@media (max-width:1024px){.article-page .article-header .article-title{font-size:1.8rem}}@media (max-width:700px){.article-page{padding:.5rem 1rem;margin:0 0 .5rem;border-radius:0}.article-page .article-header .article-title{font-size:1.8rem;font-weight:700}.article-page .article-meta{font-size:1rem;gap:1rem;flex-direction:column;align-items:flex-start}.article-description{font-size:1.1rem}}@media (max-width:480px){.article-page .article-header .article-title{font-size:1.6rem;font-weight:700}}.article-description{font-size:1.2rem;color:var(--color-muted-light);margin:1.5rem 0;line-height:1.6}body.dark-mode .article-description{color:var(--color-muted-dark)}.article-page .article-meta{font-size:1.1rem;color:var(--color-muted-light);display:flex;gap:2rem;align-items:center}body.dark-mode .article-page .article-meta{color:var(--color-muted-dark)}.article-author{display:flex;align-items:center;gap:.5rem}.author-type{font-size:.9rem;opacity:.8;text-transform:capitalize}.article-keywords{margin:2rem 0;display:flex;flex-wrap:wrap;gap:.5rem}.keyword-tag{background:var(--color-surface-light-alt);color:var(--color-text-light);padding:.4rem .8rem;border-radius:6px;font-size:.9rem;transition:background .2s,color .2s}body.dark-mode .keyword-tag{background:var(--color-surface-dark-alt);color:var(--color-text-dark)}.article-content{font-size:1.2rem;line-height:1.7}.article-content pre{background:var(--color-surface-light-alt);padding:1rem;border-radius:8px;overflow-x:auto;font-size:.9rem;line-height:1.5}body.dark-mode .article-content pre{background:var(--color-surface-dark-alt)}.article-body{font-size:1.2rem;line-height:1.7}.article-body ul{margin:1.2rem 0 1.2rem 1.5rem;padding:0}.article-body li{margin-bottom:.7rem}.article-body a{color:var(--color-link-light)!important;text-decoration:underline;transition:color .2s ease}.article-body a:hover{color:var(--color-link-hover-light)!important}body.light-mode .article-body a{color:var(--color-link-light)!important}body.light-mode .article-body a:hover{color:var(--color-link-hover-light)!important}body.dark-mode .article-body a{color:var(--color-link-dark)!important}body.dark-mode .article-body a:hover{color:var(--color-link-hover-dark)!important}.article-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;color:var(--color-muted-light)}body.dark-mode .article-loading{color:var(--color-muted-dark)}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-border-light);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}body.dark-mode .loading-spinner{border-color:var(--color-border-dark)}@keyframes spin{to{transform:rotate(1turn)}}.article-not-found{text-align:center;padding:3rem 0}.article-not-found h1{font-size:2rem;margin-bottom:1rem;color:inherit}.article-not-found p{color:var(--color-muted-light);margin-bottom:2rem}body.dark-mode .article-not-found p{color:var(--color-muted-dark)}.back-button{margin-top:0;padding:.8rem 1.5rem;background:var(--color-section-light);color:var(--color-section-text-light);border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,background .2s}body.dark-mode .back-button{background:var(--color-section-dark);color:var(--color-section-text-dark)}.back-button:hover{transform:translateY(-2px);background:var(--color-section-active-light);color:var(--color-section-active-text)}body.dark-mode .back-button:hover{background:var(--color-section-active-dark);color:var(--color-section-active-text)}@media (min-width:1400px){.article-page{max-width:900px}}.article-content a{color:var(--color-link-light);text-decoration:none;transition:color .2s ease}.article-content a:hover{color:var(--color-link-hover-light);text-decoration:underline}body.dark-mode .article-content a{color:var(--color-link-dark)}body.dark-mode .article-content a:hover{color:var(--color-link-hover-dark)}.article-content .article-heading{font-family:inherit;font-weight:700;color:inherit;margin-top:1.5rem;margin-bottom:.8rem;line-height:1.25}.article-content h1.article-heading{font-size:2.1rem;padding-top:.5rem;padding-bottom:.3rem}.article-content h2.article-heading{font-size:1.7rem;margin-top:1.2rem;margin-bottom:.6rem}.article-content h3.article-heading{font-size:1.35rem;font-weight:700;margin-top:1rem;margin-bottom:.5rem}.article-content h4.article-heading{font-size:1.25rem;font-weight:700;margin-top:.8rem;margin-bottom:.4rem}.article-content h5.article-heading,.article-content h6.article-heading{font-size:1rem;font-weight:600;color:var(--color-muted-light);margin-top:.6rem;margin-bottom:.3rem}.article-content .article-paragraph{padding-bottom:.5rem;padding-top:.5rem}@media (max-width:700px){.article-content h1.article-heading{font-size:1.6rem}.article-content h2.article-heading{font-size:1.4rem}.article-content h3.article-heading{font-size:1.25rem}}.article-img-zoom:not(.hero-image){max-width:480px;max-height:480px;width:100%;height:auto;display:block;margin:2rem auto;border-radius:12px}.dashboard-article-layout{max-width:900px;margin:0 auto;padding:0 20px}@media (max-width:500px){.article-page{padding:.5rem 0;margin:0 0 .5rem}.dashboard-article-layout{padding:0 8px}}.editable-block{position:relative;transition:all .2s ease}.editable-block.editable{cursor:pointer;border-radius:8px;padding:4px;margin:2px 0}.editable-block.editable:hover{background-color:rgba(0,0,0,.05);box-shadow:0 2px 8px rgba(0,0,0,.1)}body.dark-mode .editable-block.editable:hover{background-color:rgba(255,255,255,.05);box-shadow:0 2px 8px rgba(0,0,0,.3)}.editable-block.editable:after{content:"Double-click to edit";position:absolute;top:-20px;right:0;font-size:12px;color:#666;opacity:0;transition:opacity .2s ease;pointer-events:none}body.dark-mode .editable-block.editable:after{color:#999}.editable-block.editable:hover:after{opacity:1}.editable-block-editing{position:relative;background:var(--color-surface-light);border:2px solid #007bff;border-radius:8px;padding:16px;margin:8px 0;box-shadow:0 4px 16px rgba(0,123,255,.2)}body.dark-mode .editable-block-editing{background:var(--color-surface-dark-alt);border-color:#4dabf7;box-shadow:0 4px 16px rgba(77,171,247,.2)}.editable-textarea{width:100%;min-height:100px;padding:12px;border:1px solid #ddd;border-radius:6px;font-family:inherit;font-size:inherit;line-height:1.5;resize:vertical;background:var(--color-surface-light);color:var(--color-text-light);transition:border-color .2s ease}body.dark-mode .editable-textarea{background:var(--color-surface-dark);color:var(--color-text-dark);border-color:#444}.editable-textarea:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px rgba(0,123,255,.1)}body.dark-mode .editable-textarea:focus{border-color:#4dabf7;box-shadow:0 0 0 3px rgba(77,171,247,.1)}.image-edit-form{display:flex;flex-direction:column;gap:16px}.image-edit-form .form-group{display:flex;flex-direction:column;gap:6px}.image-edit-form label{font-weight:500;color:var(--color-text-light);font-size:14px}body.dark-mode .image-edit-form label{color:var(--color-text-dark)}.image-edit-input{padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color .2s ease,box-shadow .2s ease;background:var(--color-surface-light);color:var(--color-text-light)}body.dark-mode .image-edit-input{background:var(--color-surface-dark);color:var(--color-text-dark);border-color:#444}.image-edit-input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px rgba(0,123,255,.1)}body.dark-mode .image-edit-input:focus{border-color:#4dabf7;box-shadow:0 0 0 3px rgba(77,171,247,.1)}.editable-controls{display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.cancel-button,.save-button{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.save-button{background-color:#007bff;color:white}.save-button:hover:not(:disabled){background-color:#0056b3;transform:translateY(-1px)}.save-button:disabled{background-color:#6c757d;cursor:not-allowed;transform:none}.cancel-button{background-color:#6c757d;color:white}.cancel-button:hover{background-color:#545b62;transform:translateY(-1px)}body.dark-mode .save-button{background-color:#4dabf7}body.dark-mode .save-button:hover:not(:disabled){background-color:#3b8fd9}body.dark-mode .cancel-button{background-color:#495057}body.dark-mode .cancel-button:hover{background-color:#343a40}.editable-image-block{position:relative;cursor:pointer;transition:all .2s ease;border-radius:8px;overflow:hidden}.editable-image-block:hover{box-shadow:0 4px 20px rgba(0,0,0,.15);transform:translateY(-2px)}.editable-image-block:hover .image-actions-overlay{opacity:1!important;visibility:visible!important}.editable-image-block:hover .image-caption{background:rgba(0,0,0,.8)!important}.editable-image-block .article-image-wrapper{position:relative;display:block}.image-caption{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.7);color:white;padding:.75rem 1rem;font-size:.875rem;line-height:1.4;display:flex;align-items:center;justify-content:space-between;transition:background .2s ease;z-index:5}body.dark-mode .image-caption{background:rgba(0,0,0,.8)}.caption-text{flex:1;margin-right:.5rem}.caption-edit-btn{background:none;border:none;color:white;font-size:.875rem;cursor:pointer;padding:.25rem;border-radius:4px;transition:all .2s ease;opacity:.8}.caption-edit-btn:hover{opacity:1;background:rgba(255,255,255,.1);transform:scale(1.1)}.image-actions-overlay{position:absolute;top:.75rem;right:.75rem;display:flex;gap:.5rem;opacity:0;visibility:hidden;transition:all .2s ease;z-index:10}.image-edit-btn,.image-remove-btn{width:32px;height:32px;border:none;border-radius:6px;font-size:.875rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.image-edit-btn{background:rgba(59,130,246,.9);color:white}.image-edit-btn:hover{background:rgba(59,130,246,1);transform:translateY(-1px) scale(1.05);box-shadow:0 4px 12px rgba(59,130,246,.3)}.image-remove-btn{background:rgba(239,68,68,.9);color:white}.image-remove-btn:hover{background:rgba(239,68,68,1);transform:translateY(-1px) scale(1.05);box-shadow:0 4px 12px rgba(239,68,68,.3)}body.dark-mode .image-edit-btn{background:rgba(59,130,246,.8)}body.dark-mode .image-edit-btn:hover{background:rgba(59,130,246,.95)}body.dark-mode .image-remove-btn{background:rgba(239,68,68,.8)}body.dark-mode .image-remove-btn:hover{background:rgba(239,68,68,.95)}@media (max-width:768px){.image-actions-overlay{opacity:1;top:.5rem;right:.5rem}.image-edit-btn,.image-remove-btn{width:28px;height:28px;font-size:.75rem}.image-caption{padding:.5rem .75rem;font-size:.8rem}}@keyframes editPulse{0%{box-shadow:0 4px 16px rgba(0,123,255,.2)}50%{box-shadow:0 4px 20px rgba(0,123,255,.4)}to{box-shadow:0 4px 16px rgba(0,123,255,.2)}}.editable-block-editing{animation:editPulse 2s ease-in-out infinite}.title-textarea{font-size:2.5rem;font-weight:700;line-height:1.2;min-height:80px}.description-textarea{font-size:1.1rem;line-height:1.6;min-height:60px}.article-list{padding-left:3rem;list-style:disc}.article-list ol{list-style:decimal}.article-list-item{margin-bottom:1rem;line-height:1.6;display:list-item;color:var(--color-text-light)}body.dark-mode .article-list-item{color:var(--color-text-dark)}.article-list .article-list{padding-left:2.5rem}.article-list .article-list .article-list-item{margin-bottom:.2rem}.article-paragraph ol,.article-paragraph ul{padding-left:3rem;padding-right:3rem;list-style:decimal}.article-list,.article-paragraph ul{list-style:disc}.article-paragraph li{margin-bottom:0;line-height:1.6;display:list-item;color:var(--color-text-light)}.article-paragraph code{background:var(--color-surface-light-alt);color:var(--color-text-light);padding:.125rem .25rem;border-radius:.25rem;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875em;border:1px solid var(--color-border-light)}body.dark-mode .article-paragraph code{background:var(--color-surface-dark-alt);color:var(--color-text-dark);border-color:var(--color-border-dark)}.article-paragraph b,.article-paragraph strong{font-weight:700;color:var(--color-text-light)}.article-paragraph em,.article-paragraph i{font-style:italic;color:var(--color-text-light)}body.dark-mode .article-paragraph b,body.dark-mode .article-paragraph em,body.dark-mode .article-paragraph i,body.dark-mode .article-paragraph strong{color:var(--color-text-dark)}.article-paragraph a{color:var(--color-primary);text-decoration:underline;text-decoration-color:rgba(59,130,246,.4);transition:all .2s ease}.article-paragraph a:hover{color:var(--color-primary-dark);text-decoration-color:var(--color-primary-dark)}body.dark-mode .article-paragraph a{color:var(--color-primary);text-decoration-color:rgba(77,171,247,.4)}body.dark-mode .article-paragraph a:hover{color:var(--color-primary-light);text-decoration-color:var(--color-primary-light)}body.dark-mode .article-paragraph li{color:var(--color-text-dark)}.article-paragraph ol ol,.article-paragraph ul ul{padding-left:2.5rem}.article-paragraph ol ol li,.article-paragraph ul ul li{margin-bottom:.4rem}.article-check-list{list-style:none;padding:0;margin:1rem 0}.article-check-list-item{display:flex;align-items:flex-start;margin-bottom:.5rem;gap:.5rem}.check-list-checkbox{margin:.2rem 0 0;flex-shrink:0}.article-quote{border-left:4px solid #007bff;padding:1rem 1rem 1rem 1.5rem;margin:1.5rem 0;font-style:italic;background:rgba(0,123,255,.05);border-radius:0 8px 8px 0;position:relative}body.dark-mode .article-quote{border-left-color:#4dabf7;background:rgba(77,171,247,.05)}.article-paragraph blockquote{border-left:4px solid var(--color-primary);padding:1rem 1rem 1rem 1.5rem;margin:1.5rem 0;font-style:italic;background:rgba(59,130,246,.05);border-radius:0 8px 8px 0;color:var(--color-text-light)}body.dark-mode .article-paragraph blockquote{background:rgba(77,171,247,.05);color:var(--color-text-dark)}.article-paragraph hr{border:none;height:1px;background:var(--color-border-light);margin:2rem 0;opacity:.6}body.dark-mode .article-paragraph hr{background:var(--color-border-dark)}.article-paragraph sub{font-size:.75em;vertical-align:sub;line-height:0}.article-paragraph sup{font-size:.75em;vertical-align:super;line-height:0}.article-paragraph dl{margin:1rem 0}.article-paragraph dt{font-weight:600;color:var(--color-text-light);margin-top:1rem;margin-bottom:.25rem}.article-paragraph dd{margin-left:1.5rem;margin-bottom:.5rem;color:var(--color-text-light);line-height:1.6}body.dark-mode .article-paragraph dd,body.dark-mode .article-paragraph dt{color:var(--color-text-dark)}.article-quote p{margin:0 0 .5rem}.article-quote cite{font-size:.9rem;color:#666;font-style:normal}body.dark-mode .article-quote cite{color:#999}.article-code-block{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:1rem;margin:1rem 0;overflow-x:auto;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem;line-height:1.4}body.dark-mode .article-code-block{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.article-code-block code{background:none;padding:0;border:none;font-family:inherit}.block-delete-button{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:rgba(220,53,69,.8);color:white;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;opacity:0;transition:all .2s ease;z-index:10;box-shadow:0 1px 3px rgba(0,0,0,.2);backdrop-filter:blur(4px)}body.dark-mode .block-delete-button{background:rgba(231,76,60,.8);box-shadow:0 1px 3px rgba(0,0,0,.3)}.block-delete-button:hover{background:rgba(220,53,69,.9);transform:scale(1.1);box-shadow:0 2px 6px rgba(0,0,0,.3)}body.dark-mode .block-delete-button:hover{background:rgba(231,76,60,.9);box-shadow:0 2px 6px rgba(0,0,0,.4)}.editable-block:hover .block-delete-button{opacity:.7}.editable-block:hover .block-delete-button:hover{opacity:1}@media (max-width:768px){.editable-controls{flex-direction:column}.cancel-button,.save-button{width:100%}.editable-block.editable:after{display:none}.title-textarea{font-size:1.8rem}.block-delete-button{opacity:0;width:24px;height:24px;font-size:14px}.editable-block:hover .block-delete-button{opacity:.7}.editable-block:hover .block-delete-button:hover{opacity:1}}.content-block-wrapper{position:relative;transition:all .2s ease}.content-block-wrapper.dragging{opacity:.8}.editable-block.dragging{opacity:.7;transform:scale(1.02);box-shadow:0 8px 25px rgba(0,0,0,.15);border:2px solid rgba(0,123,255,.3)}body.dark-mode .editable-block.dragging{box-shadow:0 8px 25px rgba(0,0,0,.4);border-color:rgba(77,171,247,.3)}.article-table-wrapper{margin:20px 0;overflow-x:auto}.article-table{width:100%;border-collapse:collapse;border:1px solid #ddd;background:var(--color-surface-light);color:var(--color-text-light)}body.dark-mode .article-table{background:var(--color-surface-dark);color:var(--color-text-dark);border-color:#444}.article-table td,.article-table th{padding:12px;text-align:left;border:1px solid #ddd}body.dark-mode .article-table td,body.dark-mode .article-table th{border-color:#444}.article-table th{background-color:#f8f9fa;font-weight:600}body.dark-mode .article-table th{background-color:#2c2c2c}.article-table tr:nth-child(2n){background-color:#f8f9fa}body.dark-mode .article-table tr:nth-child(2n){background-color:#2c2c2c}.article-table tr:hover{background-color:#e9ecef}body.dark-mode .article-table tr:hover{background-color:#3c3c3c}.article-paragraph table{width:100%;border-collapse:collapse;border:1px solid #ddd;background:var(--color-surface-light);color:var(--color-text-light);margin:16px 0}body.dark-mode .article-paragraph table{background:var(--color-surface-dark);color:var(--color-text-dark);border-color:#444}.article-paragraph table td,.article-paragraph table th{padding:12px;text-align:left;border:1px solid #ddd}body.dark-mode .article-paragraph table td,body.dark-mode .article-paragraph table th{border-color:#444}.article-paragraph table th{background-color:#f8f9fa;font-weight:600}body.dark-mode .article-paragraph table th{background-color:#2c2c2c}.article-paragraph table tr:nth-child(2n){background-color:#f8f9fa}body.dark-mode .article-paragraph table tr:nth-child(2n){background-color:#2c2c2c}.article-paragraph table tr:hover{background-color:#e9ecef}body.dark-mode .article-paragraph table tr:hover{background-color:#3c3c3c}.article-paragraph{overflow-x:auto}.featured-image-insert-zone{margin:2rem 0 1rem}.featured-image-actions{position:absolute;top:.75rem;right:.75rem;display:flex;gap:.5rem;z-index:10}.edit-featured-image-btn,.remove-featured-image-btn{padding:.5rem .75rem;border:none;border-radius:6px;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 2px 8px rgba(0,0,0,.1)}.edit-featured-image-btn{background:var(--color-section-light);color:var(--color-section-text-light);border:1px solid var(--color-border-light)}.edit-featured-image-btn:hover{background:var(--color-section-active-light);color:var(--color-section-active-text);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}body.dark-mode .edit-featured-image-btn{background:var(--color-section-dark);color:var(--color-section-text-dark);border-color:var(--color-border-dark)}body.dark-mode .edit-featured-image-btn:hover{background:var(--color-section-active-dark);color:var(--color-section-active-text);box-shadow:0 4px 12px rgba(0,0,0,.3)}.remove-featured-image-btn{background:rgba(239,68,68,.9);color:white}.remove-featured-image-btn:hover{background:rgba(239,68,68,1);transform:translateY(-1px);box-shadow:0 4px 12px rgba(239,68,68,.3)}.dashboard-featured-image-preview{position:relative;border-radius:12px;overflow:hidden;border:2px solid var(--color-border-light);box-shadow:0 4px 16px rgba(0,0,0,.08);background:var(--color-surface-light);transition:all .3s ease;margin:1rem 0}.dashboard-featured-image-preview:hover{box-shadow:0 8px 24px rgba(0,0,0,.12);transform:translateY(-2px)}body.dark-mode .dashboard-featured-image-preview{border-color:var(--color-border-dark);background:var(--color-surface-dark);box-shadow:0 4px 16px rgba(0,0,0,.2)}body.dark-mode .dashboard-featured-image-preview:hover{box-shadow:0 8px 24px rgba(0,0,0,.3)}.dashboard-featured-image-preview-img{width:100%;height:auto;max-height:400px;min-height:200px;object-fit:cover;display:block;transition:transform .3s ease}.dashboard-featured-image-preview:hover .dashboard-featured-image-preview-img{transform:scale(1.02)}.dashboard-featured-image-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.9));color:white;padding:1.5rem 1rem .75rem;font-size:.875rem;line-height:1.4;font-weight:500}@media (max-width:768px){.featured-image-actions{position:static;justify-content:center;margin-top:.75rem}.edit-featured-image-btn,.remove-featured-image-btn{flex:1;text-align:center}}