:root{--primary-600: #dc2626;--primary-700: #b91c1c;--primary-800: #991b1b;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--blue-500: #3b82f6;--blue-600: #2563eb;--green-500: #10b981;--yellow-400: #fbbf24;--font-family-sans: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;animation:none!important;transition:none!important;transform:none!important}html{scroll-behavior:auto!important;font-size:16px;line-height:1.5;height:100%;-webkit-text-size-adjust:100%}body{font-family:var(--font-family-sans);font-size:1rem;line-height:1.6;color:var(--gray-700);background-color:var(--gray-50);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden;min-height:100vh;height:100%;scroll-behavior:auto!important}a{text-decoration:none;transition:var(--transition-fast)}*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;transition-delay:0s!important}.main-toolbar{position:sticky;top:0;z-index:30;background-color:#fffffff2;backdrop-filter:blur(16px);border-bottom:1px solid var(--gray-200);box-shadow:var(--shadow-sm)}.toolbar-container{max-width:800px;margin:0 auto;padding:var(--space-3) var(--space-4);display:flex;align-items:center;justify-content:space-between}.toolbar-left{display:flex;align-items:center;gap:var(--space-4)}.back-button{display:inline-flex;align-items:center;gap:var(--space-2);background-color:var(--gray-100);color:var(--gray-700);padding:var(--space-2) var(--space-4);border-radius:var(--radius-lg);border:none;cursor:pointer;font-weight:500;text-decoration:none}.back-button:hover{background-color:var(--gray-200)}.toolbar-right{display:flex;align-items:center;gap:var(--space-3)}.toolbar-button{width:2.5rem;height:2.5rem;background-color:var(--gray-100);color:var(--gray-700);border-radius:var(--radius-lg);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.toolbar-button:hover{background-color:var(--gray-200)}.toolbar-button.primary{background:var(--blue-500);color:#fff}.toolbar-button.primary:hover{background:var(--blue-600)}.reading-area{background-color:#fff;min-height:100vh;contain:layout style paint;padding:0 var(--space-4)}.webtoon-reader{max-width:800px;width:100%;margin:0 auto;background-color:#fff;position:relative;will-change:scroll-position;transform:translateZ(0)}.page-image-container{position:relative;display:block;width:100%;border-bottom:1px solid var(--gray-100);contain:layout style paint}.page-image{width:100%;height:auto;display:block;object-fit:contain;background-color:#fff;transition:none!important;animation:none!important;transform:none!important;image-rendering:crisp-edges;image-rendering:-webkit-optimize-contrast}.page-image.loading{opacity:.8;filter:none}.page-image.loaded{opacity:1;filter:none}.floating-controls{position:fixed;bottom:var(--space-6);left:50%;transform:translate(-50%);z-index:40;display:flex;gap:var(--space-3);padding:var(--space-3);background-color:#fffffff2;backdrop-filter:blur(12px);border-radius:var(--radius-full);box-shadow:var(--shadow-lg);border:1px solid var(--gray-200)}.floating-control{width:3rem;height:3rem;background-color:var(--gray-100);border:none;border-radius:50%;color:var(--gray-700);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:none!important;transform:none!important}.floating-control:hover,.floating-control.active{background-color:var(--blue-500);color:#fff}.webtoon-scroll-indicator{position:fixed;top:0;left:0;height:4px;background:linear-gradient(90deg,var(--primary-600),var(--yellow-400),var(--green-500));z-index:50;transition:width .1s linear;will-change:width}.chapter-navigation{background-color:#fff;border-top:1px solid var(--gray-200);padding:var(--space-16) 0}.navigation-container{max-width:800px;margin:0 auto;padding:0 var(--space-4)}.navigation-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-4);align-items:center}.navigation-item{display:flex;justify-content:center}.navigation-item.center{display:flex;justify-content:center;align-items:center}.navigation-card{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6);background:linear-gradient(135deg,var(--gray-50) 0%,var(--gray-100) 100%);border-radius:var(--radius-2xl);text-decoration:none;border:2px solid transparent;color:var(--gray-700);font-weight:600;transition:none!important;transform:none!important;min-width:140px;justify-content:center}.navigation-card:hover{border-color:var(--blue-500);box-shadow:var(--shadow-lg);color:var(--blue-600)}.navigation-disabled{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6);background:var(--gray-100);border-radius:var(--radius-2xl);color:var(--gray-400);border:2px solid var(--gray-200);font-weight:600;min-width:140px;justify-content:center}.navigation-icon-only{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;background:linear-gradient(135deg,var(--gray-50) 0%,var(--gray-100) 100%);border-radius:50%;text-decoration:none;border:2px solid transparent;color:var(--gray-600);transition:none!important;transform:none!important}.navigation-icon-only:hover{border-color:var(--blue-500);background:linear-gradient(135deg,#eff6ff,#dbeafe);color:var(--blue-600);box-shadow:var(--shadow-md)}.navigation-icon-container{width:2rem;height:2rem;background-color:transparent;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit}.navigation-icon-only .navigation-icon-container{width:1.5rem;height:1.5rem}.navigation-title{font-weight:600;color:var(--gray-900);margin-bottom:var(--space-1)}.navigation-subtitle{font-size:.875rem;color:var(--gray-500)}.navigation-label{font-size:.75rem;color:var(--gray-500);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-1)}.toast-notification{position:fixed;bottom:var(--space-4);right:var(--space-4);z-index:1000;padding:var(--space-3) var(--space-6);border-radius:var(--radius-xl);color:#fff;font-weight:600;font-size:.875rem;box-shadow:var(--shadow-xl);backdrop-filter:blur(12px);max-width:20rem;transition:opacity .1s ease;transform:translateY(0)}.toast-notification.show{opacity:1}.toast-success{background:var(--green-500)}.toast-info{background:var(--blue-500)}.toast-warning{background:var(--yellow-400);color:var(--gray-900)}@media (min-width: 769px) and (max-width: 1024px){.webtoon-reader,.toolbar-container,.navigation-container{max-width:700px}}@media (min-width: 1025px){.webtoon-reader,.toolbar-container,.navigation-container{max-width:800px}.reading-area{padding:0 var(--space-8)}}@media (min-width: 1440px){.reading-area{padding:0 var(--space-12)}}@media (max-width: 768px){.chapter-header{padding:var(--space-6) 0;min-height:50vh}.header-content{padding:0 var(--space-3)}.metadata-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-2)}.toolbar-container{max-width:100%;padding:var(--space-2) var(--space-3)}.reading-area{padding:0}.webtoon-reader{max-width:100%;margin:0}.page-image-container{border-bottom:none}.floating-controls{bottom:var(--space-4);padding:var(--space-2)}.floating-control{width:2.5rem;height:2.5rem}.chapter-navigation{padding:var(--space-8) 0}.navigation-container{max-width:100%;padding:0 var(--space-3)}.navigation-grid{grid-template-columns:1fr auto 1fr;gap:var(--space-2)}.navigation-card,.navigation-disabled{padding:var(--space-3) var(--space-4);min-width:100px;font-size:.875rem}.navigation-icon-only{width:3rem;height:3rem}.navigation-icon-container{width:1.5rem;height:1.5rem}.navigation-icon-only .navigation-icon-container{width:1.25rem;height:1.25rem}}@media (max-width: 480px){.badge-container{gap:var(--space-2)}.badge{font-size:.75rem;padding:var(--space-1) var(--space-3)}.breadcrumb-nav{font-size:.75rem}.floating-controls{left:var(--space-4);right:var(--space-4);transform:none;justify-content:space-around}.navigation-grid{grid-template-columns:1fr auto 1fr;gap:var(--space-1)}.navigation-card,.navigation-disabled{padding:var(--space-2) var(--space-3);min-width:80px;font-size:.75rem}.navigation-icon-only{width:2.5rem;height:2.5rem}}.fullscreen-mode .webtoon-reader,.fullscreen-mode .toolbar-container,.fullscreen-mode .navigation-container{max-width:100%!important}.wide-reading-mode .webtoon-reader{max-width:1000px}.narrow-reading-mode .webtoon-reader{max-width:600px}.page-image,.webtoon-scroll-indicator,.floating-controls{will-change:transform;transform:translateZ(0)}.page-image-container{contain:layout style paint}.webtoon-reader{contain:layout style}.page-image[loading=lazy]{content-visibility:auto;contain-intrinsic-size:1px 800px}*,*:before,*:after,.floating-control,.navigation-card,.toolbar-button,.page-image,.badge,.breadcrumb-link{animation:none!important;transition:none!important;transform:none!important}.toast-notification{transition:opacity .1s ease!important}.webtoon-scroll-indicator{transition:width .1s linear!important}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto!important}}@media (prefers-contrast: high){.chapter-header{background:#000;color:#fff}.toolbar-button,.floating-control{border:2px solid #000000}}@media print{.main-toolbar,.floating-controls,.webtoon-scroll-indicator{display:none!important}.page-image{max-width:100%!important;page-break-inside:avoid}}@supports (-webkit-overflow-scrolling: touch){body{-webkit-overflow-scrolling:touch}}@media screen and (max-width: 768px){body{overscroll-behavior-y:contain}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hidden{display:none!important}@media (max-width: 640px){.sm\:inline{display:inline!important}.sm\:block{display:block!important}}
