.article-page{max-width:800px;margin:0 auto;padding:2rem 1rem}.article-container{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.article-loading{font-size:1.125rem;color:#6b7280}.article-error,.article-loading{text-align:center;padding:4rem 2rem}.article-error h1{font-size:1.5rem;color:#dc2626;margin-bottom:1rem}.article-error p{color:#6b7280}.article-error p,.article-hero{margin-bottom:2rem}.article-image-container{width:100%;height:400px;overflow:hidden;position:relative}@media(max-width:768px){.article-image-container{height:250px}}.article-image{width:100%;height:100%;object-fit:cover;display:block}.article-header{padding:2rem 2rem 1rem}@media(max-width:768px){.article-header{padding:1.5rem 1.5rem .5rem}}.article-meta{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}.article-date,.article-updated{color:#6b7280;font-size:.875rem;font-weight:500}.article-title{font-size:2.25rem;font-weight:700;line-height:1.2;color:#1f2937;margin:0}@media(max-width:768px){.article-title{font-size:1.875rem}}.article-content{padding:0 2rem}@media(max-width:768px){.article-content{padding:0 1.5rem}}.prose{color:#374151;line-height:1.7;font-size:1.125rem}.prose h1,.prose h2,.prose h3,.prose h4,.prose h5,.prose h6{color:#1f2937;font-weight:600;margin-top:2.5rem;margin-bottom:1rem;line-height:1.3}.prose h1{font-size:2rem;border-bottom:2px solid #e5e7eb;padding-bottom:.5rem}.prose h2{font-size:1.5rem;border-bottom:1px solid #e5e7eb;padding-bottom:.25rem}.prose h3{font-size:1.25rem}.prose p{margin-bottom:1.5rem;text-align:justify}.prose blockquote{border-left:4px solid #3b82f6;padding:1rem 1.5rem;margin:2rem 0;font-style:italic;color:#6b7280;background:#f8fafc;border-radius:0 8px 8px 0}.prose blockquote p{margin-bottom:0}.prose ol,.prose ul{margin:1.5rem 0;padding-left:1.5rem}.prose ol li,.prose ul li{margin-bottom:.5rem;padding-left:.5rem}.prose ul{list-style-type:disc}.prose ol{list-style-type:decimal}.prose a{color:#3b82f6;text-decoration:underline;transition:color .2s ease}.prose a:hover{color:#1d4ed8}.prose strong{font-weight:600;color:#1f2937}.prose em{font-style:italic;color:#6b7280}.prose code{background:#f3f4f6;padding:.125rem .25rem;border-radius:4px;font-size:.875em;color:#dc2626}.prose pre{background:#1f2937;color:#f9fafb;padding:1rem;border-radius:8px;overflow-x:auto;margin:1.5rem 0}.prose pre code{background:none;padding:0;color:inherit}.prose hr{border:none;border-top:2px solid #e5e7eb;margin:2.5rem 0}.prose img{max-width:100%;height:auto;border-radius:8px;margin:1.5rem 0}.prose table{width:100%;border-collapse:collapse;margin:1.5rem 0}.prose table td,.prose table th{padding:.75rem;border:1px solid #e5e7eb;text-align:left}.prose table th{background:#f9fafb;font-weight:600}.article-footer{padding:2rem;border-top:1px solid #e5e7eb;margin-top:2rem}@media(max-width:768px){.article-footer{padding:1.5rem}}.back-button{display:inline-flex;align-items:center;gap:.5rem;color:#3b82f6;text-decoration:none;font-weight:500;padding:.75rem 1.5rem;border:2px solid #3b82f6;border-radius:8px;transition:all .3s ease;background:#fff}.back-button:hover{background:#3b82f6;color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,.3)}.back-button:active{transform:translateY(0)}.article-loading{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.article-container{animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}