@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";
.blogview-comments-section{border-top:2px solid var(--blog-detail-border);margin-top:3rem;padding-top:3rem}.blogview-comments-header{align-items:center;gap:.75rem;margin-bottom:2rem;display:flex}.blogview-comments-header svg{color:var(--blog-detail-primary);font-size:1.5rem}.blogview-comments-header h2{color:var(--blog-detail-text);letter-spacing:-.01em;margin:0;font-size:1.75rem;font-weight:700}.blogview-comment-form{background:var(--blog-detail-bg-light);border-radius:var(--blog-detail-radius);border:1px solid var(--blog-detail-border);margin-bottom:2.5rem;padding:2rem}.blogview-comment-form-user{background:var(--blog-detail-bg);border:1px solid var(--blog-detail-border);border-radius:10px;flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1.5rem;padding:.75rem 1rem;display:flex}.blogview-comment-form-user svg{color:var(--blog-detail-primary);font-size:1rem}.blogview-comment-form-user span:first-of-type{color:var(--blog-detail-text);flex:1;min-width:120px;font-weight:600}.blogview-comment-form-user-email{color:var(--blog-detail-text-muted);flex:1;min-width:150px;font-size:.875rem;font-weight:400}.blogview-comment-form-change-user{border:1px solid var(--blog-detail-primary);color:var(--blog-detail-primary);cursor:pointer;transition:var(--blog-detail-transition);background:0 0;border-radius:8px;padding:.375rem .875rem;font-size:.875rem;font-weight:600}.blogview-comment-form-change-user:hover{background:var(--blog-detail-primary);color:#fff}.blogview-comment-form-row{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem;display:grid}.blogview-comment-form-field{flex-direction:column;gap:.5rem;display:flex}.blogview-comment-form-field label{color:var(--blog-detail-text);align-items:center;gap:.5rem;font-size:.95rem;font-weight:600;display:flex}.blogview-comment-form-field label svg{color:var(--blog-detail-primary);font-size:.875rem}.blogview-comment-form-field .required{color:#ef4444}.blogview-comment-form-field input,.blogview-comment-form-field textarea{border:1px solid var(--blog-detail-border);transition:var(--blog-detail-transition);background:var(--blog-detail-bg);color:var(--blog-detail-text);border-radius:10px;padding:.875rem 1rem;font-family:inherit;font-size:.95rem}.blogview-comment-form-field input:focus,.blogview-comment-form-field textarea:focus{border-color:var(--blog-detail-primary);outline:none;box-shadow:0 0 0 3px #2563eb1a}.blogview-comment-form-field textarea{resize:vertical;min-height:100px}.blogview-comment-form-field small{color:var(--blog-detail-text-muted);margin-top:-.25rem;font-size:.85rem}.blogview-comment-form-account-note{color:var(--blog-detail-primary);margin-top:.25rem;font-style:italic;display:block}.blogview-comment-checkbox-label{cursor:pointer;color:var(--blog-detail-text);align-items:center;gap:.5rem;margin-top:.5rem;font-size:.875rem;font-weight:400;display:flex}.blogview-comment-checkbox-label input[type=checkbox]{cursor:pointer;width:18px;height:18px;accent-color:var(--blog-detail-primary)}.blogview-comment-checkbox-label span{-webkit-user-select:none;user-select:none}.blogview-comment-submit-btn{background:linear-gradient(135deg,var(--blog-detail-primary),var(--blog-detail-primary-dark));color:#fff;cursor:pointer;transition:var(--blog-detail-transition);border:none;border-radius:10px;align-items:center;gap:.5rem;margin-top:1rem;padding:.875rem 2rem;font-size:.95rem;font-weight:600;display:inline-flex}.blogview-comment-submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px #2563eb4d}.blogview-comment-submit-btn:disabled{opacity:.6;cursor:not-allowed}.blogview-comment-submit-btn .spinning{animation:.8s linear infinite spin}.blogview-comments-list{flex-direction:column;gap:1.5rem;display:flex}.blogview-comments-loading,.blogview-comments-empty{text-align:center;color:var(--blog-detail-text-muted);padding:3rem 2rem}.blogview-comments-loading svg,.blogview-comments-empty svg{color:var(--blog-detail-text-light);margin-bottom:1rem;font-size:2.5rem}.blogview-comments-empty svg{opacity:.5}.blogview-comment-item{background:var(--blog-detail-bg);border-radius:var(--blog-detail-radius);border:1px solid var(--blog-detail-border);transition:var(--blog-detail-transition);padding:1.5rem}.blogview-comment-item:hover{box-shadow:var(--blog-detail-shadow-sm);border-color:#2563eb33}.blogview-comment-item-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.blogview-comment-item-author{align-items:center;gap:.5rem;display:flex}.blogview-comment-item-author svg{color:var(--blog-detail-primary);font-size:.875rem}.blogview-comment-item-author strong{color:var(--blog-detail-text);font-size:.95rem;font-weight:600}.blogview-comment-item-date{color:var(--blog-detail-text-muted);font-size:.85rem}.blogview-comment-item-content{color:var(--blog-detail-text);white-space:pre-wrap;word-wrap:break-word;font-size:.95rem;line-height:1.7}.blogview-comments-load-more{justify-content:center;margin-top:1.5rem;display:flex}.blogview-comments-load-more-btn{background:var(--blog-detail-bg);border:1px solid var(--blog-detail-border);color:var(--blog-detail-primary);cursor:pointer;transition:var(--blog-detail-transition);border-radius:10px;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.9rem;font-weight:600;display:inline-flex}.blogview-comments-load-more-btn:hover:not(:disabled){background:var(--blog-detail-primary);color:#fff;border-color:var(--blog-detail-primary);transform:translateY(-1px)}.blogview-comments-load-more-btn:disabled{opacity:.6;cursor:not-allowed}.blogview-comments-load-more-btn .spinning{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:768px){.blogview-comments-section{margin-top:2rem;padding-top:2rem}.blogview-comment-form{padding:1.5rem}.blogview-comment-form-row{grid-template-columns:1fr}.blogview-comment-item{padding:1.25rem}.blogview-comment-item-header{flex-direction:column;align-items:flex-start}}
:root{--blog-detail-primary:#2563eb;--blog-detail-primary-dark:#1e40af;--blog-detail-primary-light:#3b82f6;--blog-detail-secondary:#8b5cf6;--blog-detail-success:#10b981;--blog-detail-warning:#f59e0b;--blog-detail-text:#0f172a;--blog-detail-text-muted:#64748b;--blog-detail-text-light:#94a3b8;--blog-detail-bg:#fff;--blog-detail-bg-light:#f8fafc;--blog-detail-border:#e5e7eb;--blog-detail-shadow-sm:0 2px 8px #0000000a;--blog-detail-shadow-md:0 4px 16px #00000014;--blog-detail-shadow-lg:0 10px 40px #0000001f;--blog-detail-shadow-xl:0 20px 60px #2563eb26;--blog-detail-radius:16px;--blog-detail-transition:all .3s cubic-bezier(.4,0,.2,1)}.blogview-detail-container{background:linear-gradient(#fff 0%,#f8fafc 100%);max-width:900px;min-height:100vh;margin:0 auto;padding:3rem 1.5rem;font-family:Inter,system-ui,-apple-system,sans-serif;position:relative}.blogview-detail-container:before{content:"";opacity:1;z-index:0;pointer-events:none;background-image:radial-gradient(circle at 20%,#2563eb08 0%,#0000 50%),radial-gradient(circle at 80% 80%,#8b5cf608 0%,#0000 50%),radial-gradient(circle at 40% 20%,#10b98105 0%,#0000 50%);background-size:100% 100%;position:absolute;inset:0}.blogview-detail-container>*{z-index:1;position:relative}.blogview-detail-header{margin-bottom:2rem}.blogview-backLink{color:var(--blog-detail-primary);transition:var(--blog-detail-transition);background:#2563eb0d;border:1px solid #2563eb33;border-radius:10px;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex}.blogview-backLink:hover{background:var(--blog-detail-primary);color:#fff;border-color:var(--blog-detail-primary);box-shadow:var(--blog-detail-shadow-md);transform:translate(-2px)}.blogview-backLink svg{font-size:.875rem}.blogview-detail-article{background:var(--blog-detail-bg);border-radius:var(--blog-detail-radius);box-shadow:var(--blog-detail-shadow-lg);border:1px solid var(--blog-detail-border);padding:3rem;position:relative;overflow:hidden}.blogview-detail-article:before{content:"";background:linear-gradient(90deg,var(--blog-detail-primary),var(--blog-detail-secondary));height:4px;position:absolute;top:0;left:0;right:0}.blogview-detail-header-content{border-bottom:2px solid var(--blog-detail-bg-light);margin-bottom:2.5rem;padding-bottom:2rem}.blogview-detail-title{color:var(--blog-detail-text);letter-spacing:-.02em;background:linear-gradient(135deg,var(--blog-detail-text)0%,var(--blog-detail-primary)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 1.5rem;font-size:clamp(2rem,5vw,3rem);font-weight:800;line-height:1.2}.blogview-detail-meta{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.blogview-detail-badge{color:var(--blog-detail-primary-dark);background:linear-gradient(135deg,#2563eb1a,#3b82f61a);border:1px solid #2563eb33;border-radius:999px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.9rem;font-weight:600;display:inline-flex}.blogview-detail-badge svg{font-size:.75rem}.blogview-detail-date{color:var(--blog-detail-text-muted);align-items:center;gap:.5rem;font-size:.9rem;font-weight:500;display:inline-flex}.blogview-detail-date svg{color:var(--blog-detail-text-light);font-size:.8rem}.blogview-detail-status{border-radius:999px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.9rem;font-weight:600;display:inline-flex}.blogview-detail-status.published{color:#059669;background:linear-gradient(135deg,#10b9811a,#0596691a);border:1px solid #10b98133}.blogview-detail-status.draft{color:#d97706;background:linear-gradient(135deg,#f59e0b1a,#d977061a);border:1px solid #f59e0b33}.blogview-detail-status svg{font-size:.75rem}.blogview-detail-content{color:var(--blog-detail-text);font-size:1.05rem;line-height:1.9}.blogview-detail-content h2{color:var(--blog-detail-text);letter-spacing:-.01em;border-top:2px solid var(--blog-detail-bg-light);margin-top:2.5rem;margin-bottom:1rem;padding-top:1rem;font-size:1.875rem;font-weight:700;line-height:1.3}.blogview-detail-content h3{color:var(--blog-detail-text);letter-spacing:-.01em;margin-top:2rem;margin-bottom:.75rem;font-size:1.5rem;font-weight:700;line-height:1.4}.blogview-detail-content h4{color:var(--blog-detail-text);margin-top:1.5rem;margin-bottom:.75rem;font-size:1.25rem;font-weight:600;line-height:1.4}.blogview-detail-content p{color:var(--blog-detail-text);margin-bottom:1.25rem}.blogview-detail-content ul,.blogview-detail-content ol{color:var(--blog-detail-text);margin:1.25rem 0;padding-left:2rem}.blogview-detail-content li{margin-bottom:.75rem;line-height:1.8}.blogview-detail-content a{color:var(--blog-detail-primary);transition:var(--blog-detail-transition);border-bottom:2px solid #0000;font-weight:600;text-decoration:none}.blogview-detail-content a:hover{border-bottom-color:var(--blog-detail-primary);color:var(--blog-detail-primary-dark)}.blogview-detail-content strong{color:var(--blog-detail-text);font-weight:700}.blogview-detail-content em{color:var(--blog-detail-text-muted);font-style:italic}.blogview-detail-content blockquote{border-left:4px solid var(--blog-detail-primary);background:var(--blog-detail-bg-light);color:var(--blog-detail-text-muted);border-radius:0 10px 10px 0;margin:1.5rem 0;padding:1.25rem 1.5rem;font-style:italic}.blogview-detail-content code{background:var(--blog-detail-bg-light);color:var(--blog-detail-primary-dark);border-radius:6px;padding:.2rem .5rem;font-family:Courier New,monospace;font-size:.9em}.blogview-detail-content pre{background:var(--blog-detail-bg-light);border:1px solid var(--blog-detail-border);border-radius:10px;margin:1.5rem 0;padding:1.25rem;overflow-x:auto}.blogview-detail-content pre code{color:var(--blog-detail-text);background:0 0;padding:0}.blogview-detail-content img{max-width:100%;height:auto;box-shadow:var(--blog-detail-shadow-md);border-radius:12px;margin:2rem 0}.blogview-detail-content table{border-collapse:collapse;width:100%;box-shadow:var(--blog-detail-shadow-sm);border-radius:10px;margin:1.5rem 0;overflow:hidden}.blogview-detail-content table th,.blogview-detail-content table td{text-align:left;border-bottom:1px solid var(--blog-detail-border);padding:.75rem 1rem}.blogview-detail-content table th{background:var(--blog-detail-bg-light);color:var(--blog-detail-text);font-weight:600}.blogview-detail-content table tr:last-child td{border-bottom:none}.blogview-loading{text-align:center;color:var(--blog-detail-text-muted);flex-direction:column;align-items:center;gap:1rem;padding:4rem 2rem;font-size:1.1rem;display:flex}.blogview-loading-spinner{border:4px solid #2563eb1a;border-top-color:var(--blog-detail-primary);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.blogview-error{text-align:center;color:#dc2626;border-radius:var(--blog-detail-radius);background:linear-gradient(135deg,#ef44441a,#dc26261a);border:1px solid #ef444433;margin-bottom:1.5rem;padding:2rem;font-weight:500}@media (max-width:768px){.blogview-detail-container{padding:2rem 1rem}.blogview-detail-article{padding:2rem 1.5rem}.blogview-detail-title{font-size:2rem}.blogview-detail-meta{gap:.75rem}.blogview-detail-content{font-size:1rem}.blogview-detail-content h2{font-size:1.5rem}.blogview-detail-content h3{font-size:1.25rem}}@media (max-width:480px){.blogview-detail-container{padding:1.5rem 1rem}.blogview-detail-article{padding:1.5rem 1.25rem}.blogview-detail-title{font-size:1.75rem}.blogview-detail-meta{flex-direction:column;align-items:flex-start;gap:.5rem}.blogview-backLink span{display:none}}
