:root{--bg-paper:#fcfaf2;--bg-paper-dark:#f5f2e9;--bg-card:#fff;--text-primary:#1c1d21;--text-secondary:#586069;--text-light:#fff;--accent:#0269fa;--accent-hover:#0056cc;--accent-light:#e6f0ff;--border-color:#e3e6e8;--border-hover:#cbd5e1;--font-serif:"Playfair Display", Georgia, serif;--font-sans:"Be Vietnam Pro", "Inter", -apple-system, sans-serif;--shadow-sm:0 2px 8px #0000000a;--shadow-md:0 10px 30px #00000014;--shadow-lg:0 20px 50px #0000001f;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--transition:all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast:all .15s ease}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-sans);background-color:var(--bg-paper);color:var(--text-primary);line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);color:var(--text-primary);font-weight:700}a{color:inherit;text-decoration:none}.container{max-width:1280px;margin:0 auto;padding:0 24px}.header-glass{z-index:100;backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);transition:var(--transition);background-color:#fcfaf2d9;position:sticky;top:0}.header-active{box-shadow:var(--shadow-sm);background-color:#fcfaf2f2}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-paper)}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}.ereader-mockup-container{perspective:1000px;justify-content:center;align-items:center;display:flex}.ereader-mockup{width:320px;height:440px;box-shadow:var(--shadow-lg);border:12px solid #2d3139;border-radius:20px;flex-direction:column;padding:24px;transition:background-color .5s,border-color .5s,transform .5s;display:flex;position:relative;overflow:hidden}.ereader-mockup:after{content:"";pointer-events:none;background-color:var(--frontlight-color,#fff0);mix-blend-mode:multiply;z-index:10;transition:background-color .3s;position:absolute;inset:0}.ereader-screen{user-select:none;background-color:#f7f6f0;border-radius:4px;flex-direction:column;flex:1;justify-content:space-between;padding:20px;display:flex;position:relative;box-shadow:inset 0 2px 8px #0000001a}.ereader-content{font-family:var(--font-serif);color:#1a1a1a;text-align:justify;font-size:.9rem;line-height:1.5}.ereader-content p{margin-bottom:12px}.ereader-footer{color:#888;border-top:1px solid #0000000f;justify-content:space-between;align-items:center;padding-top:8px;font-size:.7rem;display:flex}.ereader-buttons{z-index:20;flex-direction:column;gap:12px;display:flex;position:absolute;top:50%;right:-10px;transform:translateY(-50%)}.ereader-button{cursor:pointer;width:8px;height:48px;transition:var(--transition-fast);background-color:#111;border-radius:4px 0 0 4px}.ereader-button:hover{background-color:var(--accent)}.btn{font-family:var(--font-sans);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:none;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:.95rem;font-weight:600;display:inline-flex}.btn-primary{background-color:var(--accent);color:var(--text-light)}.btn-primary:hover{background-color:var(--accent-hover);transform:translateY(-2px);box-shadow:0 4px 12px #0269fa33}.btn-secondary{background-color:var(--bg-paper-dark);color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover{border-color:var(--border-hover);background-color:#eae6db}.btn-shopee{color:#fff;background-color:#ff5722}.btn-shopee:hover{background-color:#f4511e;transform:translateY(-2px);box-shadow:0 4px 12px #f4511e33}.btn-mdst{color:#fff;background-color:#0b783f}.btn-mdst:hover{background-color:#086032;transform:translateY(-2px);box-shadow:0 4px 12px #08603233}.product-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:32px;margin-top:40px;display:grid}.product-card{background-color:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-color);transition:var(--transition);flex-direction:column;padding:24px;display:flex;position:relative}.product-card:hover{box-shadow:var(--shadow-md);border-color:var(--border-hover);transform:translateY(-8px)}.product-badge{background-color:var(--accent-light);color:var(--accent);text-transform:uppercase;border-radius:20px;padding:4px 10px;font-size:.75rem;font-weight:700;position:absolute;top:16px;right:16px}.product-card-title{margin:16px 0 8px;font-size:1.4rem}.product-card-price{color:var(--accent);margin-bottom:16px;font-size:1.25rem;font-weight:700}.specs-table{border-collapse:collapse;width:100%;margin:20px 0;font-size:.9rem}.specs-table tr{border-bottom:1px solid var(--border-color)}.specs-table td{padding:12px 8px}.specs-table td:first-child{color:var(--text-secondary);width:35%;font-weight:600}.modal-overlay{backdrop-filter:blur(8px);z-index:200;background-color:#1c1d2199;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--bg-card);border-radius:var(--radius-lg);width:100%;max-width:900px;max-height:90vh;box-shadow:var(--shadow-lg);animation:.3s cubic-bezier(.4,0,.2,1) modalFadeIn;position:relative;overflow-y:auto}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-close-btn{background-color:var(--bg-paper-dark);cursor:pointer;width:36px;height:36px;transition:var(--transition-fast);z-index:10;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:24px;right:24px}.modal-close-btn:hover{background-color:#cbd5e1}.compare-tray{color:#fff;z-index:150;background-color:#1c1d21;padding:16px 0;transition:transform .3s cubic-bezier(.4,0,.2,1);position:fixed;bottom:0;left:0;right:0;transform:translateY(100%);box-shadow:0 -10px 40px #0000004d}.compare-tray.active{transform:translateY(0)}.pulse-glow{position:relative}.pulse-glow:after{content:"";border-radius:inherit;border:2px solid var(--accent);animation:2s cubic-bezier(.215,.61,.355,1) infinite pulse-ring;position:absolute;inset:0}@keyframes pulse-ring{0%{opacity:1;transform:scale(.95)}to{opacity:0;transform:scale(1.2)}}.gallery-tab-container{justify-content:center;gap:12px;margin-bottom:24px;display:flex}.gallery-tab-btn{font-family:var(--font-sans);border:1px solid var(--border-color);background-color:var(--bg-card);color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);border-radius:20px;padding:8px 20px;font-size:.85rem;font-weight:600}.gallery-tab-btn:hover{border-color:var(--border-hover);color:var(--text-primary)}.gallery-tab-btn.active{background-color:var(--accent-light);border-color:var(--accent);color:var(--accent)}.gallery-main-image-wrapper{background-color:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-color);box-shadow:var(--shadow-md);height:440px;transition:var(--transition);justify-content:center;align-items:center;margin-bottom:20px;padding:24px;display:flex;position:relative;overflow:hidden}.gallery-main-image{object-fit:contain;border-radius:8px;max-width:100%;max-height:100%;transition:transform .3s}.gallery-main-image:hover{transform:scale(1.03)}.gallery-thumbnails{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.gallery-thumbnail-btn{background-color:var(--bg-card);border:2px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;height:70px;transition:var(--transition-fast);justify-content:center;align-items:center;padding:4px;display:flex;overflow:hidden}.gallery-thumbnail-btn:hover{border-color:var(--border-hover)}.gallery-thumbnail-btn.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-light)}.gallery-thumbnail-img{object-fit:contain;border-radius:4px;max-width:100%;max-height:100%}.related-videos-section{border-top:1px solid var(--border-color);margin-top:56px;padding-top:48px}.video-cards-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:24px;margin-top:24px;display:grid}.video-card-vertical{border-radius:var(--radius-md);aspect-ratio:9/16;cursor:pointer;box-shadow:var(--shadow-md);transition:var(--transition);background-color:#111;border:1px solid #2d3139;position:relative;overflow:hidden}.video-card-vertical:hover{box-shadow:var(--shadow-lg);border-color:var(--accent);transform:translateY(-6px)}.video-card-overlay{color:#fff;z-index:2;background:linear-gradient(#0000001a 60%,#000000d9 100%);flex-direction:column;justify-content:flex-end;padding:16px;display:flex;position:absolute;inset:0}.video-card-play-btn{backdrop-filter:blur(8px);color:#fff;opacity:0;width:56px;height:56px;transition:var(--transition);background-color:#ffffff40;border:1px solid #fff6;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.9)}.video-card-vertical:hover .video-card-play-btn{opacity:1;transform:translate(-50%,-50%)scale(1)}.video-card-badge{backdrop-filter:blur(4px);color:#fff;background-color:#000000a6;border:1px solid #ffffff26;border-radius:20px;align-items:center;gap:4px;padding:4px 10px;font-size:.75rem;font-weight:700;display:flex;position:absolute;top:12px;left:12px}.video-card-title{font-family:var(--font-sans);color:#fff;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:8px;font-size:.85rem;font-weight:600;line-height:1.4;display:-webkit-box;overflow:hidden}.video-card-stats{color:#a0aec0;justify-content:space-between;font-size:.75rem;display:flex}.video-modal-content-vertical{border-radius:var(--radius-lg);aspect-ratio:9/16;width:100%;max-width:400px;max-height:90vh;box-shadow:var(--shadow-lg);background-color:#000;border:1px solid #2d3139;animation:.3s cubic-bezier(.4,0,.2,1) modalFadeIn;position:relative;overflow:hidden}.video-player-tag{object-fit:cover;width:100%;height:100%}